make page

This commit is contained in:
Alexander Popov 2021-02-25 00:06:14 +03:00
parent 47797bd9fe
commit 9de86b6c4d
8 changed files with 84 additions and 19 deletions

2
.gitignore vendored Normal file
View File

@ -0,0 +1,2 @@
node_modules/
package-lock.json

1
_media/css/chota.min.css vendored Symbolic link
View File

@ -0,0 +1 @@
../../node_modules/chota/dist/chota.min.css

22
_media/css/styles.css Normal file
View 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';
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -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
View File

@ -0,0 +1,5 @@
{
"dependencies": {
"chota": "0.8.0"
}
}