diff --git a/css/index.css b/css/index.css new file mode 100644 index 0000000..97462dc --- /dev/null +++ b/css/index.css @@ -0,0 +1,54 @@ +@font-face { + font-family: 'Share Tech'; + font-style: normal; + font-weight: 400; + src: local('Share Tech Regular'), local('ShareTech-Regular'), url(../fonts/ShareTech.woff2) format('woff2'); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} + +* { + padding: 0; + margin: 0; + color: white; + font-family: 'Share Tech'; + font-size: 1.05em; +} + +body { + background-image: url("../images/bg.jpg"); + background-size: cover; +} + +h1 { + font-size: 3em; + margin: 40px 20px 20px 20px; + text-shadow: 3px 2px rgb(153, 145, 175); + text-align: center; +} + +button { + color: black; + width: 100%; +} + +.actions { + display: grid; + grid-template-columns: repeat(4, 1fr); + grid-gap: 20px; + margin: 40px auto; + width: 700px; + justify-items: left; +} + +.cookie { + margin: 40px 0 0 0; + font-size: 0.8em; + justify-self: center; + width: auto; + grid-column: 1 / 5; +} + +.play { + grid-column: 2 / 4; + justify-self: center; +} diff --git a/css/style.css b/css/webtris.css similarity index 80% rename from css/style.css rename to css/webtris.css index 3bcf1b0..0197694 100644 --- a/css/style.css +++ b/css/webtris.css @@ -4,8 +4,8 @@ font-weight: 400; src: local('Share Tech Regular'), local('ShareTech-Regular'), url(../fonts/ShareTech.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; - } - @font-face { +} +@font-face { font-family: 'Share Tech Mono'; font-style: normal; font-weight: 400; @@ -13,33 +13,42 @@ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } - * { +* { padding: 0; margin: 0; color: white; - } + font-family: 'Share Tech'; +} body { background-image: url("../images/bg.jpg"); background-size: cover; } + +h1 { + font-size: 3em; + margin: 40px 20px 20px 20px; + text-shadow: 3px 2px rgb(153, 145, 175); + text-align: center; +} canvas { display: block; flex-shrink: 0; } -.columns { +.flex-columns { display: flex; flex-direction: row; justify-content: center; + margin: auto; } -.space { +.flex-space { flex-grow: 2; } -.rows { +.flex-rows { display: flex; flex-direction: column; margin: 5% 2%; @@ -47,23 +56,24 @@ canvas { } .hold { - max-width: 120px; + width: 120px; } .stats { display: flex; flex-direction: row; margin: 10% 0; - font-size: 2.5vw; + font-size: 1.2em; + width: 120px; } .stats-names { font-family: 'Share Tech'; + text-align: left; } .stats-values { text-align: right; - min-width: 15vw; font-family: 'Share Tech Mono'; } @@ -73,6 +83,6 @@ canvas { } .next { - max-width: 120px; + width: 120px; margin: 5% 2%; } \ No newline at end of file diff --git a/index.html b/index.html index 1b61414..a60c80a 100644 --- a/index.html +++ b/index.html @@ -3,35 +3,26 @@ Webtris - - - + -
-
-
-
-
- +

WEBTRIS

+
+
+
GAUCHE
+
DROITE
+
CHUTE LENTE
+
CHUTE RAPIDE
+
ROTATION HORAIRE
+
ROTATION INVERSE
+
GARDE
+
PAUSE
+
+ +
-
-
-
- SCORE
- HIGH
- LEVEL
- GOAL
- LINES
- TIME
-
-
-
- +
- Votre navigateur ne supporte pas HTML5, veuillez le mettre à jour pour jouer. - -
-
+ \ No newline at end of file diff --git a/js/webtris.js b/js/webtris.js index 0bd8f9d..fbc9712 100644 --- a/js/webtris.js +++ b/js/webtris.js @@ -413,7 +413,6 @@ class Matrix { this.piece.draw(this.context, ghost_pos) // Lines cleared - console.log(this.linesCleared.length) if (this.linesCleared.length) { this.context.save() this.context.shadowColor = "white" diff --git a/webtris.html b/webtris.html new file mode 100644 index 0000000..7f58e7f --- /dev/null +++ b/webtris.html @@ -0,0 +1,36 @@ + + + + + Webtris + + + + + +

WEBTRIS

+
+
+
+
+ +
+
+
+
+ SCORE
+ HIGH
+ LEVEL
+ GOAL
+ LINES
+ TIME
+
+
+
+ +
+ Votre navigateur ne supporte pas HTML5, veuillez le mettre à jour pour jouer. + +
+ + \ No newline at end of file