3D cleared line animation
This commit is contained in:
@@ -177,8 +177,8 @@ td.trail-animation {
|
||||
|
||||
/* Left face */
|
||||
.minoes-table .mino::before,
|
||||
.left .minoes-table .mino + .mino::before,
|
||||
.left tr.cleared-line-animation td::before {
|
||||
tr.cleared-line-animation td::before,
|
||||
.left .minoes-table .mino + .mino::before {
|
||||
--light: calc(
|
||||
1.1
|
||||
+ (var(--light-x) * -0.2)
|
||||
@@ -190,7 +190,8 @@ td.trail-animation {
|
||||
|
||||
/* Right face */
|
||||
.right .minoes-table .mino + .mino::before,
|
||||
.minoes-table .mino + :not(.mino)::before {
|
||||
.minoes-table .mino + :not(.mino)::before,
|
||||
.right tr.cleared-line-animation td::before {
|
||||
--light: calc(
|
||||
0.85
|
||||
+ (var(--light-x) * -0.2)
|
||||
@@ -203,8 +204,7 @@ td.trail-animation {
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
.right .minoes-table .mino:last-child::before,
|
||||
.right tr.cleared-line-animation td:last-child::before {
|
||||
.right .minoes-table .mino:last-child::before {
|
||||
transform: translate3d(-2px, -2px, calc(-1 * var(--cell-side))) rotateY(90deg) !important;
|
||||
transform-origin: right !important;
|
||||
}
|
||||
@@ -271,14 +271,9 @@ td.trail-animation { --h: 180deg; --s: 50%; --l: 90%; --a: 0.4; }
|
||||
}
|
||||
}
|
||||
|
||||
tr.cleared-line-animation td::before,
|
||||
tr.cleared-line-animation td::after {
|
||||
animation: trail-animation ease-out 3s;
|
||||
}
|
||||
|
||||
@keyframes cleared-line-animation {
|
||||
from {
|
||||
background-color: white;
|
||||
background-color: white !important;
|
||||
box-shadow: 0 0 0 white;
|
||||
}
|
||||
to {
|
||||
|
||||
Reference in New Issue
Block a user