hypnagaga/src/components/SiteHeader/SiteHeader.mdx
hobbes7878 1a4f035555
docs
2025-04-20 12:22:18 +01:00

33 lines
921 B
Text

import { Meta } from '@storybook/blocks';
import * as SiteHeaderStories from './SiteHeader.stories.svelte';
<Meta of={SiteHeaderStories} />
# SiteHeader
Reuters dotcom site header, ported from [Raptor UI components](https://github.com/tr/rcom-arc_raptor-ui/tree/develop/packages/rcom-raptor-ui_common/src/components/site-header).
> **Note:** In the graphics kit, you can find this component in `pages/+page.svelte`. Customise it there for the default page.
```svelte
<script>
import { SiteHeader } from '@reuters-graphics/graphics-components';
</script>
<SiteHeader />
```
## Dark theme
Colours are customised by the [`Theme`](?path=/docs/theming-theme--default) component. ([Demo](?path=/story/components-page-furniture-siteheader--customised-theme))
```svelte
<script>
import { SiteHeader, Theme } from '@reuters-graphics/graphics-components';
</script>
<Theme base="dark">
<SiteHeader />
</Theme>
```