make page
This commit is contained in:
parent
47797bd9fe
commit
9de86b6c4d
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
node_modules/
|
||||||
|
package-lock.json
|
1
_media/css/chota.min.css
vendored
Symbolic link
1
_media/css/chota.min.css
vendored
Symbolic link
@ -0,0 +1 @@
|
|||||||
|
../../node_modules/chota/dist/chota.min.css
|
22
_media/css/styles.css
Normal file
22
_media/css/styles.css
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: 'F5.6';
|
||||||
|
src: url('/_media/fonts/F5.6-Regular.eot');
|
||||||
|
src: url('/_media/fonts/F5.6-Regular.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('/_media/fonts/F5.6-Regular.woff2') format('woff2'),
|
||||||
|
url('/_media/fonts/F5.6-Regular.woff') format('woff');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
font-display: swap;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.dark {
|
||||||
|
--bg-color: #000;
|
||||||
|
--bg-secondary-color: #131316;
|
||||||
|
--font-color: #f5f5f5;
|
||||||
|
--color-grey: #ccc;
|
||||||
|
--color-darkGrey: #777;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'F5.6';
|
||||||
|
}
|
BIN
_media/fonts/F5.6-Regular.eot
Normal file
BIN
_media/fonts/F5.6-Regular.eot
Normal file
Binary file not shown.
BIN
_media/fonts/F5.6-Regular.woff
Normal file
BIN
_media/fonts/F5.6-Regular.woff
Normal file
Binary file not shown.
BIN
_media/fonts/F5.6-Regular.woff2
Normal file
BIN
_media/fonts/F5.6-Regular.woff2
Normal file
Binary file not shown.
73
index.html
73
index.html
@ -1,37 +1,72 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html lang="en">
|
||||||
<!--
|
<!--
|
||||||
/_ ... _ /_
|
/_ ... _ /_
|
||||||
/_//_/ ////_//_//_//\
|
/_//_/ ////_//_//_//\
|
||||||
_/ _//
|
_/ _//
|
||||||
-->
|
-->
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
<meta charset="utf-8">
|
||||||
<title>hgman</title>
|
<title>Hangman</title>
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link rel="stylesheet" type="text/css" href="styles.css">
|
<link rel="stylesheet" href="_media/css/chota.min.css">
|
||||||
|
<link rel="stylesheet" href="_media/css/styles.css">
|
||||||
|
<link rel="icon" type="image/png" href="_media/img/favicon.png">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div class="container">
|
||||||
|
<header>
|
||||||
|
<nav class="nav">
|
||||||
|
<div class="nav-left">
|
||||||
|
<a class="brand" href="#">Hangman game</a>
|
||||||
|
</div>
|
||||||
|
<div class="nav-right">
|
||||||
|
<a class="button dark" id="theme-switch" onclick="switchMode(this)">☀️</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
<div class="wrap">
|
<nav class="tabs is-full">
|
||||||
<div id="WORD" class="word">
|
<a class="active">Game</a>
|
||||||
LOADING
|
<a>Statistics</a>
|
||||||
</div>
|
<a>Credits</a>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div id="lives" class="lives">
|
<br>
|
||||||
...
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="keyboard" class="keyboard">
|
<section>
|
||||||
...
|
<p id="word" class="card text-center text-uppercase">
|
||||||
</div>
|
Loading word...
|
||||||
|
</p>
|
||||||
|
|
||||||
<footer>
|
<div id="keyboard" class="is-hidden text-center">
|
||||||
2021 by <a href="//iiiypuk.me/">iiiypuk</a>
|
... keyboard ...
|
||||||
<p>ver: 0.2.1</p>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
<footer class="text-center">
|
||||||
|
<p class="text-grey is-marginless is-small">
|
||||||
|
by iiiypuk<br>
|
||||||
|
ver: 2.0.0
|
||||||
|
</p>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript" src="game.js"></script>
|
<script>
|
||||||
|
if (window.matchMedia &&
|
||||||
|
window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||||
|
document.body.classList.add('dark');
|
||||||
|
}
|
||||||
|
|
||||||
|
function switchMode(el) {
|
||||||
|
const bodyClass = document.body.classList;
|
||||||
|
bodyClass.contains("dark")
|
||||||
|
? ((el.innerHTML = "☀️"), bodyClass.remove("dark"))
|
||||||
|
: ((el.innerHTML = "🌙"), bodyClass.add("dark"));
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<script type="text/javascript" src="_media/js/game.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
5
package.json
Normal file
5
package.json
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
{
|
||||||
|
"dependencies": {
|
||||||
|
"chota": "0.8.0"
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user