thePR0M3TH3AN/bitvid
1
0 Fork 0
mirror of https://github.com/PR0M3TH3AN/bitvid.git synced 2026-10-27 07:52:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1665 from PR0M3TH3AN/fix-video-modal-css-conflict-18316255251114241385

Browse Source 
Fix video player modal layout by removing conflicting CSS overrides
This commit is contained in:
thePR0M3TH3AN authored and GitHub committed 2026-01-24 22:16:13 -05:00
2 parents 7f38c4597b d06a4298ee
commit 7afe811b1f
1 file changed
-71
Download Patch File Download Diff File Expand all files Collapse all files
css/tailwind.source.css
-71
View File
@@ -6097,77 +6097,6 @@
/* Embed & Video Modal Fixes */
@layer components {
/* Force the video stage to let the video fully fill it and prevent 80vh constraints */
.video-modal__stage,
.video-modal__video,
.video-modal__panel {
/* allow child to fill: do not let other rules limit height */
max-height: none !important;
height: 100% !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
display: flex !important;
align-items: stretch !important; /* allows the video to stretch vertically */
justify-content: center !important;
}
/* Prevent any earlier max-height on modal container from clashing */
.bv-modal__panel[role="dialog"],
.bv-modal__panel {
max-height: none !important;
}
/* Definitive video rules */
#modalVideo,
.video-modal__media {
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important; /* ensure no earlier max-height causes clipping */
object-fit: cover !important; /* or contain if you prefer letterbox */
object-position: center center !important;
background: transparent !important;
padding: 0 !important;
margin: 0 !important;
box-sizing: border-box !important;
}
/* permanent class to force fill */
.video-modal__media--fill {
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-position: center center !important;
background: transparent !important;
}
.video-modal__stage {
position: relative; /* ensure ambient is absolutely positioned relative to stage */
overflow: hidden; /* clip any bleed visually; prevents layout expansion */
}
.video-modal__ambient {
position: absolute;
inset: calc(var(--video-modal-ambient-bleed) * -1);
pointer-events: none; /* ensure it never captures pointer events */
z-index: 0; /* behind content */
will-change: transform, opacity;
}
/* ensure video is above ambient */
.video-modal__video { position: relative; z-index: 1; }
/* if there is an ambient canvas or overlay, ensure it doesn't change layout */
.video-modal__ambient-canvas {
position: relative;
width: 100%;
height: 100%;
display: block;
}
/* Logo accent wiring */
.bv-logo__accent {
fill: var(--bitvid-accent, var(--logo-accent-color));