gsadmin/KoalaSync
1
0
Fork 0
mirror of https://github.com/Shik3i/KoalaSync.git synced 2026-08-24 09:46:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix bamboo stalk taper and align stray colors to palette

Browse Source 
The stalks used border-radius:50%, which renders a tall ellipse whose
ends taper to points, and unbounded parallax drift pushed them off the
bottom of the viewport on long pages. Rounded caps + 20% overscan +
a viewport-relative drift clamp keep them full-height while scrolling.

Sweep the remaining off-palette colors into the nature palette:
content-script overlays (slate grays), amber warnings/badges/star
accents (now terracotta) in popup, background badge and website
illustrations, and the support-heart red (now --danger).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
KoalaDev
2026-07-10 19:28:50 +02:00
parent aa52d319e1
commit 1f1844e99b
8 changed files with 53 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/template.html
+5 -5
View File
@@ -425,7 +425,7 @@
<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>
<circle class="film-bounce-ball" cx="80" cy="46" r="3.5" fill="#fde047"/>
<circle class="film-bounce-ball" cx="80" cy="46" r="3.5" fill="#de7949"/>
</svg>
<div class="demo-play-overlay" aria-hidden="true">
<span class="demo-icon-wrap">
@@ -482,7 +482,7 @@
<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>
<circle class="film-bounce-ball" cx="80" cy="46" r="3.5" fill="#fde047"/>
<circle class="film-bounce-ball" cx="80" cy="46" r="3.5" fill="#de7949"/>
</svg>
<div class="demo-play-overlay" aria-hidden="true">
<span class="demo-icon-wrap">
@@ -1169,7 +1169,7 @@
<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>
<circle class="film-bounce-ball" cx="80" cy="80" r="4.5" fill="#fde047"/>
<circle class="film-bounce-ball" cx="80" cy="80" r="4.5" fill="#de7949"/>
</svg>
</div>
<div class="player-controls">
@@ -1222,7 +1222,7 @@
<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>
<circle class="film-bounce-ball" cx="80" cy="80" r="4.5" fill="#fde047"/>
<circle class="film-bounce-ball" cx="80" cy="80" r="4.5" fill="#de7949"/>
</svg>
</div>
<div class="player-controls">
@@ -1463,7 +1463,7 @@
<a href="{{ASSET_PATH}}{{FOOTER_LEGAL_LINK}}" style="color: var(--text-muted); text-decoration: none;"><span>{{FOOTER_LEGAL}}</span></a>
<a href="{{ASSET_PATH}}{{FOOTER_PRIVACY_LINK}}" style="color: var(--text-muted); text-decoration: none;"><span>{{FOOTER_PRIVACY}}</span></a>
<a href="{{ASSET_PATH}}{{LANG_PREFIX}}alternatives"><span><span lang="en">Guides & comparisons</span><span lang="de">Vergleiche & Anleitungen</span></span></a>
<a href="https://support.koalastuff.net" target="_blank" rel="noopener" title="{{FOOTER_SUPPORT}}" style="color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; background: #c9302c; border: 1px solid rgba(255,255,255,0.18); border-radius: 999px; padding: 3px 9px; font-size: 0.72rem; font-weight: 700; line-height: 1;">
<a href="https://support.koalastuff.net" target="_blank" rel="noopener" title="{{FOOTER_SUPPORT}}" style="color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; background: #b94642; border: 1px solid rgba(255,255,255,0.18); border-radius: 999px; padding: 3px 9px; font-size: 0.72rem; font-weight: 700; line-height: 1;">
<span aria-hidden="true">♥</span>
<span>{{FOOTER_SUPPORT}}</span>
</a>