Redesign public site, add phase gating and clip submission
- Rebuild landing page and Nominations/Voting/Winners views in the Jayuhime brand style (purple/gold/pastel-rainbow, stars, PageHero banner) - Gate participation by season phase (nominate/clip share the nomination window, vote in the voting window); hide closed/locked pages from nav - Add login-gated clip submission flow (link-based) + voting clip links - Make candidate admin scalable: searchable, filterable, paginated table with modal create/edit and confirm-delete; add delete API/store actions - New reusable Modal and PageHero components, usePhases composable - Segmented top nav and full-size header on admin routes - vite: honor PORT env for preview Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,131 @@
|
||||
<svg viewBox="0 0 720 880" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Jayuhime Keyvisual (stilisierter Platzhalter)">
|
||||
<defs>
|
||||
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0%" stop-color="#efe6ff"/>
|
||||
<stop offset="55%" stop-color="#f6ecff"/>
|
||||
<stop offset="100%" stop-color="#fff1da"/>
|
||||
</linearGradient>
|
||||
<radialGradient id="glow" cx="50%" cy="34%" r="55%">
|
||||
<stop offset="0%" stop-color="#ffffff" stop-opacity="0.95"/>
|
||||
<stop offset="100%" stop-color="#ffffff" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
<linearGradient id="gold" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#ffe39b"/>
|
||||
<stop offset="55%" stop-color="#f6b938"/>
|
||||
<stop offset="100%" stop-color="#d98e1d"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="robe" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0%" stop-color="#8b6bff"/>
|
||||
<stop offset="100%" stop-color="#5b34c9"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="robeDark" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0%" stop-color="#6f4fe0"/>
|
||||
<stop offset="100%" stop-color="#4a279f"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="hair" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#ffffff"/>
|
||||
<stop offset="100%" stop-color="#ece4fb"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="rainbow" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#c4b5fd"/>
|
||||
<stop offset="28%" stop-color="#f5a9d6"/>
|
||||
<stop offset="52%" stop-color="#fcd34d"/>
|
||||
<stop offset="76%" stop-color="#86efac"/>
|
||||
<stop offset="100%" stop-color="#7dd3fc"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<rect width="720" height="880" fill="url(#bg)"/>
|
||||
<rect width="720" height="880" fill="url(#glow)"/>
|
||||
|
||||
<!-- sparkles -->
|
||||
<g fill="#f6b938" opacity="0.85">
|
||||
<circle cx="120" cy="130" r="4"/><circle cx="610" cy="100" r="5"/><circle cx="665" cy="250" r="3"/>
|
||||
<circle cx="70" cy="350" r="3"/><circle cx="650" cy="470" r="4"/><circle cx="150" cy="540" r="3"/>
|
||||
</g>
|
||||
<g fill="#a78bff" opacity="0.65">
|
||||
<circle cx="205" cy="90" r="3"/><circle cx="545" cy="170" r="3"/><circle cx="80" cy="230" r="4"/><circle cx="605" cy="370" r="3"/>
|
||||
</g>
|
||||
<g fill="#ffffff">
|
||||
<path d="M150 200 l6 14 14 6 -14 6 -6 14 -6 -14 -14 -6 14 -6z" opacity="0.9"/>
|
||||
<path d="M585 300 l5 11 11 5 -11 5 -5 11 -5 -11 -11 -5 11 -5z" opacity="0.85"/>
|
||||
<path d="M120 640 l5 11 11 5 -11 5 -5 11 -5 -11 -11 -5 11 -5z" opacity="0.8"/>
|
||||
</g>
|
||||
|
||||
<!-- soft halo behind host -->
|
||||
<circle cx="360" cy="300" r="210" fill="#ffffff" opacity="0.45"/>
|
||||
|
||||
<!-- ===== back hair (long locks framing the body) ===== -->
|
||||
<path d="M286 250 C232 360 226 520 252 690 C272 650 300 648 318 596 C300 470 300 350 322 286 Z" fill="url(#hair)"/>
|
||||
<path d="M434 250 C488 360 494 520 468 690 C448 650 420 648 402 596 C420 470 420 350 398 286 Z" fill="url(#hair)"/>
|
||||
<!-- rainbow streaks inside the locks -->
|
||||
<path d="M296 320 C268 420 266 540 286 660 C300 624 308 600 308 560 C298 470 298 384 308 330 Z" fill="url(#rainbow)" opacity="0.9"/>
|
||||
<path d="M424 320 C452 420 454 540 434 660 C420 624 412 600 412 560 C422 470 422 384 412 330 Z" fill="url(#rainbow)" opacity="0.9"/>
|
||||
|
||||
<!-- ===== dress (bell skirt) ===== -->
|
||||
<path d="M322 452 C300 600 250 760 214 868 C300 884 420 884 506 868 C470 760 420 600 398 452 Z" fill="url(#robe)"/>
|
||||
<!-- skirt shading -->
|
||||
<path d="M360 452 C352 600 340 760 332 868 L388 868 C380 760 368 600 360 452 Z" fill="#ffffff" opacity="0.12"/>
|
||||
<!-- gold star accents on skirt -->
|
||||
<g fill="url(#gold)" opacity="0.92">
|
||||
<path d="M300 640 l5 12 13 5 -13 5 -5 12 -5 -12 -13 -5 13 -5z"/>
|
||||
<path d="M420 600 l4 10 11 4 -11 4 -4 10 -4 -10 -11 -4 11 -4z"/>
|
||||
<path d="M360 730 l5 12 13 5 -13 5 -5 12 -5 -12 -13 -5 13 -5z"/>
|
||||
</g>
|
||||
<!-- white ruffle hem -->
|
||||
<path d="M214 862 q24 -22 48 0 q24 22 48 0 q24 -22 48 0 q24 22 48 0 q24 -22 48 0 q24 22 52 0 l0 22 -340 0 z" fill="#ffffff" opacity="0.95"/>
|
||||
|
||||
<!-- ===== bodice ===== -->
|
||||
<path d="M316 352 C322 336 398 336 404 352 L400 458 L320 458 Z" fill="url(#robeDark)"/>
|
||||
<!-- star cutout on chest -->
|
||||
<path d="M360 392 l8 18 19 7 -19 8 -8 18 -8 -18 -19 -8 19 -7z" fill="#f6ecff" opacity="0.85"/>
|
||||
<!-- waist sash -->
|
||||
<rect x="318" y="446" width="84" height="16" rx="8" fill="url(#gold)"/>
|
||||
|
||||
<!-- ===== lower (left) arm + puff sleeve ===== -->
|
||||
<path d="M322 372 C300 420 292 470 300 512" fill="none" stroke="#fff4ec" stroke-width="22" stroke-linecap="round"/>
|
||||
<circle cx="318" cy="372" r="26" fill="#ffffff"/>
|
||||
|
||||
<!-- ===== raised (right) arm holding trophy ===== -->
|
||||
<path d="M402 372 C448 350 486 300 500 250" fill="none" stroke="#fff4ec" stroke-width="22" stroke-linecap="round"/>
|
||||
<circle cx="402" cy="372" r="26" fill="#ffffff"/>
|
||||
<circle cx="500" cy="246" r="15" fill="#fff4ec"/>
|
||||
|
||||
<!-- ===== neck + collar ruffle ===== -->
|
||||
<rect x="350" y="300" width="20" height="40" rx="9" fill="#fff4ec"/>
|
||||
<path d="M324 344 q18 -16 36 0 q18 16 36 0 l0 14 -72 0 z" fill="#ffffff"/>
|
||||
|
||||
<!-- ===== face ===== -->
|
||||
<circle cx="360" cy="252" r="60" fill="#fff4ec"/>
|
||||
<!-- cheeks -->
|
||||
<circle cx="326" cy="268" r="9" fill="#ffc6cf" opacity="0.7"/>
|
||||
<circle cx="394" cy="268" r="9" fill="#ffc6cf" opacity="0.7"/>
|
||||
<!-- eyes -->
|
||||
<ellipse cx="341" cy="254" rx="6" ry="8" fill="#6b4bd6"/>
|
||||
<ellipse cx="379" cy="254" rx="6" ry="8" fill="#6b4bd6"/>
|
||||
<circle cx="343" cy="251" r="2" fill="#ffffff"/>
|
||||
<circle cx="381" cy="251" r="2" fill="#ffffff"/>
|
||||
<!-- smile -->
|
||||
<path d="M349 276 q11 9 22 0" fill="none" stroke="#caa6a0" stroke-width="3" stroke-linecap="round"/>
|
||||
<!-- monocle on right eye -->
|
||||
<circle cx="379" cy="254" r="17" fill="none" stroke="url(#gold)" stroke-width="3.5"/>
|
||||
<path d="M379 271 q5 24 22 32" fill="none" stroke="url(#gold)" stroke-width="2" stroke-linecap="round"/>
|
||||
|
||||
<!-- ===== bangs over forehead ===== -->
|
||||
<path d="M300 250 C300 168 330 138 360 138 C390 138 420 168 420 250 C402 222 384 214 360 214 C336 214 318 222 300 250 Z" fill="url(#hair)"/>
|
||||
<path d="M360 214 C346 214 334 220 326 234 L334 250 C342 230 378 230 386 250 L394 234 C386 220 374 214 360 214 Z" fill="#ece4fb" opacity="0.6"/>
|
||||
|
||||
<!-- ===== star hairbuns ===== -->
|
||||
<path d="M296 168 l10 22 23 9 -23 10 -10 22 -10 -22 -23 -10 23 -9z" fill="url(#gold)"/>
|
||||
<path d="M424 168 l10 22 23 9 -23 10 -10 22 -10 -22 -23 -10 23 -9z" fill="url(#gold)"/>
|
||||
|
||||
<!-- ===== trophy in raised hand ===== -->
|
||||
<g transform="translate(458 110)">
|
||||
<path d="M22 0 h84 v28 q0 50 -42 64 q-42 -14 -42 -64 z" fill="url(#gold)"/>
|
||||
<path d="M22 7 h-22 q0 36 30 40" fill="none" stroke="url(#gold)" stroke-width="10" stroke-linecap="round"/>
|
||||
<path d="M106 7 h22 q0 36 -30 40" fill="none" stroke="url(#gold)" stroke-width="10" stroke-linecap="round"/>
|
||||
<rect x="58" y="90" width="12" height="30" fill="url(#gold)"/>
|
||||
<rect x="40" y="118" width="48" height="14" rx="5" fill="url(#gold)"/>
|
||||
<path d="M64 16 l8 19 20 1 -15 13 5 20 -18 -11 -18 11 5 -20 -15 -13 20 -1z" fill="#ffffff" opacity="0.95"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.9 KiB |
Reference in New Issue
Block a user