clone

a daily shikaku puzzle for phones: one seeded puzzle per date, solved by dragging rectangles

main
rect.run / components / KeepScene.tsx
KeepScene.tsx 2.9K
1/** 64×30 pixel night scene: moon, keep with lit windows, treeline. */2export default function KeepScene() {3 return (4 <svg5 class="keep-scene"6 viewBox="0 0 64 30"7 shape-rendering="crispEdges"8 aria-hidden="true"9 focusable="false"10 >11 <rect width="64" height="30" fill="#10203a" />12 <g fill="#fff" class="keep-scene__stars">13 <rect x="6" y="3" width="1" height="1" />14 <rect x="20" y="6" width="1" height="1" />15 <rect x="41" y="2" width="1" height="1" />16 <rect x="55" y="7" width="1" height="1" />17 <rect x="33" y="9" width="1" height="1" />18 <rect x="12" y="10" width="1" height="1" />19 </g>20 <rect x="50" y="3" width="5" height="5" fill="#f6efc9" />21 <rect x="52" y="4" width="2" height="2" fill="#e0d6a6" />22 <rect x="0" y="20" width="64" height="10" fill="#1f3a1c" />23 <rect x="0" y="18" width="64" height="2" fill="#2f5527" />24 <g fill="#0f180d">25 <rect x="2" y="15" width="3" height="5" />26 <rect x="58" y="14" width="4" height="6" />27 <rect x="10" y="16" width="2" height="4" />28 <rect x="52" y="16" width="2" height="4" />29 </g>30 <rect x="21" y="12" width="22" height="8" fill="#5b5b64" />31 <rect x="21" y="12" width="22" height="1" fill="#7a7a81" />32 <g fill="#5b5b64">33 <rect x="21" y="11" width="2" height="1" />34 <rect x="25" y="11" width="2" height="1" />35 <rect x="29" y="11" width="2" height="1" />36 <rect x="33" y="11" width="2" height="1" />37 <rect x="37" y="11" width="2" height="1" />38 <rect x="41" y="11" width="2" height="1" />39 </g>40 <g fill="#6a6a72">41 <rect x="18" y="8" width="5" height="12" />42 <rect x="18" y="7" width="1" height="1" />43 <rect x="20" y="7" width="1" height="1" />44 <rect x="22" y="7" width="1" height="1" />45 <rect x="41" y="8" width="5" height="12" />46 <rect x="41" y="7" width="1" height="1" />47 <rect x="43" y="7" width="1" height="1" />48 <rect x="45" y="7" width="1" height="1" />49 </g>50 <g fill="#7a7a81">51 <rect x="29" y="4" width="6" height="16" />52 <rect x="29" y="3" width="1" height="1" />53 <rect x="31" y="3" width="2" height="1" />54 <rect x="34" y="3" width="1" height="1" />55 </g>56 <g fill="#f2cb55" class="keep-scene__windows">57 <rect x="31" y="7" width="2" height="2" />58 <rect x="19" y="11" width="1" height="2" />59 <rect x="43" y="11" width="1" height="2" />60 </g>61 <rect x="30" y="16" width="4" height="4" fill="#0a120a" />62 <rect x="31" y="15" width="2" height="1" fill="#0a120a" />63 <rect x="31" y="0" width="1" height="4" fill="#3e2a1a" />64 <rect65 x="32"66 y="0"67 width="3"68 height="2"69 fill="#b8483d"70 class="keep-scene__flag"71 />72 </svg>73 );74}