gitea/nas
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

fix: Fix broken audio player layout in Safari, #34930 (#34933)

Browse source
This commit is contained in:
diondiondion 2025-06-04 17:34:13 +02:00 • committed by GitHub
parent 6637ecb460
commit 1dafd8c9dd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 16 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

23
app/javascript/styles/mastodon/components.scss
View file

@ -7068,18 +7068,19 @@ a.status-card {
} }
.audio-player { .audio-player {
overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
container: audio-player / inline-size;
position: relative; position: relative;
background: var(--player-background-color, var(--background-color)); overflow: hidden;
color: var(--player-foreground-color); display: flex;
border-radius: 8px; flex-direction: column;
padding-bottom: 44px;
width: 100%; width: 100%;
aspect-ratio: 16 / 9;
color: var(--player-foreground-color);
background: var(--player-background-color, var(--background-color));
border-radius: 8px;
outline: 1px solid var(--media-outline-color); outline: 1px solid var(--media-outline-color);
outline-offset: -1px; outline-offset: -1px;
aspect-ratio: 16 / 9;
container: audio-player / inline-size;
&__controls { &__controls {
display: grid; display: grid;
@ -7128,9 +7129,17 @@ a.status-card {
} }
&__visualizer { &__visualizer {
width: 100%;
max-width: 200px; max-width: 200px;
} }
.video-player__seek {
position: absolute;
inset: 0 0 auto;
height: 24px;
z-index: 1; /* Ensure this renders on top of audio player controls */
}
&.inactive { &.inactive {
.video-player__seek, .video-player__seek,
.audio-player__controls, .audio-player__controls,