Set custom width for the carousel grid

NASA-IMPACT · Nov 15, 2024 · 3fcc29a · 3fcc29a
1 parent e24f66e
commit 3fcc29a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/overrides/home/carousel/index.scss b/overrides/home/carousel/index.scss
@@ -41,4 +41,12 @@
     &--title {
       font-size: 1.25rem;
     }
+  }
+
+  .carousel-grid-container {
+    // Overriding the default max-width of the USWDS grid container 1440px.
+    // However, this needs to be configured on a per instance basis as a part of
+    // the USWDS settings configuration file. Since we're not exporting yet this
+    // config file from the veda-ui, we're setting this here as a workaround.
+    max-width: 1440px;
   }
diff --git a/overrides/home/carousel/index.tsx b/overrides/home/carousel/index.tsx
@@ -51,7 +51,7 @@ export function DesktopCarousel () {
 
 
   return (
-    <GridContainer aria-roledescription="carousel" aria-label="Highlighted VEDA Dashboard projects">
+    <GridContainer className="carousel-grid-container" aria-roledescription="carousel" aria-label="Highlighted VEDA Dashboard projects">
       <Grid row className="position-relative carousel--height" aria-live="off">
       <TransitionGroup>
           <CSSTransition