use piece for glint

This commit is contained in:
Adrien MALINGREY 2023-06-16 02:05:42 +02:00
parent 2d687d5fcb
commit 57639b0c2a
3 changed files with 7 additions and 6 deletions

4
app.js
View File

@ -236,8 +236,8 @@ class Matrix extends MinoesTable {
if (piece.locked) className += " locking" if (piece.locked) className += " locking"
if (piece==this.piece && actionsQueue.length) className += " moving" if (piece==this.piece && actionsQueue.length) className += " moving"
super.drawPiece(piece, className) super.drawPiece(piece, className)
matrix.table.style.setProperty('--ghost-column', this.ghost.center.x) matrix.table.style.setProperty('--piece-column', this.piece.center.x)
matrix.table.style.setProperty('--ghost-row', this.ghost.center.y) matrix.table.style.setProperty('--piece-row', this.piece.center.y)
} }
redraw() { redraw() {

View File

@ -1,3 +1,4 @@
:root { :root {
--cell-side: 24px; --cell-side: 24px;
} }
@ -18,8 +19,8 @@ body {
} }
.minoes-table { .minoes-table {
--ghost-row : 0; --piece-column: 0;
--ghost-column: 0; --piece-row : 0;
table-layout: fixed; table-layout: fixed;
border-collapse: separate; border-collapse: separate;
border-spacing: 0; border-spacing: 0;

View File

@ -24,8 +24,8 @@ body {
inset: 0; inset: 0;
padding: 1px; padding: 1px;
border-radius: 0.3vmin; border-radius: 0.3vmin;
--glint-x: calc(50% + 50% * (var(--ghost-column) - var(--column))/10); --glint-x: calc(50% + 50% * (var(--piece-column) - var(--column))/10);
--glint-y: calc(50% + 50% * (var(--ghost-row) - var(--row))/25); --glint-y: calc(50% + 50% * (var(--piece-row) - var(--row))/25);
background: radial-gradient( background: radial-gradient(
at var(--glint-x) var(--glint-y), at var(--glint-x) var(--glint-y),
rgba(204, 238, 247, 0.9) 0%, rgba(204, 238, 247, 0.9) 0%,