diff --git a/components/ImageOverlay.tsx b/components/ImageOverlay.tsx
index 3e12b7b0..6b61a28b 100644
--- a/components/ImageOverlay.tsx
+++ b/components/ImageOverlay.tsx
@@ -11,7 +11,7 @@ export const overlays = {
'black-gradient-dark': 'bg-gradient-to-b from-transparent via-black-true/30 to-black-true/80',
'black-top-bottom': 'bg-gradient-to-b from-gc-black via-transparent via-40% to-gc-black',
'black-top-sm': 'bg-gradient-to-b from-gc-black via-periwinkle via-20% to-transparent',
- 'white-70': 'bg-white/70',
+ 'white-90': 'bg-white/90',
};
export type OverlayType = keyof typeof overlays | '';
diff --git a/components/Storyblok/SbGrid.tsx b/components/Storyblok/SbGrid.tsx
index 82fdd318..5f78e5ab 100644
--- a/components/Storyblok/SbGrid.tsx
+++ b/components/Storyblok/SbGrid.tsx
@@ -1,11 +1,13 @@
import { storyblokEditable, type SbBlokData } from '@storyblok/react/rsc';
import { Grid, type GridGapType, type GridNumColsType } from '../Grid';
+import { WidthBox, type WidthType } from '../WidthBox';
import { CreateBloks } from '../CreateBloks';
type SbGridProps = {
blok: {
_uid: string;
gap?: GridGapType;
+ width?: WidthType;
items: SbBlokData[];
/**
* Currently we're only providing 1-4 columns in Storyblok even though GridNumColsType also supports 6 and 12
@@ -23,6 +25,7 @@ type SbGridProps = {
export const SbGrid = ({
blok: {
gap,
+ width = 'full',
items,
xs,
sm,
@@ -33,16 +36,20 @@ export const SbGrid = ({
},
blok,
}: SbGridProps) => (
-
-
-
+
+
+
+
);
diff --git a/components/Storyblok/SbSection.tsx b/components/Storyblok/SbSection.tsx
index ddb43f5e..5965f03d 100644
--- a/components/Storyblok/SbSection.tsx
+++ b/components/Storyblok/SbSection.tsx
@@ -7,6 +7,7 @@ import {
} from '../Typography';
import { Container, type BgColorType } from '../Container';
import { ImageOverlay } from '../ImageOverlay';
+import { WidthBox, type WidthType } from '../WidthBox';
import { accentBgColors, type PaddingType } from '@/utilities/datasource';
import { paletteAccentColors, type PaletteAccentHexColorType } from '@/utilities/colorPalettePlugin';
import { type SbImageType } from './Storyblok.types';
@@ -56,7 +57,7 @@ export const SbSection = ({
className="relative overflow-hidden"
>
{filename && (
-
+
)}
{(heading || superhead) && (
@@ -106,7 +107,7 @@ export const SbSection = ({
)}
-
+