Merge branch 'develop' into bug/grid-sizing-docs

Amsterdam · Nov 27, 2023 · 6ab7c9a · 6ab7c9a
2 parents 3606f10 + 1953e9d
commit 6ab7c9a
Show file tree

Hide file tree

Showing 6 changed files with 6 additions and 27 deletions.
diff --git a/packages/css/src/footer/footer.scss b/packages/css/src/footer/footer.scss
diff --git a/packages/css/src/index.scss b/packages/css/src/index.scss
@@ -16,7 +16,6 @@
 @import "./button/button";
 @import "./card/card";
 @import "./checkbox/checkbox";
-@import "./footer/footer";
 @import "./form-label/form-label";
 @import "./grid/grid";
 @import "./grid/grid-cell";

diff --git a/packages/react/src/Footer/Footer.tsx b/packages/react/src/Footer/Footer.tsx
@@ -12,15 +12,16 @@ import {
   PropsWithChildren,
   RefAttributes,
 } from 'react'
+import { Highlight } from '../Highlight/Highlight'
 
 export const FooterTop = forwardRef(
   (
     { children, className, ...restProps }: PropsWithChildren<HTMLAttributes<HTMLDivElement>>,
     ref: ForwardedRef<HTMLDivElement>,
   ) => (
-    <div {...restProps} ref={ref} className={clsx('amsterdam-footer__top', className)}>
+    <Highlight {...restProps} color="blue" ref={ref} className={clsx('amsterdam-footer__top', className)}>
       {children}
-    </div>
+    </Highlight>
   ),
 )
 

diff --git a/proprietary/tokens/src/components/amsterdam/footer.tokens.json b/proprietary/tokens/src/components/amsterdam/footer.tokens.json
diff --git a/storybook/storybook-react/src/Footer/Footer.stories.tsx b/storybook/storybook-react/src/Footer/Footer.stories.tsx
@@ -31,7 +31,7 @@ export const Default: Story = {
         <VisuallyHidden>
           <Heading>Colofon</Heading>
         </VisuallyHidden>
-        <Grid>
+        <Grid paddingVertical="medium">
           <Grid.Cell span={3}>
             <div style={{ display: 'grid', gap: '2.5rem' }}>
               <Heading level={2} size="level-4" inverseColor>
@@ -116,7 +116,7 @@ export const Default: Story = {
         <VisuallyHidden>
           <Heading level={2}>Over deze website</Heading>
         </VisuallyHidden>
-        <Grid>
+        <Grid paddingVertical="small">
           <Grid.Cell fullWidth>
             <PageMenu>
               <PageMenu.Link href="/">Privacy</PageMenu.Link>

diff --git a/storybook/storybook-react/src/Highlight/Highlight.stories.tsx b/storybook/storybook-react/src/Highlight/Highlight.stories.tsx
@@ -34,7 +34,7 @@ const meta = {
   },
   render: ({ color }) => (
     <Highlight color={color}>
-      <Grid>
+      <Grid paddingVertical="medium">
         <Grid.Cell fullWidth>
           <Blockquote inverseColor={!color || !['green', 'yellow'].includes(color)}>
             We kunnen in heel Nederland schoolpleinen creëren waar kinderen worden uitgedaagd om samen te spelen en te