Remove film birds; fix language pill highlight

Strip every bird from the demo mockups: both hero video tabs and both
step-3 player scenes lose the background flock (.film-birds) and the
foreground flapping bird (.film-hero-bird), plus all related CSS in
styles/demo.css and the dead style.legacy.css.

Language selector: the <select> was 30px narrower than its pill, so in
appearance:base-select the click/focus highlight covered only the inner
~110px ("half the box"). Move the padding from the container onto the
control so it fills the pill edge-to-edge; mirror the fix in the mobile
legal.css override.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
KoalaDev
2026-07-12 03:57:18 +02:00
parent 17c9da292c
commit 16cb138eeb
5 changed files with 14 additions and 163 deletions
-42
View File
@@ -451,11 +451,6 @@
<circle cx="123" cy="22.4" r="0.8"/>
</g>
</g>
<g class="film-birds" stroke="#dbd7cd" stroke-width="0.55" fill="none" stroke-linecap="round">
<path d="M-4,32 q1.5,-1.5 3,0 q1.5,-1.5 3,0"/>
<path d="M-11,28 q1.2,-1.2 2.4,0 q1.2,-1.2 2.4,0"/>
<path d="M-8,36 q1,-1 2,0 q1,-1 2,0"/>
</g>
<path class="film-mtn-scroll" d="M0,60 L30,45 L70,55 L110,40 L160,60 L190,45 L230,55 L270,40 L320,60 L320,92 L0,92 Z" fill="rgba(14, 31, 15, 0.7)"/>
<g class="film-mist-scroll" fill="#dbd7cd">
<ellipse cx="40" cy="63" rx="46" ry="4" opacity="0.055"/>
@@ -481,15 +476,6 @@
<polygon points="275,84 288,42 301,84" fill="#040903"/>
<path d="M0,84 Q80,82 160,84 T320,84 L320,92 L0,92 Z" fill="#040903"/>
</g>
<g class="film-hero-bird-drift">
<g class="film-hero-bird" aria-hidden="true">
<path class="film-bird-wing film-bird-wing-left" d="M74.5,34.5 C70.5,29 66,27.8 61.5,30 C66.2,30.1 70.2,32.5 75,36"/>
<path class="film-bird-wing film-bird-wing-right" d="M76.5,34.5 C80.8,29.2 85.2,28.5 89.5,31 C84.9,30.9 81.2,33 76,36"/>
<path class="film-bird-body" d="M71.5,34.2 C72.8,31.8 75.1,30.8 77.5,31.4 C79.5,31.9 80.8,33.5 81.1,35.4 C78.2,37 74.3,36.9 71.5,34.2 Z"/>
<circle class="film-bird-eye" cx="78.8" cy="33" r="0.55"/>
<path class="film-bird-beak" d="M80.2,33.2 L83,34 L80.3,34.7 Z"/>
</g>
</g>
</svg>
<div class="demo-play-overlay" aria-hidden="true">
<span class="demo-icon-wrap">
@@ -553,11 +539,6 @@
<circle cx="123" cy="22.4" r="0.8"/>
</g>
</g>
<g class="film-birds" stroke="#dbd7cd" stroke-width="0.55" fill="none" stroke-linecap="round">
<path d="M-4,32 q1.5,-1.5 3,0 q1.5,-1.5 3,0"/>
<path d="M-11,28 q1.2,-1.2 2.4,0 q1.2,-1.2 2.4,0"/>
<path d="M-8,36 q1,-1 2,0 q1,-1 2,0"/>
</g>
<path class="film-mtn-scroll" d="M0,60 L30,45 L70,55 L110,40 L160,60 L190,45 L230,55 L270,40 L320,60 L320,92 L0,92 Z" fill="rgba(14, 31, 15, 0.7)"/>
<g class="film-mist-scroll" fill="#dbd7cd">
<ellipse cx="40" cy="63" rx="46" ry="4" opacity="0.055"/>
@@ -583,15 +564,6 @@
<polygon points="275,84 288,42 301,84" fill="#040903"/>
<path d="M0,84 Q80,82 160,84 T320,84 L320,92 L0,92 Z" fill="#040903"/>
</g>
<g class="film-hero-bird-drift">
<g class="film-hero-bird" aria-hidden="true">
<path class="film-bird-wing film-bird-wing-left" d="M74.5,34.5 C70.5,29 66,27.8 61.5,30 C66.2,30.1 70.2,32.5 75,36"/>
<path class="film-bird-wing film-bird-wing-right" d="M76.5,34.5 C80.8,29.2 85.2,28.5 89.5,31 C84.9,30.9 81.2,33 76,36"/>
<path class="film-bird-body" d="M71.5,34.2 C72.8,31.8 75.1,30.8 77.5,31.4 C79.5,31.9 80.8,33.5 81.1,35.4 C78.2,37 74.3,36.9 71.5,34.2 Z"/>
<circle class="film-bird-eye" cx="78.8" cy="33" r="0.55"/>
<path class="film-bird-beak" d="M80.2,33.2 L83,34 L80.3,34.7 Z"/>
</g>
</g>
</svg>
<div class="demo-play-overlay" aria-hidden="true">
<span class="demo-icon-wrap">
@@ -1286,13 +1258,6 @@
<polygon points="115,84 128,42 141,84" fill="#040903"/>
<path d="M0,84 Q40,82 80,84 T160,84 L160,92 L0,92 Z" fill="#040903"/>
</g>
<g class="film-hero-bird" aria-hidden="true">
<path class="film-bird-wing film-bird-wing-left" d="M74.5,34.5 C70.5,29 66,27.8 61.5,30 C66.2,30.1 70.2,32.5 75,36"/>
<path class="film-bird-wing film-bird-wing-right" d="M76.5,34.5 C80.8,29.2 85.2,28.5 89.5,31 C84.9,30.9 81.2,33 76,36"/>
<path class="film-bird-body" d="M71.5,34.2 C72.8,31.8 75.1,30.8 77.5,31.4 C79.5,31.9 80.8,33.5 81.1,35.4 C78.2,37 74.3,36.9 71.5,34.2 Z"/>
<circle class="film-bird-eye" cx="78.8" cy="33" r="0.55"/>
<path class="film-bird-beak" d="M80.2,33.2 L83,34 L80.3,34.7 Z"/>
</g>
</svg>
</div>
<div class="player-controls">
@@ -1345,13 +1310,6 @@
<polygon points="115,84 128,42 141,84" fill="#040903"/>
<path d="M0,84 Q40,82 80,84 T160,84 L160,92 L0,92 Z" fill="#040903"/>
</g>
<g class="film-hero-bird" aria-hidden="true">
<path class="film-bird-wing film-bird-wing-left" d="M74.5,34.5 C70.5,29 66,27.8 61.5,30 C66.2,30.1 70.2,32.5 75,36"/>
<path class="film-bird-wing film-bird-wing-right" d="M76.5,34.5 C80.8,29.2 85.2,28.5 89.5,31 C84.9,30.9 81.2,33 76,36"/>
<path class="film-bird-body" d="M71.5,34.2 C72.8,31.8 75.1,30.8 77.5,31.4 C79.5,31.9 80.8,33.5 81.1,35.4 C78.2,37 74.3,36.9 71.5,34.2 Z"/>
<circle class="film-bird-eye" cx="78.8" cy="33" r="0.55"/>
<path class="film-bird-beak" d="M80.2,33.2 L83,34 L80.3,34.7 Z"/>
</g>
</svg>
</div>
<div class="player-controls">