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 { #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 { @keyframes hard-dropped-table-animation {
@ -43,12 +43,12 @@ body {
animation: hard-dropped-table-animation .2s; animation: hard-dropped-table-animation .2s;
} }
tr.no-border td:not(.mino) { tr.buffer-zone td:not(.mino) {
border-width: 0; border-width: 0;
padding: 4px; padding: 4px;
} }
tr.border td:not(.mino) { tr.matrix td:not(.mino) {
border: 1px solid #333; border: 1px solid #333;
padding: 3px; padding: 3px;
} }

94
index.html
View File

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