diff --git a/src/components/Byline/Byline.mdx b/src/components/Byline/Byline.mdx index 0f92cf33..98f0851b 100644 --- a/src/components/Byline/Byline.mdx +++ b/src/components/Byline/Byline.mdx @@ -92,12 +92,17 @@ To hyperlink to different pages or email addresses, pass a custom function to th ```svelte { - return `mailto:${author.replace(' ', '')}@example.com`; - }} + getAuthorPage={(author) => { + return `mailto:${author.replace(' ', '')}@example.com`; + }} /> ``` diff --git a/src/components/HeroHeadline/HeroHeadline.mdx b/src/components/HeroHeadline/HeroHeadline.mdx index 2fb1dcee..07570b1e 100644 --- a/src/components/HeroHeadline/HeroHeadline.mdx +++ b/src/components/HeroHeadline/HeroHeadline.mdx @@ -273,9 +273,9 @@ Since `Headline` internally uses the [Byline](?path=/docs/components-text-elemen ]} publishTime={new Date('2023-05-11').toISOString()} img={eurovisImgSrc} - getAuthorPage={(author: string) => { - return `mailto:${author.replace(' ', '')}@example.com`; - }} + getAuthorPage={(author) => { + return `mailto:${author.replace(' ', '')}@example.com`; + }} > {#snippet hed()} diff --git a/src/components/Scroller/Scroller.mdx b/src/components/Scroller/Scroller.mdx index c6b8e498..dcb8c042 100644 --- a/src/components/Scroller/Scroller.mdx +++ b/src/components/Scroller/Scroller.mdx @@ -18,27 +18,27 @@ The `Scroller` component creates a basic scrollytelling graphic with layout opti import MyBackground from './MyBackground.svelte'; // Your own background component -// Array of step objects that define the steps in your scroller. + // Array of step objects that define the steps in your scroller. const steps = [ - { - background: MyBackground, - backgroundProps: { colour: 'red' }, // Optional props for your background component - foreground: '#### Step 1\n\nLorem ipsum red', - altText: 'Red background', - }, - { - background: MyBackground, - backgroundProps: { colour: 'blue' }, - foreground: '#### Step 2\n\nLorem ipsum blue', - altText: 'Blue background', - }, - { - background: MyBackground, - backgroundProps: { colour: 'green' }, - foreground: '#### Step 3\n\nLorem ipsum green', - altText: 'Green background', - }, - ], + { + background: MyBackground, + backgroundProps: { colour: 'red' }, // Optional props for your background component + foreground: '#### Step 1\n\nLorem ipsum red', + altText: 'Red background', + }, + { + background: MyBackground, + backgroundProps: { colour: 'blue' }, + foreground: '#### Step 2\n\nLorem ipsum blue', + altText: 'Blue background', + }, + { + background: MyBackground, + backgroundProps: { colour: 'green' }, + foreground: '#### Step 3\n\nLorem ipsum green', + altText: 'Green background', + }, + ]; diff --git a/src/components/SiteHeader/scss/_grids.scss b/src/components/SiteHeader/scss/_grids.scss index 28132641..74ed066f 100644 --- a/src/components/SiteHeader/scss/_grids.scss +++ b/src/components/SiteHeader/scss/_grids.scss @@ -93,7 +93,7 @@ @each $property in $properties { & { #{$property}: (48px * $delta); - } + } } } } diff --git a/src/components/Table/Table.mdx b/src/components/Table/Table.mdx index 1af6c21b..d5e63e84 100644 --- a/src/components/Table/Table.mdx +++ b/src/components/Table/Table.mdx @@ -27,13 +27,13 @@ Set the `title`, `dek`, `notes` and `source` options to add supporting metadata ```svelte ```