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

buffer zone

Browse Source
This commit is contained in:
Adrien MALINGREY 2023-04-24 02:24:30 +02:00
parent d73c0948d0
commit 40576ad1a0
2 changed files with 50 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
css/common.css
View File

@ -24,7 +24,7 @@ body {
}
#matrixTable {
margin-top: calc(-1 * var(--no-bordered-rows) * var(--cell-side));
margin-top: calc(-1 * var(--buffer-zoneed-rows) * var(--cell-side));
}
@keyframes hard-dropped-table-animation {
@ -43,12 +43,12 @@ body {
animation: hard-dropped-table-animation .2s;
}
tr.no-border td:not(.mino) {
tr.buffer-zone td:not(.mino) {
border-width: 0;
padding: 4px;
}
tr.border td:not(.mino) {
tr.matrix td:not(.mino) {
border: 1px solid #333;
padding: 3px;
}

94
index.html
View File

@ -113,11 +113,11 @@
<div class="card-header text-center"><strong>HOLD</strong></div>
<div class="card-body p-0">
<table id="holdTable" class="minoes-table">
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
</table>
</div>
</div>
@ -133,32 +133,32 @@
</div>
<div class="col">
<div class="card">
<table id="matrixTable" class="minoes-table" style="--no-bordered-rows: 6">
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="border"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<table id="matrixTable" class="minoes-table" style="--buffer-zoneed-rows: 6">
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="matrix"><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
</table>
</div>
<span id="messagesSpan"></span>
@ -168,22 +168,22 @@
<div class="card-header text-center"><strong>NEXT</strong></div>
<div class="card-body p-0">
<table id="nextTable" class="minoes-table caption-top">
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="no-border"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr class="buffer-zone"><td></td><td></td><td></td><td></td><td></td><td></td></tr>
</table>
</div>
</div>