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

fix(ai): remove video modal css overrides breaking layout (agent)

Browse Source 
This change removes a block of CSS in `css/tailwind.source.css` that was incorrectly applying `!important` layout overrides to the main video modal (`.video-modal__*`, `#modalVideo`), causing visual regressions. These overrides were likely intended for the embed view but were scoped too broadly. `embed.html` uses distinct selectors and remains unaffected, as verified by visual tests.

- Removed destructive `!important` rules for `.video-modal__*` and `#modalVideo`.
- Preserved `.bv-logo__accent` theming rule.
- Rebuilt CSS.
This commit is contained in:
google-labs-jules[bot] committed 2026-01-25 02:57:50 +00:00
1 parent 7132a80709
commit d06a4298ee
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));