Skip to content

Commit 3556e97

Browse files
explodedclaude
andcommitted
Fix rating bar not rendering on iOS Safari
iOS Safari has a known issue where backdrop-filter inside overflow:hidden + border-radius containers fails to paint. Switch to a solid background on touch devices instead. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent 5e13950 commit 3556e97

1 file changed

Lines changed: 6 additions & 1 deletion

File tree

static/styles.css

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -569,11 +569,16 @@ em { font-style: italic; }
569569
opacity: 1;
570570
transform: translateY(0);
571571
}
572-
/* Touch devices have no hover — always show the rating bar */
572+
/* Touch devices have no hover — always show the rating bar.
573+
Drop backdrop-filter (broken in iOS Safari inside overflow:hidden + border-radius)
574+
and use a solid background instead. */
573575
@media (hover: none) {
574576
.poster-card__rate {
575577
opacity: 1;
576578
transform: translateY(0);
579+
background: rgb(11, 9, 8);
580+
backdrop-filter: none;
581+
-webkit-backdrop-filter: none;
577582
}
578583
.rate-btn { height: 36px; }
579584
.rate-btn svg { width: 16px; height: 16px; }

0 commit comments

Comments
 (0)