51 lines
1.5 KiB
XML
51 lines
1.5 KiB
XML
<svg version="1.1" width="32" height="32" xmlns="http://www.w3.org/2000/svg">
|
|
<style>
|
|
:root {
|
|
--outline: black;
|
|
--block: red;
|
|
--gate: cyan;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
:root {
|
|
--outline: white;
|
|
--block: orange;
|
|
--gate: green;
|
|
}
|
|
}
|
|
|
|
rect, path, circle {
|
|
stroke: var(--outline);
|
|
stroke-width: 1px;
|
|
stroke-linecap: square;
|
|
}
|
|
|
|
rect.tetris {
|
|
--size: 8px;
|
|
--offset: 1.5px + calc(10px - var(--size));
|
|
fill: var(--block);
|
|
width: var(--size);
|
|
height: var(--size);
|
|
x: calc(var(--x) * var(--size) + var(--offset) - 1px);
|
|
y: calc(var(--y) * var(--size) + var(--offset) + 1px);
|
|
}
|
|
|
|
.gate {
|
|
fill: var(--gate);
|
|
}
|
|
|
|
.letter {
|
|
fill: var(--outline);
|
|
}
|
|
</style>
|
|
|
|
<rect class="tetris" style="--x: 0; --y: 2"></rect>
|
|
<rect class="tetris" style="--x: 1; --y: 2"></rect>
|
|
<rect class="tetris" style="--x: 1; --y: 1"></rect>
|
|
<rect class="tetris" style="--x: 2; --y: 1"></rect>
|
|
|
|
<path class="gate" d="M2.5,1.5 h5 a 5 5 0 0 1 0,10 h-5 v-10"></path>
|
|
<circle class="gate" cx="14.5" cy="6.5" r="2"></circle>
|
|
|
|
<path class="letter" d="M26,10 h-6 v-1 l5,-4 v-1 l-1,-1 h-2.5 l-.5,1 h-1 v-1 l1,-1 h4 l1,1 v2 l-5,4 h5 v1"></path>
|
|
</svg> |