diff --git a/_includes/layouts/component-documentation.njk b/_includes/layouts/component-documentation.njk index 213468cb..c85400f1 100644 --- a/_includes/layouts/component-documentation.njk +++ b/_includes/layouts/component-documentation.njk @@ -7,6 +7,7 @@
{% include 'partials/header.njk' %} + {% include 'partials/figma.njk' %} {% include 'partials/when-to-use.njk' %} {% include 'partials/when-not-to-use.njk' %} {% include 'partials/how-it-works-with-variations.njk' %} diff --git a/_includes/layouts/pattern-documentation.njk b/_includes/layouts/pattern-documentation.njk index 70cbf761..dcc7e427 100644 --- a/_includes/layouts/pattern-documentation.njk +++ b/_includes/layouts/pattern-documentation.njk @@ -7,6 +7,7 @@
{% include 'partials/header.njk' %} + {% include 'partials/figma.njk' %} {% include 'partials/when-to-use.njk' %} {% include 'partials/when-not-to-use.njk' %} {% include 'partials/how-it-works-with-variations.njk' %} diff --git a/docs/components/*component-documentation-template.md b/docs/components/*component-documentation-template.md index 9c1b5bc9..b1ef4bc5 100644 --- a/docs/components/*component-documentation-template.md +++ b/docs/components/*component-documentation-template.md @@ -21,6 +21,11 @@ title: #Delete this comment before entering the name of the component. # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: #Delete this comment before entering the description of the component. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/attachment.md b/docs/components/attachment.md index ddf3add5..cdd4862f 100644 --- a/docs/components/attachment.md +++ b/docs/components/attachment.md @@ -21,6 +21,11 @@ title: Attachment # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: The attachment component allows users to download documents and presents information about a document. It also allows users to request an accessible format. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/breadcrumbs.md b/docs/components/breadcrumbs.md index 35bb8ee3..269c199a 100644 --- a/docs/components/breadcrumbs.md +++ b/docs/components/breadcrumbs.md @@ -21,6 +21,11 @@ title: Breadcrumbs # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: The breadcrumbs component helps users to understand where they are within a website’s structure and move between levels by making visible the page hierarchy. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/content-list.md b/docs/components/content-list.md index 5d0ec271..3cb92e56 100644 --- a/docs/components/content-list.md +++ b/docs/components/content-list.md @@ -21,6 +21,11 @@ title: Contents list # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: The contents list provides a list of links when content is long and needs to be broken up to help users navigate it. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/feedback.md b/docs/components/feedback.md index 12a12d6f..7135b780 100644 --- a/docs/components/feedback.md +++ b/docs/components/feedback.md @@ -21,6 +21,11 @@ title: Feedback # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: The feedback component invites user feedback on the current page they are on. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/global-banner.md b/docs/components/global-banner.md index cb289292..ee19da83 100644 --- a/docs/components/global-banner.md +++ b/docs/components/global-banner.md @@ -21,6 +21,11 @@ title: Global banner # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: Used to communicate important information on throughout GOV.UK. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/print-link.md b/docs/components/print-link.md index aa0bb094..266814d8 100644 --- a/docs/components/print-link.md +++ b/docs/components/print-link.md @@ -21,6 +21,11 @@ title: Print link # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: A link with a print icon to help users print the current page. +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/components/single-page-notification-button.md b/docs/components/single-page-notification-button.md index 2a022030..42a71bf3 100644 --- a/docs/components/single-page-notification-button.md +++ b/docs/components/single-page-notification-button.md @@ -21,6 +21,11 @@ title: Single page notification button # This briefly describes what the component is. It is required to display the description on the page, and in the meta description. description: A button that subscribes the user to email notifications to a page +# Embedding the figma file of the component +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this component. + # When to use this component # Briefly describe the situation(s) when to use this component. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/patterns/*pattern-documentation-template.md b/docs/patterns/*pattern-documentation-template.md index a8d65588..edc26ae3 100644 --- a/docs/patterns/*pattern-documentation-template.md +++ b/docs/patterns/*pattern-documentation-template.md @@ -21,6 +21,11 @@ title: #Delete this comment before entering the name of the pattern. # This briefly describes what the pattern is. It is required to display the description on the page, and in the meta description. description: #Delete this comment before entering the description of the pattern. +# Embedding the figma file of the pattern +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this pattern. + # When to use this pattern # Briefly describe the situation(s) when to use this pattern. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###). diff --git a/docs/patterns/search-filter.md b/docs/patterns/search-filter.md index aa941d50..0b47a30c 100644 --- a/docs/patterns/search-filter.md +++ b/docs/patterns/search-filter.md @@ -21,6 +21,11 @@ title: Search filter # This briefly describes what the pattern is. It is required to display the description on the page, and in the meta description. description: Search filters are used to help refine search results. +# Embedding the figma file of the pattern +# This will display a Figma embed on the page. +# To add a Figma embed, copy only the URL within the embed snippet. +figmaLink: #Delete this comment before entering the Figma embed URL of the Figma representaiton of this pattern. + # When to use this pattern # Briefly describe the situation(s) when to use this pattern. # You MUST wrap this in single quotation marks (ie. ' '), since markdown can be used to enter this information. To create a heading, use three hashes (ie. ###).