Fix Header in Pages stories

Amsterdam · Dec 10, 2024 · aa90d32 · aa90d32
1 parent 2ef327b
commit aa90d32
Showing 1 changed file with 22 additions and 10 deletions.
diff --git a/storybook/src/pages/amsterdam/common/AppHeader.tsx b/storybook/src/pages/amsterdam/common/AppHeader.tsx
@@ -1,13 +1,25 @@
-import { Grid, Header, PageMenu } from '@amsterdam/design-system-react'
-import { Alignment as PageMenuStory } from '../../../components/PageMenu/PageMenu.stories'
+import { Header, LinkList } from '@amsterdam/design-system-react'
 
 export const AppHeader = () => (
-  <Grid>
-    <Grid.Cell span="all">
-      <Header
-        links={<PageMenu alignEnd>{PageMenuStory.args?.children}</PageMenu>}
-        menu={<button className="ams-header__menu-button">Menu</button>}
-      />
-    </Grid.Cell>
-  </Grid>
+  <Header
+    noMenuButtonOnWideScreen
+    menuItems={[
+      <Header.MenuLink key="1" href="#" lang="en">
+        English
+      </Header.MenuLink>,
+      <Header.MenuLink key="2" href="#">
+        Mijn Amsterdam
+      </Header.MenuLink>,
+      <Header.MenuLink key="3" href="#" fixed>
+        Zoeken
+      </Header.MenuLink>,
+    ]}
+  >
+    <LinkList className="ams-mb--lg">
+      <LinkList.Link href="#" lang="en">
+        English
+      </LinkList.Link>
+      <LinkList.Link href="#">Mijn Amsterdam</LinkList.Link>
+    </LinkList>
+  </Header>
 )