100 lines
6.8 KiB
XML
100 lines
6.8 KiB
XML
<svg viewBox="0 0 1870 801" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<linearGradient id="board_fill_2" x1="1287.5" y1="-5.05741e-05" x2="1287.5" y2="268" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#8E2F00"/>
|
|
<stop offset="1" stop-color="#662A0D"/>
|
|
</linearGradient>
|
|
<linearGradient id="board_fill_1" x1="316.744" y1="320.908" x2="379.604" y2="4.59125" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#2A5338"/>
|
|
<stop offset="1" stop-color="#306843"/>
|
|
</linearGradient>
|
|
<linearGradient id="board_fill_4" x1="1287.5" y1="268" x2="1255.51" y2="570.824" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#5B4822"/>
|
|
<stop offset="1" stop-color="#795711"/>
|
|
</linearGradient>
|
|
<linearGradient id="board_fill_3" x1="825.766" y1="658" x2="817.483" y2="793.488" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#1D375D"/>
|
|
<stop offset="1" stop-color="#385888"/>
|
|
</linearGradient>
|
|
<filter id="board-3d-effect" x="-10%" y="-10%" width="120%" height="120%" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix><feOffset dy="4"></feOffset><feGaussianBlur stdDeviation="2"></feGaussianBlur><feComposite in2="hardAlpha" operator="out"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"></feBlend><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"></feBlend><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha2"></feColorMatrix><feOffset dy="-4"></feOffset><feComposite in2="hardAlpha2" operator="arithmetic" k2="-1" k3="1"></feComposite><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"></feColorMatrix><feBlend mode="normal" in2="shape" result="effect2_innerShadow"></feBlend></filter>
|
|
</defs>
|
|
<g class="board-group" >
|
|
<path class="board-01" d="M4 10C4 4.47715 8.47715 0 14 0H699C704.523 0 709 4.47715 709 10V525H14C8.47717 525 4 520.523 4 515V10Z" fill="url(#board_fill_1)" filter="url(#board-3d-effect)"/>
|
|
<path class="board-02" d="M1866 258C1866 263.523 1861.52 268 1856 268L709 268L709 9.9999C709 4.47707 713.477 -0.000100757 719 -0.000100274L1856 -8.74227e-07C1861.52 -3.91404e-07 1866 4.47714 1866 10L1866 258Z" fill="url(#board_fill_2)" filter="url(#board-3d-effect)"/>
|
|
<path class="board-03" d="M4 533C4 527.477 8.47715 523 14 523H1615V783C1615 788.523 1610.52 793 1605 793H14C8.47719 793 4 788.523 4 783V533Z" fill="url(#board_fill_3)" filter="url(#board-3d-effect)"/>
|
|
<path class="board-04" d="M1856.51 268.013C1857.03 268.039 1857.53 268.103 1858.02 268.203C1858.5 268.303 1858.98 268.438 1859.44 268.606C1859.74 268.719 1860.04 268.846 1860.33 268.986C1860.92 269.267 1861.47 269.602 1861.98 269.986C1862.11 270.082 1862.24 270.181 1862.36 270.283C1862.61 270.487 1862.85 270.703 1863.07 270.929C1863.41 271.268 1863.73 271.632 1864.01 272.017C1864.59 272.787 1865.06 273.643 1865.39 274.562C1865.56 275.021 1865.7 275.496 1865.8 275.984C1865.9 276.473 1865.96 276.974 1865.99 277.485C1866 277.656 1866 277.827 1866 278V783C1866 788.523 1861.52 793 1856 793H1625C1619.48 793 1615 788.523 1615 783V523H709V268H1856C1856.17 268 1856.34 268.004 1856.51 268.013Z" fill="url(#board_fill_4)" filter="url(#board-3d-effect)"/>
|
|
</g>
|
|
|
|
<g class="piece-group" >
|
|
<!-- data-piece = pieceId(1~9). board-N = 플레이 버튼 면색(puzzle-onboarding.js BOARD_COLORS) -->
|
|
<g class="puzzle-piece-group board-1" data-piece="1">
|
|
<path class="piece-01" d="M256 11V267H330V523H709V11H256Z M330 267H22L22.4984 523H330V267Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-2" data-piece="2">
|
|
<path class="piece-02" d="M709 11H1162L1161.99 268H709V11Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-2" data-piece="3">
|
|
<path class="piece-03" d="M1162 11H1615L1614.99 268H1162V11Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-2" data-piece="4">
|
|
<path class="piece-04" d="M709 268H1162L1161.99 523H709V268Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-2" data-piece="5">
|
|
<path class="piece-05" d="M1162 268H1615L1614.99 523H1162V268Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-3" data-piece="6">
|
|
<path class="piece-06" d="M256.658 780V651.625H22V523H709V780H256.658Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-3" data-piece="7">
|
|
<path class="piece-07" d="M709 523H1162L1161.99 780H709V523Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-3" data-piece="8">
|
|
<path class="piece-08" d="M1162 523H1615L1614.99 780H1162V523Z" fill="#D9D9D9"/>
|
|
</g>
|
|
<g class="puzzle-piece-group board-4" data-piece="9">
|
|
<path class="piece-09" d="M1615 268H1853L1852.99 617H1615V268Z" fill="#D9D9D9"/>
|
|
</g>
|
|
|
|
</g>
|
|
|
|
<g class="piece-gauge-group" >
|
|
<g class="piece-gauge" data-piece="1">
|
|
<rect class="gauge-fill-line" x="22" y="516" width="687" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="2">
|
|
<rect class="gauge-fill-line" x="709" y="260" width="453" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="3">
|
|
<rect class="gauge-fill-line" x="1163" y="260" width="452" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="4">
|
|
<rect class="gauge-fill-line" x="710" y="516" width="452" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="5">
|
|
<rect class="gauge-fill-line" x="1163" y="516" width="452" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="6">
|
|
<rect class="gauge-fill-line" x="257" y="773" width="452" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="7">
|
|
<rect class="gauge-fill-line" x="710" y="773" width="452" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="8">
|
|
<rect class="gauge-fill-line" x="1163" y="773" width="452" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
<g class="piece-gauge" data-piece="9">
|
|
<rect class="gauge-fill-line" x="1616" y="610" width="237" height="7" rx="2" fill="#A0A0A0"/>
|
|
</g>
|
|
</g>
|
|
|
|
|
|
<g class="grid-line-group" stroke-width="1">
|
|
<line x1="709.5" y1="11" x2="709.5" y2="780" stroke="black"/>
|
|
<line x1="1615" y1="523.5" x2="22" y2="523.5" stroke="black"/>
|
|
<line x1="709" y1="267.5" x2="1615" y2="267.5" stroke="black"/>
|
|
<line x1="1615.5" y1="11" x2="1615.5" y2="780" stroke="black"/>
|
|
<line x1="1162.5" y1="11" x2="1162.5" y2="780" stroke="black"/>
|
|
</g>
|
|
|
|
</svg>
|
