audio streaming app
plyr.fm
fix: iOS Safari AddToMenu visibility issue (#573)
- bump z-index above Player (backdrop: 199, dropdown: 200)
- add translateZ(0) to force GPU layer and fix iOS stacking context
- add explicit width constraints
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
authored by
nate nowack
Claude Opus 4.5
and committed by
GitHub
582afa0f
0bef087d
+8
-12
+8
-12
frontend/src/lib/components/AddToMenu.svelte
+8
-12
frontend/src/lib/components/AddToMenu.svelte
···
754
754
left: 0;
755
755
right: 0;
756
756
bottom: 0;
757
-
z-index: 100;
757
+
z-index: 199;
758
758
background: rgba(0, 0, 0, 0.4);
759
+
-webkit-transform: translateZ(0);
760
+
transform: translateZ(0);
759
761
}
760
762
761
763
.menu-dropdown {
···
764
766
bottom: auto;
765
767
left: 0;
766
768
right: 0;
769
+
width: 100%;
767
770
min-width: 100%;
771
+
max-width: 100vw;
768
772
border-radius: 0 0 16px 16px;
769
773
padding-top: env(safe-area-inset-top, 0);
770
-
animation: slideDown 0.2s ease-out;
771
-
z-index: 101;
772
-
}
773
-
774
-
@keyframes slideDown {
775
-
from {
776
-
transform: translateY(-100%);
777
-
}
778
-
to {
779
-
transform: translateY(0);
780
-
}
774
+
z-index: 200;
775
+
-webkit-transform: translateZ(0);
776
+
transform: translateZ(0);
781
777
}
782
778
783
779
.menu-item {