Current Behavior
The responsive YouTube embed styles are currently defined inside: assets/scss/_videos_project.scss
The file contains both:
- generic .yt-embed-container responsive iframe styles
- Layer5-specific video/card/carousel styles that depend on Layer5 SCSS variables.
The .yt-embed-container rules themselves do not require those variables, but because they are part of the same SCSS file, consuming repositories cannot import only the generic responsive-video implementation without also pulling in the unrelated styles and their dependencies.
This has resulted in Meshery maintaining a separate .iframe-container implementation for the same responsive YouTube/iframe use case.
Expected Behavior
The generic .yt-embed-container responsive styles should be available as a standalone, dependency-free SCSS partial that can be imported independently.
_videos_project.scss should continue consuming the extracted partial so that Layer5's existing video embeds retain the same behavior.
This would allow downstream Hugo sites such as Meshery to consume the same upstream responsive-video implementation instead of maintaining their own duplicate CSS.
Context
This was identified while working on responsive embedded videos in meshery/meshery#21628.
Meshery currently has an equivalent local .iframe-container implementation. Once this upstream change is available, Meshery can consume the shared implementation and remove its local duplicate.
Environment
- Host OS: Mac Linux Windows
- Browser: Chrome Safari Firefox Edge Opera
Contributor Guide and Resources
Current Behavior
The responsive YouTube embed styles are currently defined inside:
assets/scss/_videos_project.scssThe file contains both:
The
.yt-embed-containerrules themselves do not require those variables, but because they are part of the same SCSS file, consuming repositories cannot import only the generic responsive-video implementation without also pulling in the unrelated styles and their dependencies.This has resulted in Meshery maintaining a separate
.iframe-containerimplementation for the same responsive YouTube/iframe use case.Expected Behavior
The generic
.yt-embed-containerresponsive styles should be available as a standalone, dependency-free SCSS partial that can be imported independently._videos_project.scssshould continue consuming the extracted partial so that Layer5's existing video embeds retain the same behavior.This would allow downstream Hugo sites such as Meshery to consume the same upstream responsive-video implementation instead of maintaining their own duplicate CSS.
Context
This was identified while working on responsive embedded videos in meshery/meshery#21628.
Meshery currently has an equivalent local .iframe-container implementation. Once this upstream change is available, Meshery can consume the shared implementation and remove its local duplicate.
Environment
Contributor Guide and Resources