Added a forgotten file

Browse Source
This commit is contained in:
BordedDev 2025-01-14 11:14:07 +01:00
parent b5c1058b3b
commit b9cc26856c
1 changed files with 65 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
reviews/BordedDev/sudoku.rewrite.css Normal file
View File

@ -0,0 +1,65 @@
:host {
display: inline-block;
--border-radius: 5px;
}
.sudoku {
user-select: none;
border: 1px solid #ccc;
font-size: 13px;
color: #222;
display: grid;
grid-template-columns: repeat(9, 1fr);
grid-auto-rows: auto;
aspect-ratio: 1 / 1;
background-color: #e5e5e5;
border-radius: var(--border-radius);
overflow: hidden;
.sudoku-field {
aspect-ratio: 1 / 1;
width: 1em;
line-height: 1;
text-align: center;
padding: 2px;
border: 1px solid #ccc;
border-left: none;
border-top: none;
/* Cross bars */
&:nth-child(3n):not(:nth-child(9n)) {
border-right-color: black;
}
&:nth-child(n + 19):nth-child(-n + 27),
&:nth-child(n + 46):nth-child(-n + 54) {
border-bottom-color: black;
}
/* Match the corners with parent, otherwise they'll render on top */
&:nth-child(1) {
border-top-left-radius: var(--border-radius);
}
&:nth-child(9) {
border-top-right-radius: var(--border-radius);
}
&:nth-last-child(1) {
border-bottom-right-radius: var(--border-radius);
}
&:nth-last-child(9) {
border-bottom-left-radius: var(--border-radius);
}
&.initial {
color: #777;
}
&.selected {
background-color: lightgreen;
}
&.marked {
background-color: blue;
}
&.invalid {
color: red;
}
}
}