feat: set max-height for hero section

acid-info · Jul 10, 2023 · 90870a3 · 90870a3
1 parent a14f423
commit 90870a3
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/Hero/Hero.scss b/packages/logos-docusaurus-theme/src/client/components/mdx/Hero/Hero.scss
@@ -1,8 +1,11 @@
 .mdx-hero {
+  --hero-max-height: 1080px;
+
   position: relative;
   display: flex;
   flex-direction: column;
   height: calc(100vh - var(--ifm-navbar-height) - 8px);
+  max-height: var(--hero-max-height);
 }
 
 .mdx-hero--large {

diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/HeroVideo/HeroVideo.tsx b/packages/logos-docusaurus-theme/src/client/components/mdx/HeroVideo/HeroVideo.tsx
@@ -75,8 +75,9 @@ export const HeroVideo: React.FC<HeroVideoProps> = ({
           {
             'hero-video-scale': desktop?.scale ?? '1.70951586',
             'hero-video-offset-y': desktop?.offsetY ?? '-150px',
-            'hero-video-height': desktop?.height ?? '120%',
-            'hero-video-min-height': desktop?.minHeight ?? '100vh',
+            'hero-video-height': desktop?.height ?? '100%',
+            'hero-video-min-height':
+              desktop?.minHeight ?? 'min(100vh, var(--hero-max-height))',
             'hero-video-scale-mobile': mobile?.scale ?? '1.70951586',
             'hero-video-offset-y-mobile': mobile?.offsetY ?? '-50px',
             'hero-video-height-mobile': mobile?.height ?? '120%',