aljaz/boris
1
1
Fork 0
mirror of https://github.com/dergigi/boris.git synced 2026-01-06 08:24:27 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(reader): use responsive aspect-ratio container for videos to fill full width

Browse Source
This commit is contained in:
Gigi
2025-10-13 18:30:09 +02:00
parent 44befab6d3
commit 4c11c5fc54
2 changed files with 14 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/styles/components/reader.css
View File

@@ -2,9 +2,20 @@
.reader { background: #1a1a1a; border: 1px solid #333; border-radius: 8px; padding: 0.75rem; text-align: left; overflow: hidden; contain: layout style; }
/* Video container in reader - break out of padding to use full width */
.reader-video {
width: 100%;
margin: -0.75rem -0.75rem 1rem -0.75rem;
border-radius: 8px 8px 0 0;
overflow: hidden;
border-radius: 0;
overflow: hidden;
position: relative;
aspect-ratio: 16 / 9;
}
/* Make ReactPlayer fill the container */
.reader-video > div {
position: absolute !important;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
.reader.empty { color: #888; }
.loading-spinner { display: flex; align-items: center; gap: 0.5rem; color: #888; }