diff --git a/css/classic.css b/css/classic.css index c80fcc1..705d8d2 100644 --- a/css/classic.css +++ b/css/classic.css @@ -82,10 +82,10 @@ } .locked.mino { - filter: saturate(50%) brightness(200%) + filter: saturate(50%) brightness(200%); } .ghost.mino { opacity: 20%; - filter: brightness(200%) + filter: brightness(200%); } \ No newline at end of file diff --git a/css/retro.css b/css/retro.css index cf4cca5..d6f7fef 100644 --- a/css/retro.css +++ b/css/retro.css @@ -1,118 +1,75 @@ :root { - --g0: #062807; - --g1: #1f5b1c; - --g2: #83b70b; - --g3: #a3d30d; - - --bs-body-font-family: monospace; + --cell-side: 20px; +} + +@font-face { + font-family: "Early GameBoy"; + src: url("retro/Early GameBoy.ttf"); } body { - background: #7b787f; - font-family: monospace; + background-image: url("retro/dark-bg.png"); +} + +#statsTable, +.card, +#messagesSpan { + font-family: "Early GameBoy", monospace; + color: #3C5819; } .card { - background-color: var(--g3); + background: #808302; + border-radius: 0; + border-image-source: url("retro/border.png"); + border-image-slice: 15; + border-image-width: 15px; + border-image-repeat: repeat; + border-image-outset: 15px; + margin: 15px !important; + box-shadow: unset; } -.card, -table, -#messagesSpan { - color: var(--g0) !important; +.card-header { + background: #808302; } -td:not(.mino) { - border: 0; -} - -tr.matrix td:not(.mino) { - border: 0; -} - -.mino { - position: relative; - border: 2px solid var(--g0); -} - -.mino::after { - position: absolute; - content: " "; +td { + border: 0 !important; } .I.mino { - background-color: var(--g2); + background-image: url("retro/I-mino.png") } .J.mino { - background-color: var(--g2); -} - -.J.mino::after { - top: 5px; - left: 5px; - width: 11px; - height: 11px; - border: 2px solid var(--g0); + background-image: url("retro/J-mino.png") } .L.mino { - background-color: var(--g1); + background-image: url("retro/L-mino.png") } .O.mino { - background-color: var(--g3); -} - -.O.mino::after { - top: 3px; - left: 3px; - width: 15px; - height: 15px; - background-color: var(--g0); + background-image: url("retro/O-mino.png") } .S.mino { - background-color: var(--g1); -} - -.S.mino::after { - top: 5px; - left: 5px; - width: 11px; - height: 11px; - border: 2px solid var(--g0); + background-image: url("retro/S-mino.png") } .T.mino { - background-color: var(--g2); -} - -.T.mino::after { - top: 5px; - left: 5px; - width: 11px; - height: 11px; - border: 2px solid; - border-top-color: var(--g3); - border-left-color: var(--g3); - border-right-color: var(--g0); - border-bottom-color: var(--g0); + background-image: url("retro/T-mino.png") } .Z.mino { - background-color: var(--g2); -} - -.Z.mino::after { - top: 5px; - left: 5px; - width: 11px; - height: 11px; - background-color: var(--g0); + background-image: url("retro/Z-mino.png") } .locked.mino { - background-color: var(--g2); - border-color: var(--g3); + filter: saturate(60%) brightness(200%); +} + +.ghost.mino { + opacity: 50%; } \ No newline at end of file diff --git a/css/retro/Early GameBoy.ttf b/css/retro/Early GameBoy.ttf new file mode 100644 index 0000000..5cf4045 Binary files /dev/null and b/css/retro/Early GameBoy.ttf differ diff --git a/css/retro/I-mino.png b/css/retro/I-mino.png new file mode 100644 index 0000000..7b01ee3 Binary files /dev/null and b/css/retro/I-mino.png differ diff --git a/css/retro/J-mino.png b/css/retro/J-mino.png new file mode 100644 index 0000000..07bf8e9 Binary files /dev/null and b/css/retro/J-mino.png differ diff --git a/css/retro/L-mino.png b/css/retro/L-mino.png new file mode 100644 index 0000000..3b5d5d4 Binary files /dev/null and b/css/retro/L-mino.png differ diff --git a/css/retro/O-mino.png b/css/retro/O-mino.png new file mode 100644 index 0000000..29b7c5f Binary files /dev/null and b/css/retro/O-mino.png differ diff --git a/css/retro/S-mino.png b/css/retro/S-mino.png new file mode 100644 index 0000000..9f46c20 Binary files /dev/null and b/css/retro/S-mino.png differ diff --git a/css/retro/T-mino.png b/css/retro/T-mino.png new file mode 100644 index 0000000..8b7e0d2 Binary files /dev/null and b/css/retro/T-mino.png differ diff --git a/css/retro/Z-mino.png b/css/retro/Z-mino.png new file mode 100644 index 0000000..e256670 Binary files /dev/null and b/css/retro/Z-mino.png differ diff --git a/css/retro/border.png b/css/retro/border.png new file mode 100644 index 0000000..a28b6ce Binary files /dev/null and b/css/retro/border.png differ diff --git a/css/retro/dark-bg.png b/css/retro/dark-bg.png new file mode 100644 index 0000000..6d23e03 Binary files /dev/null and b/css/retro/dark-bg.png differ diff --git a/index.html b/index.html index 3fb1b37..8d396bb 100644 --- a/index.html +++ b/index.html @@ -10,6 +10,7 @@ + @@ -122,7 +123,7 @@ -
Score | 0 |
---|---|
Meilleur score |