adrien/quatuor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

less drop-shadows

Browse Source
This commit is contained in:
Adrien MALINGREY
2026-03-04 00:30:50 +01:00
parent b28b44507b
commit 36112f1ec8
1 changed files with 11 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
css/classic.css
View File

@@ -1,9 +1,7 @@
.minoes-table { .minoes-table {
filter: filter:
drop-shadow(-.5px -.5px 0 white) drop-shadow(-1px -1px 0 white)
drop-shadow( .5px -.5px 0 white) drop-shadow( 1px 1px 0 white);
drop-shadow(-.5px .5px 0 white)
drop-shadow( .5px .5px 0 white);
} }
.minoes-table tr { .minoes-table tr {
@@ -11,26 +9,17 @@
position: sticky; position: sticky;
} }
tr:not(.matrix) + tr.matrix td:not(.mino) {
border-top: none;
}
tr.matrix td:not(.mino):last-of-type {
border-right: none;
}
tr.matrix td:not(.mino) { tr.matrix td:not(.mino) {
border-top: 1px solid #30303003;
border-right: 1px solid #30303003;
border-left: none; border-left: none;
border-bottom: none; border-bottom: none;
border-right: 1px solid #30303003;
border-top: 1px solid #30303003;
} }
.mino { .mino {
--color: hsl(var(--hue), var(--saturation), 40%); --color: hsl(var(--hue), var(--saturation), 40%);
--light: hsl(var(--hue), calc(0.66 * var(--saturation)), 84%); --light: hsl(var(--hue), calc(0.66 * var(--saturation)), 84%);
--top: hsl(var(--hue), calc(0.6 * var(--saturation)), 68%); --top: hsl(var(--hue), calc(0.6 * var(--saturation)), 68%);
--right: hsl(var(--hue), calc(0.4 * var(--saturation)), 20%);
background-color: var(--color); background-color: var(--color);
background-image: background-image:
radial-gradient( radial-gradient(
@@ -57,10 +46,8 @@ tr.matrix td:not(.mino) {
box-shadow: box-shadow:
inset 2px 0 4px rgba(0,0,0,.06), inset 2px 0 4px rgba(0,0,0,.06),
inset -2px 0 4px rgba(0,0,0,.12), inset -2px 0 4px rgba(0,0,0,.12),
0 -4px 0 var(--top), 0 -4px 0 var(--top);
2px -3px 0 var(--right);
filter: saturate(1.1) contrast(1.05); filter: saturate(1.1) contrast(1.05);
z-index: 10;
} }
.I { .I {
@@ -99,18 +86,17 @@ tr.matrix td:not(.mino) {
} }
.ghost { .ghost {
border: 3px solid #ffffff05; border: 3px solid #fff1;
padding: 2px; padding: 2px;
background-color: #ffffff05; background-color: #fff1;
background-clip: content-box; background-clip: content-box;
background-image: none; background-image: none;
box-shadow: none; box-shadow: none;
} }
@keyframes trail-animation { @keyframes trail-animation {
from { from {
background-color: #ceffff05; background-color: #ceffff10;
} }
to { to {
background-color: transparent; background-color: transparent;
@@ -119,12 +105,12 @@ tr.matrix td:not(.mino) {
@keyframes cleared-line-animation { @keyframes cleared-line-animation {
from { from {
background-color: #fff3; background-color: #fff6;
filter: saturate(50%) brightness(300%); filter: saturate(50%) brightness(300%);
box-shadow: 0 0 0 #adb5bd33, 0 0 0 #adb5bd33; box-shadow: 0 0 0 #adb5bd66, 0 0 0 #adb5bd66;
} }
60% { 60% {
box-shadow: -60px 0 2px #adb5bd17, 60px 0 2px #adb5bd17; box-shadow: -60px 0 2px #adb5bd33, 60px 0 2px #adb5bd33;
} }
to { to {
background-color: transparent; background-color: transparent;