feat(ui): add fullscreen toggle button and include icon proposals
This commit is contained in:
176
public/icon-proposals/option-a.svg
Normal file
176
public/icon-proposals/option-a.svg
Normal file
@@ -0,0 +1,176 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
|
||||
<defs>
|
||||
<!-- Deep obsidian radial background -->
|
||||
<radialGradient id="bgA" cx="50%" cy="42%" r="68%">
|
||||
<stop offset="0%" stop-color="#14231b" />
|
||||
<stop offset="55%" stop-color="#0b130f" />
|
||||
<stop offset="100%" stop-color="#09090b" />
|
||||
</radialGradient>
|
||||
|
||||
<!-- Trunk & Stem Gradient -->
|
||||
<linearGradient id="trunkGradA" x1="0%" y1="100%" x2="0%" y2="0%">
|
||||
<stop offset="0%" stop-color="#047857" />
|
||||
<stop offset="35%" stop-color="#059669" />
|
||||
<stop offset="70%" stop-color="#10b981" />
|
||||
<stop offset="100%" stop-color="#34d399" />
|
||||
</linearGradient>
|
||||
|
||||
<!-- Top Willow Leaf Upper Surface -->
|
||||
<linearGradient id="topLeafGradA" x1="0%" y1="20%" x2="100%" y2="60%">
|
||||
<stop offset="0%" stop-color="#059669" />
|
||||
<stop offset="25%" stop-color="#10b981" />
|
||||
<stop offset="70%" stop-color="#34d399" />
|
||||
<stop offset="100%" stop-color="#a7f3d0" />
|
||||
</linearGradient>
|
||||
|
||||
<!-- Top Willow Leaf Shaded Underbelly -->
|
||||
<linearGradient id="topLeafUnderA" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" stop-color="#047857" />
|
||||
<stop offset="50%" stop-color="#059669" />
|
||||
<stop offset="100%" stop-color="#10b981" />
|
||||
</linearGradient>
|
||||
|
||||
<!-- Mid Leaf Gradient -->
|
||||
<linearGradient id="midLeafGradA" x1="0%" y1="20%" x2="100%" y2="60%">
|
||||
<stop offset="0%" stop-color="#047857" />
|
||||
<stop offset="35%" stop-color="#10b981" />
|
||||
<stop offset="75%" stop-color="#34d399" />
|
||||
<stop offset="100%" stop-color="#6ee7b7" />
|
||||
</linearGradient>
|
||||
|
||||
<!-- Dewdrop Gradient -->
|
||||
<radialGradient id="dewDropGradA" cx="35%" cy="30%" r="65%">
|
||||
<stop offset="0%" stop-color="#ffffff" />
|
||||
<stop offset="40%" stop-color="#d1fae5" />
|
||||
<stop offset="75%" stop-color="#34d399" />
|
||||
<stop offset="100%" stop-color="#059669" />
|
||||
</radialGradient>
|
||||
|
||||
<!-- Vein Filament Glow -->
|
||||
<filter id="veinGlowA" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feGaussianBlur stdDeviation="3" result="blur" />
|
||||
<feComposite in="SourceGraphic" in2="blur" operator="over" />
|
||||
</filter>
|
||||
|
||||
<!-- Dew Drop Flare -->
|
||||
<filter id="dewFlareA" x="-50%" y="-50%" width="200%" height="200%">
|
||||
<feGaussianBlur stdDeviation="5" result="blur" />
|
||||
<feComposite in="SourceGraphic" in2="blur" operator="over" />
|
||||
</filter>
|
||||
|
||||
<filter id="auraA" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feGaussianBlur stdDeviation="12" result="blur" />
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- Canvas -->
|
||||
<rect width="512" height="512" rx="128" fill="url(#bgA)" />
|
||||
|
||||
<!-- Botanical Ambient Rings & Aura -->
|
||||
<circle cx="256" cy="256" r="195" fill="none" stroke="#059669" stroke-width="1.2" stroke-opacity="0.2" stroke-dasharray="6 8" />
|
||||
<circle cx="256" cy="256" r="150" fill="none" stroke="#10b981" stroke-width="0.8" stroke-opacity="0.15" />
|
||||
<circle cx="240" cy="230" r="130" fill="#10b981" fill-opacity="0.05" filter="url(#auraA)" />
|
||||
|
||||
<!-- BOTANICAL SERIF F -->
|
||||
<g>
|
||||
<!-- Base Root Serif (Organic flared roots seamlessly sculpted at trunk foot) -->
|
||||
<path d="M 136 398
|
||||
C 165 394, 185 382, 194 358
|
||||
L 224 358
|
||||
C 233 382, 253 394, 282 398
|
||||
C 252 403, 230 400, 218 390
|
||||
C 206 400, 172 403, 136 398 Z"
|
||||
fill="url(#trunkGradA)" />
|
||||
|
||||
<!-- Main Trunk: Graceful Living Sprout Trunk with Seamless Classical Leaf Serif -->
|
||||
<path d="M 194 360
|
||||
C 192 290, 190 220, 188 155
|
||||
C 186 138, 172 126, 142 122
|
||||
C 138 121, 137 127, 140 129
|
||||
C 152 138, 172 148, 186 156
|
||||
L 190 124
|
||||
C 194 118, 204 116, 216 118
|
||||
C 224 120, 226 128, 224 140
|
||||
C 220 216, 222 295, 224 360
|
||||
Z"
|
||||
fill="url(#trunkGradA)" />
|
||||
|
||||
<!-- Trunk Inner Vitality Sap Line -->
|
||||
<path d="M 209 370 C 205 270, 203 190, 196 126"
|
||||
fill="none"
|
||||
stroke="#ecfdf5"
|
||||
stroke-width="2.2"
|
||||
stroke-linecap="round"
|
||||
filter="url(#veinGlowA)" />
|
||||
|
||||
<!-- TOP BAR: Outstretched Wind-Swept Willow Leaf / Botanical Plume -->
|
||||
<!-- Under-leaf layer for depth -->
|
||||
<path d="M 208 120
|
||||
C 255 98, 332 104, 405 146
|
||||
C 342 176, 268 168, 212 144
|
||||
Z"
|
||||
fill="url(#topLeafUnderA)" />
|
||||
|
||||
<!-- Upper luminous leaf surface -->
|
||||
<path d="M 208 120
|
||||
C 250 94, 328 96, 405 146
|
||||
C 338 162, 275 152, 212 136
|
||||
Z"
|
||||
fill="url(#topLeafGradA)" />
|
||||
|
||||
<!-- Top Leaf Master Rib / Vein Line -->
|
||||
<path d="M 212 124 C 275 110, 342 118, 402 146"
|
||||
fill="none"
|
||||
stroke="#ecfdf5"
|
||||
stroke-width="2.6"
|
||||
stroke-linecap="round"
|
||||
filter="url(#veinGlowA)" />
|
||||
|
||||
<!-- Top Leaf Delicate Lateral Veinlets -->
|
||||
<path d="M 252 116 Q 272 106, 292 110" fill="none" stroke="#a7f3d0" stroke-width="1.3" stroke-linecap="round" opacity="0.75" />
|
||||
<path d="M 292 117 Q 318 111, 342 120" fill="none" stroke="#a7f3d0" stroke-width="1.3" stroke-linecap="round" opacity="0.75" />
|
||||
<path d="M 334 123 Q 360 122, 382 134" fill="none" stroke="#a7f3d0" stroke-width="1.2" stroke-linecap="round" opacity="0.75" />
|
||||
<path d="M 270 124 Q 288 136, 310 142" fill="none" stroke="#10b981" stroke-width="1.2" stroke-linecap="round" opacity="0.5" />
|
||||
<path d="M 312 130 Q 336 142, 360 148" fill="none" stroke="#10b981" stroke-width="1.2" stroke-linecap="round" opacity="0.5" />
|
||||
|
||||
<!-- Dewdrop at Top Leaf Apex -->
|
||||
<g transform="translate(408, 147)">
|
||||
<circle cx="0" cy="0" r="14" fill="#34d399" fill-opacity="0.3" filter="url(#dewFlareA)" />
|
||||
<circle cx="0" cy="0" r="7.5" fill="url(#dewDropGradA)" />
|
||||
<circle cx="-2" cy="-2" r="2.5" fill="#ffffff" />
|
||||
<circle cx="2" cy="2" r="1" fill="#ffffff" fill-opacity="0.6" />
|
||||
</g>
|
||||
|
||||
<!-- MIDDLE BAR: Secondary Willow Leaf Shoot -->
|
||||
<path d="M 216 244
|
||||
C 252 230, 298 230, 350 255
|
||||
C 310 282, 260 278, 218 262
|
||||
Z"
|
||||
fill="url(#midLeafGradA)" />
|
||||
|
||||
<!-- Mid Leaf Master Rib -->
|
||||
<path d="M 220 248 C 262 238, 305 240, 348 255"
|
||||
fill="none"
|
||||
stroke="#ecfdf5"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
filter="url(#veinGlowA)" />
|
||||
|
||||
<!-- Mid Leaf Secondary Veinlets -->
|
||||
<path d="M 252 243 Q 270 234, 288 237" fill="none" stroke="#a7f3d0" stroke-width="1.2" stroke-linecap="round" opacity="0.7" />
|
||||
<path d="M 290 244 Q 312 240, 330 248" fill="none" stroke="#a7f3d0" stroke-width="1.1" stroke-linecap="round" opacity="0.7" />
|
||||
|
||||
<!-- Dewdrop at Mid Leaf Apex -->
|
||||
<g transform="translate(354, 256)">
|
||||
<circle cx="0" cy="0" r="10" fill="#34d399" fill-opacity="0.3" filter="url(#dewFlareA)" />
|
||||
<circle cx="0" cy="0" r="5.5" fill="url(#dewDropGradA)" />
|
||||
<circle cx="-1.5" cy="-1.5" r="1.8" fill="#ffffff" />
|
||||
</g>
|
||||
|
||||
<!-- Tender dewdrop nestled along lower stem -->
|
||||
<g transform="translate(204, 318)">
|
||||
<circle cx="0" cy="0" r="4.5" fill="url(#dewDropGradA)" />
|
||||
<circle cx="-1.2" cy="-1.2" r="1.5" fill="#ffffff" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.1 KiB |
Reference in New Issue
Block a user