From 932d85b144be762d25a34ba7abad4b9eccd8ccbd Mon Sep 17 00:00:00 2001 From: chong_lu_khei Date: Tue, 16 Jun 2026 23:07:52 +0800 Subject: [PATCH 1/3] fix(*): every page must have a main content region --- docs/.vitepress/theme/Layout.vue | 4 ++-- docs/.vitepress/theme/layouts/BareLayout.vue | 4 +++- docs/.vitepress/theme/layouts/PreviewLayout.vue | 4 ++-- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/docs/.vitepress/theme/Layout.vue b/docs/.vitepress/theme/Layout.vue index 12417dec..06fc6ad7 100644 --- a/docs/.vitepress/theme/Layout.vue +++ b/docs/.vitepress/theme/Layout.vue @@ -17,11 +17,11 @@ const { frontmatter } = useData() diff --git a/docs/.vitepress/theme/layouts/BareLayout.vue b/docs/.vitepress/theme/layouts/BareLayout.vue index 43d5d19c..20b00d3e 100644 --- a/docs/.vitepress/theme/layouts/BareLayout.vue +++ b/docs/.vitepress/theme/layouts/BareLayout.vue @@ -3,7 +3,9 @@ import { Content } from "vitepress"; diff --git a/docs/.vitepress/components/components/TemplateRaw.vue b/docs/.vitepress/components/components/TemplateRaw.vue deleted file mode 100644 index 65e4acef..00000000 --- a/docs/.vitepress/components/components/TemplateRaw.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - - diff --git a/docs/.vitepress/data/block-markup.ts b/docs/.vitepress/data/block-markup.ts deleted file mode 100644 index b36251dc..00000000 --- a/docs/.vitepress/data/block-markup.ts +++ /dev/null @@ -1,3322 +0,0 @@ -// Block markup pulled from -// https://github.com/GovTechSG/sgds-web-component/tree/master/stories/blocks -// -// Each export is the HTML body of one .stories.js file with the lit html -// wrapper, ${} interpolations, and any inline lit binding stripped. Block -// doc pages reference these constants via the demos[] array. - -// ============================================================ -// cards -// ============================================================ - -export const cardsCards3Markup = ` -
-
- -
-
- Programmes -
-

- Featured Programmes -

-

- Explore our curated selection of programmes designed to strengthen digital capabilities across the public - sector. -

-
- - -
- -
- - Keynote - Digital Infrastructure for the Next Decade - An overview of Singapore's plans for resilient and future-ready digital infrastructure. - View details - -
- -
- - Panel Discussion - AI Governance in the Public Sector - Panellists explore responsible AI adoption frameworks and inter-agency collaboration. - View details - -
- -
- - Presentation - Zero-Trust Architecture for Government Systems - A deep dive into implementing zero-trust principles across legacy and modern systems. - View details - -
- - -
- - Keynote - Securing the Cloud: Lessons from the Field - Key takeaways from real-world cloud migration projects across the Singapore government. - View details - -
- -
- - Presentation - Incident Response Playbooks for CISOs - Practical frameworks for building effective incident response and recovery strategies. - View details - -
- -
- - Panel Discussion - Workforce Upskilling for Cyber Resilience - How agencies are building cyber talent pipelines and fostering a security-aware culture. - View details - -
- - -
- - Opening Address - Building a Resilient Digital Government - An opening address on Singapore's whole-of-government approach to digital resilience. - View details - -
- -
- - Keynote - The Future of GovTech: People, Process and Platform - How people-centred design and agile delivery are shaping the next wave of government technology. - View details - -
- -
- - Presentation - Automating Compliance Monitoring with AI - Using machine learning to continuously monitor systems for policy and regulatory compliance. - View details - -
-
-
-
`; - -export const cardsCards4Markup = ` -
-
- -
-
- Programmes -
-

- Featured Programmes -

-

- Explore our curated selection of programmes designed to strengthen digital capabilities across the public - sector. -

-
- - -
- -
- - Keynote - Digital Infrastructure for the Next Decade - An overview of Singapore's plans for resilient and future-ready digital infrastructure. - View details - -
- -
- - Panel Discussion - AI Governance in the Public Sector - Panellists explore responsible AI adoption frameworks and inter-agency collaboration. - View details - -
- -
- - Presentation - Zero-Trust Architecture for Government Systems - A deep dive into implementing zero-trust principles across legacy and modern systems. - View details - -
- -
- - Keynote - Securing the Cloud: Lessons from the Field - Key takeaways from real-world cloud migration projects across the Singapore government. - View details - -
- - -
- - Presentation - Incident Response Playbooks for CISOs - Practical frameworks for building effective incident response and recovery strategies. - View details - -
- -
- - Panel Discussion - Workforce Upskilling for Cyber Resilience - How agencies are building cyber talent pipelines and fostering a security-aware culture. - View details - -
- -
- - Opening Address - Building a Resilient Digital Government - An opening address on Singapore's whole-of-government approach to digital resilience. - View details - -
- -
- - Keynote - The Future of GovTech: People, Process and Platform - How people-centred design and agile delivery are shaping the next wave of government technology. - View details - -
- - -
- - Presentation - Automating Compliance Monitoring with AI - Using machine learning to continuously monitor systems for policy and regulatory compliance. - View details - -
- -
- - Keynote - Cybersecurity as a National Imperative - Why cybersecurity investment is central to Singapore's long-term digital sovereignty strategy. - View details - -
- -
- - Panel Discussion - Data Sharing Across Agencies: Challenges and Solutions - Governance models and technical standards enabling safe cross-agency data sharing. - View details - -
- -
- - Presentation - Identity and Access Management at Scale - Strategies for managing digital identities across thousands of government users securely. - View details - -
-
-
-
`; - -// ============================================================ -// cta -// ============================================================ - -export const ctaContainedPrimaryCenterMarkup = `
-
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
-
`; - -export const ctaContainedPrimaryMarkup = `
-
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
-
`; - -export const ctaContainedRaisedCenterMarkup = `
-
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
-
`; - -export const ctaContainedRaisedMarkup = `
-
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
-
`; - -export const ctaFullbleedAlternateCenterMarkup = `
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
`; - -export const ctaFullbleedAlternateMarkup = `
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
`; - -export const ctaFullbleedPrimaryCenterMarkup = `
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
`; - -export const ctaFullbleedPrimaryMarkup = `
-
-
-
-
- Overline -
-

- Headline -

-
- Description -
-
- Button Label -
-
-
`; - -// ============================================================ -// feature -// ============================================================ - -export const featureFeature48ImgLeftMarkup = ` - - -
-
-
- -
- -
- - -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
-
-
-
`; - -export const featureFeature48ImgRightMarkup = ` - - -
-
-
- -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
- - -
- -
-
-
-
`; - -export const featureFeature66ComponentLeftMarkup = ` -
-
-
- -
- - -
Why choose us
-
- We deliver fast, reliable, and accessible digital services built to government standards. -
-
- -
How it works
-
- Sign up, verify your identity, and access all your services from a single dashboard. -
-
- -
Who can use this
-
- Any Singapore resident or business with a valid Singpass account can get started. -
-
-
-
- - -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
-
-
-
`; - -export const featureFeature66ComponentRightMarkup = ` -
-
-
- -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
- - -
- - -
Why choose us
-
- We deliver fast, reliable, and accessible digital services built to government standards. -
-
- -
How it works
-
- Sign up, verify your identity, and access all your services from a single dashboard. -
-
- -
Who can use this
-
- Any Singapore resident or business with a valid Singpass account can get started. -
-
-
-
-
-
-
`; - -export const featureFeature66ImgLeftMarkup = ` - - -
-
-
- -
- -
- - -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
-
-
-
`; - -export const featureFeature66ImgRightMarkup = ` - - -
-
-
- -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
- - -
- -
-
-
-
`; - -export const featureFeature84ImgLeftMarkup = ` - - -
-
-
- -
- -
- - -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
-
-
-
`; - -export const featureFeature84ImgRightMarkup = ` - - -
-
-
- -
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
- - -
- -
-
-
-
`; - -export const featureFeatureCardsBelowMarkup = ` -
-
-
- -
-
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
- - -
-
- - FEATURE - Card Title One - Supporting description text that explains what this feature offers to the user. - - Learn more - - -
- -
- - FEATURE - Card Title Two - Supporting description text that explains what this feature offers to the user. - - Learn more - - -
- -
- - FEATURE - Card Title Three - Supporting description text that explains what this feature offers to the user. - - Learn more - - -
-
-
-
-
`; - -export const featureFeatureNoImgCenterMarkup = ` -
-
-
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
-
-
`; - -export const featureFeatureNoImgLeftMarkup = ` -
-
-
- -
-
- Overline Label -
-

- Feature Heading Goes Here -

-
- Supporting subtitle text that provides context and detail for the feature being described. -
-
- Get Started -
-
-
`; - -// ============================================================ -// filter -// ============================================================ - -export const filterFilterMarkup = `
-
- - -
-
`; - -// ============================================================ -// form -// ============================================================ - -export const formAllTypesMarkup = `
-
-
-
-
-
- Basic Info -
-
-
- -
-
- -
-
-
-
- - Singapore - Malaysia - -
-
- -
-
-
-
- -
-
- - Event 1 - Event 2 - -
-
-
-
-
- Preferences -
-
- -
-
- - Pickup - Delivery - Courier - -
-
- - Service 1 - Service 2 - Service 3 - -
-
- - Technology - Design - Business - -
-
- Choose files -
-
-
- Reset - Submit -
-
-
-
-
`; - -export const formBasicCenterMarkup = `
-
-
-
-
-
- Personal Information -
-
- -
-
- -
-
- -
-
- -
-
- -
-
-
-
- Preferences -
-
- - Email - SMS - Phone - -
-
- - Technology - Business - Design - Marketing - -
-
-
- Cancel - Submit -
-
-
-
-
`; - -export const formBasicLeftMarkup = `
-
-
-
-
-
- Contact Information -
-
- -
-
- -
-
- -
-
- -
-
-
- Cancel - Submit -
-
-
-
-
`; - -export const formBasicRightMarkup = ` -
-
-
-
-
-
- Personal Information -
-
- -
-
- -
-
- -
-
- -
-
- -
-
-
-
- Preferences -
-
- - Email - SMS - Phone - -
-
- - Technology - Business - Design - Marketing - -
-
-
- Cancel - Submit -
-
-
-
-
`; - -export const formFormFieldsCheckboxMarkup = `
-
-
-
-
-
- Preferences -
-
-
- -
-
- -
-
-
- - Technology - Business - Design - Marketing - -
-
- - Email - SMS - Phone - Push Notifications - -
-
-
- Reset - Save Preferences -
-
-
-
-
`; - -export const formFormFieldsDatesQuantitiesMarkup = `
-
-
-
-
-
- Event Booking -
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
- Reset - Book Event -
-
-
-
-
`; - -export const formFormFieldsFileUploadMarkup = `
-
-
-
-
-
- Document Submission -
-
-
- -
-
- -
-
-
- Choose files -
-
- Choose files -
-
- Choose files -
-
-
- Reset - Upload Documents -
-
-
-
-
`; - -export const formFormFieldsRadioMarkup = `
-
-
-
-
-
- Survey -
-
-
- -
-
- -
-
-
- - Very satisfied - Satisfied - Neutral - Dissatisfied - -
-
- - Very likely - Likely - Unlikely - -
-
-
- Reset - Submit Survey -
-
-
-
-
`; - -export const formFormFieldsSelectsMarkup = `
-
-
-
-
-
- Product Selection -
-
-
- - Electronics - Furniture - Clothing - -
-
- - Brand A - Brand B - Brand C - -
-
-
- - Supplier 1 - Supplier 2 - Supplier 3 - -
-
- - Feature 1 - Feature 2 - Feature 3 - Feature 4 - -
-
-
- Reset - Search -
-
-
-
-
`; - -export const formFormFieldsTextareaMarkup = `
-
-
-
-
-
- Contact Us -
-
-
- -
-
- -
-
-
- -
-
- -
-
-
- Clear - Send Message -
-
-
-
-
`; - -export const formFormMultistepStepperMarkup = `
-
-
-
- - - - -
-
- Personal Information -
- -
-
- -
-
- -
-
- -
- -
- -
- -
-
- - - - - - - - -
- -
- Cancel - Next - -
-
-
-
-
-
`; - -export const formFullwidthOnlyMarkup = `
-
-
-
-
-
- All Full-Width -
-
- -
-
- - Category A - Category B - Category C - -
-
- - Option 1 - Option 2 - Option 3 - -
-
- -
-
-
- Reset - Submit -
-
-
-
-
`; - -export const formPairedOnlyMarkup = `
-
-
-
-
-
- All Paired Fields -
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
- Reset - Submit -
-
-
-
-
`; - -export const formSectionsSingleMarkup = `
-
-
-
-
-
- Quick Form -
-
-
- -
-
- -
-
-
- -
-
-
- Cancel - Send -
-
-
-
-
`; - -export const formSectionsThreeMarkup = `
-
-
-
-
-
- Personal Information -
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
-
- Address -
-
- -
-
-
- -
-
- - Singapore - Malaysia - -
-
-
-
-
- Preferences -
-
- - Technology - Design - Business - -
-
- - Email - Push - -
-
- - Daily - Weekly - Monthly - -
-
-
- Reset - Complete Registration -
-
-
-
-
`; - -export const formSectionsTwoMarkup = `
-
-
-
-
-
- Personal Details -
-
-
- -
-
- -
-
-
- -
-
-
-
- Contact Preferences -
-
- - Email - Phone - SMS - -
-
-
- -
-
- -
-
-
-
- Reset - Save -
-
-
-
-
`; - -// ============================================================ -// header -// ============================================================ - -export const headerPageHeaderBreadcrumbMarkup = ` -
-
-
- - - Home - Section - Current Page - - - -
-
- Overline Label -
- -

- Page Heading Goes Here -

- -

- Supporting body text that provides context and detail for the page or section above. -

-
-
-
-
`; - -export const headerPageHeaderMarkup = ` -
-
-
-
- Overline Label -
- -

- Page Heading Goes Here -

- -

- Supporting body text that provides context and detail for the page or section above. -

-
-
-
`; - -// ============================================================ -// hero -// ============================================================ - -export const heroHeroBgImageLightMarkup = ` -
- -
- - -
-
-
- -
- -
- Singapore Government Digital Services -
- - -

- One Platform. Simpler Living. -

- - -

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
- - - - Get Started -
- -
- -
- -
`; - -export const heroHeroBgImageMarkup = ` -
- -
- - -
-
-
- -
- -
- Singapore Government Digital Services -
- - -

- One Platform. Simpler Living. -

- - -

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
- - - - Get Started -
- -
- -
- -
`; - -export const heroHeroCenterMarkup = ` -
- -
- -
- -
- -
- Singapore Government Digital Services -
- - -

- One Platform. Simpler Living. -

- - -

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
- - - - Get Started -
-
- -
`; - -export const heroHeroFullbleedMarkup = ` -
- -
- Government digital services -
- - -
-
-
- -
- -
- Singapore Government Digital Services -
- - -

- One Platform. Simpler Living. -

- - -

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
- - - - Get Started -
- -
- -
- -
`; - -export const heroHeroImageMarkup = ` -
- -
- -
- -
- -
- -
- Singapore Government Digital Services -
- - -

- One Platform. Simpler Living. -

- - -

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
- - - - Get Started -
- - - -
- Government digital services -
- -
- -
- -
`; - -export const heroHeroMarkup = ` -
- -
- -
- -
- -
- Singapore Government Digital Services -
- - -

- One Platform. Simpler Living. -

- - -

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
- - - - Get Started -
-
- -
`; - -// ============================================================ -// stats -// ============================================================ - -export const statsStats3Markup = ` - - -
-
-
- -
-
- By the Numbers -
-

- Impact at a Glance -

-

- Key metrics measured over the past 12 months across all participating agencies. -

-
- - -
-
-
- 2.4M -
-
- Active Users -
-

- Residents actively using the platform each month to access government services. -

-
- -
-
- 400+ -
-
- Government Services -
-

- Integrated services from agencies across the public sector available in one place. -

-
- -
-
- 99.9% -
-
- Platform Uptime -
-

- Consistently high availability ensuring residents can access services anytime. -

-
-
-
-
-
`; - -export const statsStats4Markup = ` - - -
-
-
- -
-
- By the Numbers -
-

- Impact at a Glance -

-

- Key metrics measured over the past 12 months across all participating agencies. -

-
- - -
-
-
- 2.4M -
-
- Active Users -
-

- Residents actively using the platform to access government services each month. -

-
- -
-
- 400+ -
-
- Government Services -
-

- Integrated services from agencies across the public sector in one place. -

-
- -
-
- 99.9% -
-
- Platform Uptime -
-

- Consistently high availability so residents can access services anytime. -

-
- -
-
- 16 -
-
- Partner Agencies -
-

- Public agencies contributing services and data to the shared platform. -

-
-
-
-
-
`; - -export const statsStats5Markup = ` - - -
-
-
- -
-
- By the Numbers -
-

- Impact at a Glance -

-

- Key metrics measured over the past 12 months across all participating agencies. -

-
- - -
-
-
- 2.4M -
-
- Active Users -
-

- Residents using the platform to access services each month. -

-
- -
-
- 400+ -
-
- Government Services -
-

- Integrated services from agencies across the public sector. -

-
- -
-
- 99.9% -
-
- Platform Uptime -
-

- High availability so residents can access services anytime. -

-
- -
-
- 16 -
-
- Partner Agencies -
-

- Public agencies contributing services and data to the platform. -

-
- -
-
- 4.8 -
-
- Satisfaction Score -
-

- Average rating out of 5 from post-task surveys collected in-app. -

-
-
-
-
-
`; - -export const statsStatsRight6Markup = ` - - -
-
-
- -
-
- By the Numbers -
-

- Impact at a Glance -

-

- Key metrics measured over the past 12 months across all participating agencies. -

-
- - -
-
-
-
- 2.4M -
-
- Active Users -
-

- Residents using the platform each month. -

-
- -
-
- 400+ -
-
- Government Services -
-

- Integrated services across the public sector. -

-
- -
-
- 99.9% -
-
- Platform Uptime -
-

- High availability ensuring residents can access services anytime. -

-
- -
-
- 16 -
-
- Partner Agencies -
-

- Public agencies contributing services and data. -

-
-
-
-
-
-
`; - -export const statsStatsRight8Markup = ` - - -
-
-
- -
-
- By the Numbers -
-

- Impact at a Glance -

-

- Key metrics measured over the past 12 months across all participating agencies. -

-
- - -
-
-
-
- 2.4M -
-
- Active Users -
-

- Residents actively using the platform to access government services each month. -

-
- -
-
- 400+ -
-
- Government Services -
-

- Integrated services from agencies across the public sector. -

-
- -
-
- 99.9% -
-
- Platform Uptime -
-

- Consistently high availability so residents can access services anytime. -

-
- -
-
- 16 -
-
- Partner Agencies -
-

- Public agencies contributing services and data to the shared platform. -

-
-
-
-
-
-
`; diff --git a/docs/.vitepress/data/pattern-docs.ts b/docs/.vitepress/data/pattern-docs.ts index 33134bf6..6ef6bd90 100644 --- a/docs/.vitepress/data/pattern-docs.ts +++ b/docs/.vitepress/data/pattern-docs.ts @@ -1,66 +1,4 @@ import type { ResolvedComponentDoc } from "./component-docs"; -import { - aboutUsMarkup, - applicationManagementMarkup, - blogMarkup, - catalogueMarkup, - formPageMarkup, - landingMarkup, - multiStepFormPageMarkup, -} from "./template-markup"; -import { - cardsCards3Markup, - cardsCards4Markup, - ctaContainedPrimaryMarkup, - ctaContainedPrimaryCenterMarkup, - ctaContainedRaisedMarkup, - ctaContainedRaisedCenterMarkup, - ctaFullbleedPrimaryMarkup, - ctaFullbleedPrimaryCenterMarkup, - ctaFullbleedAlternateMarkup, - ctaFullbleedAlternateCenterMarkup, - featureFeature48ImgLeftMarkup, - featureFeature48ImgRightMarkup, - featureFeature66ComponentLeftMarkup, - featureFeature66ComponentRightMarkup, - featureFeature66ImgLeftMarkup, - featureFeature66ImgRightMarkup, - featureFeature84ImgLeftMarkup, - featureFeature84ImgRightMarkup, - featureFeatureCardsBelowMarkup, - featureFeatureNoImgCenterMarkup, - featureFeatureNoImgLeftMarkup, - filterFilterMarkup, - formAllTypesMarkup, - formBasicCenterMarkup, - formBasicLeftMarkup, - formBasicRightMarkup, - formFormFieldsCheckboxMarkup, - formFormFieldsDatesQuantitiesMarkup, - formFormFieldsFileUploadMarkup, - formFormFieldsRadioMarkup, - formFormFieldsSelectsMarkup, - formFormFieldsTextareaMarkup, - formFormMultistepStepperMarkup, - formFullwidthOnlyMarkup, - formPairedOnlyMarkup, - formSectionsSingleMarkup, - formSectionsThreeMarkup, - formSectionsTwoMarkup, - headerPageHeaderMarkup, - headerPageHeaderBreadcrumbMarkup, - heroHeroMarkup, - heroHeroCenterMarkup, - heroHeroFullbleedMarkup, - heroHeroImageMarkup, - heroHeroBgImageMarkup, - heroHeroBgImageLightMarkup, - statsStats3Markup, - statsStats4Markup, - statsStats5Markup, - statsStatsRight6Markup, - statsStatsRight8Markup, -} from "./block-markup"; export type PatternGroup = "page templates" | "block templates"; @@ -73,7 +11,6 @@ export type TemplateOverviewItem = { group: PatternGroup; groupLabel: string; demoCount: number; - usedComponents: string[]; }; export type TemplateOverviewGroup = { @@ -86,7 +23,6 @@ export type TemplateOverviewGroup = { export type PatternDemo = { title: string; description: string; - markup: string; }; type UsageGuidance = { @@ -98,7 +34,6 @@ type UsageGuidance = { type PatternDoc = { title: string; group: PatternGroup; - usedComponents: string[]; whenToUse: string[]; whenNotToUse?: string[]; demos: PatternDemo[]; @@ -110,8 +45,6 @@ type PatternDoc = { type BlockVariantDocInput = { title: string; categoryLabel: string; - markup: string; - usedComponents: string[]; description: string; whenToUse: string; whenNotToUse?: string; @@ -120,8 +53,6 @@ type BlockVariantDocInput = { const createBlockVariantDoc = ({ title, categoryLabel, - markup, - usedComponents, description, whenToUse, whenNotToUse, @@ -129,26 +60,11 @@ const createBlockVariantDoc = ({ title, group: "block templates", categoryLabel, - usedComponents, whenToUse: [whenToUse], whenNotToUse: whenNotToUse ? [whenNotToUse] : undefined, - demos: [{ title, description, markup }], + demos: [{ title, description }], }); -const formBlockComponents = [ - "sgds-input", - "sgds-textarea", - "sgds-select", - "sgds-checkbox", - "sgds-checkbox-group", - "sgds-radio", - "sgds-radio-group", - "sgds-datepicker", - "sgds-quantity-toggle", - "sgds-file-upload", - "sgds-stepper", - "sgds-button", -]; export const blockTemplateCategoryOrder: string[] = [ "Cards", @@ -237,434 +153,341 @@ const formBlockVariantDocs: Record = { title: "All types", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When you need a complete reference form that shows the available SGDS field types together."], whenNotToUse: ["When a page needs a focused form with only the fields required for the task."], - demos: [{ title: "All types", description: "Demonstration form showing every supported field type in one layout.", markup: formAllTypesMarkup }], + demos: [{ title: "All types", description: "Demonstration form showing every supported field type in one layout." }], }, "form-basic-center": { title: "Basic center", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["For short, single-section forms that should sit prominently in the centre of the page."], whenNotToUse: ["For long forms or forms that need supporting content beside the fields."], - demos: [{ title: "Basic center", description: "Single-section form centered on the page.", markup: formBasicCenterMarkup }], + demos: [{ title: "Basic center", description: "Single-section form centered on the page." }], }, "form-basic-left": { title: "Basic left", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["For simple forms that should align with the page container and reading flow."], whenNotToUse: ["When the form needs strong standalone emphasis in the centre of the page."], - demos: [{ title: "Basic left", description: "Single-section form, content left-aligned within the page container.", markup: formBasicLeftMarkup }], + demos: [{ title: "Basic left", description: "Single-section form, content left-aligned within the page container." }], }, "form-basic-right": { title: "Basic right", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["For layouts where the form sits beside explanatory content or supporting media."], whenNotToUse: ["When the form is the only major content on the page."], - demos: [{ title: "Basic right", description: "Single-section form right-aligned.", markup: formBasicRightMarkup }], + demos: [{ title: "Basic right", description: "Single-section form right-aligned." }], }, "form-fields-checkbox": { title: "Form fields checkbox", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When users can select one or more options from a visible set."], whenNotToUse: ["When the user must choose exactly one option — use radio fields instead."], - demos: [{ title: "Form fields checkbox", description: "Checkbox and checkbox-group examples, including grouped options.", markup: formFormFieldsCheckboxMarkup }], + demos: [{ title: "Form fields checkbox", description: "Checkbox and checkbox-group examples, including grouped options." }], }, "form-fields-dates-quantities": { title: "Form fields dates quantities", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When a form needs date or quantity controls with SGDS field styling."], whenNotToUse: ["When plain text entry would be clearer than a specialised control."], - demos: [{ title: "Form fields dates quantities", description: "Datepicker and quantity-toggle field examples.", markup: formFormFieldsDatesQuantitiesMarkup }], + demos: [{ title: "Form fields dates quantities", description: "Datepicker and quantity-toggle field examples." }], }, "form-fields-file-upload": { title: "Form fields file upload", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When users need to attach files or supporting documents to a form."], whenNotToUse: ["When uploaded files are not required to complete the user task."], - demos: [{ title: "Form fields file upload", description: "File upload field examples with drop zone and validation.", markup: formFormFieldsFileUploadMarkup }], + demos: [{ title: "Form fields file upload", description: "File upload field examples with drop zone and validation." }], }, "form-fields-radio": { title: "Form fields radio", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When users must choose exactly one option from a visible set."], whenNotToUse: ["When users can choose multiple options — use checkboxes instead."], - demos: [{ title: "Form fields radio", description: "Radio and radio-group examples.", markup: formFormFieldsRadioMarkup }], + demos: [{ title: "Form fields radio", description: "Radio and radio-group examples." }], }, "form-fields-selects": { title: "Form fields selects", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When users choose from a longer list of predefined options."], whenNotToUse: ["When there are only a few options that should stay visible — use radio fields instead."], - demos: [{ title: "Form fields selects", description: "Select examples for single-value list inputs.", markup: formFormFieldsSelectsMarkup }], + demos: [{ title: "Form fields selects", description: "Select examples for single-value list inputs." }], }, "form-fields-textarea": { title: "Form fields textarea", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When users need to enter longer free-text responses."], whenNotToUse: ["When the response should be short and structured — use an input instead."], - demos: [{ title: "Form fields textarea", description: "Textarea examples with hint and validation.", markup: formFormFieldsTextareaMarkup }], + demos: [{ title: "Form fields textarea", description: "Textarea examples with hint and validation." }], }, "form-multi-step": { title: "Form multi-step", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["For transactional forms that are easier to complete as a step-by-step flow."], whenNotToUse: ["For short forms that fit comfortably on one page."], - demos: [{ title: "Form multi-step", description: "Stepper-driven form for transactional flows.", markup: formFormMultistepStepperMarkup }], + demos: [{ title: "Form multi-step", description: "Stepper-driven form for transactional flows." }], }, "form-full-width-only": { title: "Full-width only", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When every field needs the full form width for readability."], whenNotToUse: ["When related short fields can be paired to reduce scanning distance."], - demos: [{ title: "Full-width only", description: "Layout where every field spans the form's full width.", markup: formFullwidthOnlyMarkup }], + demos: [{ title: "Full-width only", description: "Layout where every field spans the form's full width." }], }, "form-paired-only": { title: "Paired only", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When related short fields work better side-by-side on wider viewports."], whenNotToUse: ["When fields need long labels, hints, or validation messages."], - demos: [{ title: "Paired only", description: "Layout pairing fields side-by-side on wider viewports.", markup: formPairedOnlyMarkup }], + demos: [{ title: "Paired only", description: "Layout pairing fields side-by-side on wider viewports." }], }, "form-sections-single": { title: "Sections single", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When a form has one clear group of related fields."], whenNotToUse: ["When fields belong to multiple topics that need separate headings."], - demos: [{ title: "Sections single", description: "One labelled section grouping related fields.", markup: formSectionsSingleMarkup }], + demos: [{ title: "Sections single", description: "One labelled section grouping related fields." }], }, "form-sections-three": { title: "Sections three", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["For longer forms that need three labelled sections to make scanning easier."], whenNotToUse: ["When one or two sections are enough to describe the task."], - demos: [{ title: "Sections three", description: "Three labelled sections — use for longer forms.", markup: formSectionsThreeMarkup }], + demos: [{ title: "Sections three", description: "Three labelled sections — use for longer forms." }], }, "form-sections-two": { title: "Sections two", group: "block templates", categoryLabel: "Form", - usedComponents: formBlockComponents, whenToUse: ["When a form has two clear groups of related fields."], whenNotToUse: ["When every field belongs to the same topic."], - demos: [{ title: "Sections two", description: "Two labelled sections separated by spacing.", markup: formSectionsTwoMarkup }], + demos: [{ title: "Sections two", description: "Two labelled sections separated by spacing." }], }, }; -const cardsBlockComponents = ["sgds-card", "sgds-badge", "sgds-link", "sgds-icon"]; -const ctaBlockComponents = ["sgds-button"]; -const featureBlockComponents = ["sgds-button", "sgds-card", "sgds-icon"]; -const filterBlockComponents = ["sgds-checkbox", "sgds-checkbox-group", "sgds-link"]; -const headerBlockComponents = ["sgds-breadcrumb", "sgds-button", "sgds-icon"]; -const heroBlockComponents = ["sgds-button", "sgds-icon"]; -const statsBlockComponents = ["sgds-icon"]; const blockVariantDocs: Record = { "cards-3-per-column": createBlockVariantDoc({ title: "3 per column", categoryLabel: "Cards", - markup: cardsCards3Markup, - usedComponents: cardsBlockComponents, description: "3-column card grid with section header and linked cards.", whenToUse: "When users need to scan a medium-sized set of cards in rows of three.", }), "cards-4-per-column": createBlockVariantDoc({ title: "4 per column", categoryLabel: "Cards", - markup: cardsCards4Markup, - usedComponents: cardsBlockComponents, description: "4-column card grid for denser browsing layouts on wider viewports.", whenToUse: "When users need to scan a larger set of cards with less vertical scrolling.", }), "cta-contained-primary-center": createBlockVariantDoc({ title: "Contained primary center", categoryLabel: "Call to action", - markup: ctaContainedPrimaryCenterMarkup, - usedComponents: ctaBlockComponents, description: "Contained CTA on a primary surface with centered content.", whenToUse: "When a primary action needs strong emphasis inside the page container.", }), "cta-contained-primary": createBlockVariantDoc({ title: "Contained primary", categoryLabel: "Call to action", - markup: ctaContainedPrimaryMarkup, - usedComponents: ctaBlockComponents, description: "Contained CTA on a primary surface with left-aligned content.", whenToUse: "When a primary action should sit within the normal page reading flow.", }), "cta-contained-raised-center": createBlockVariantDoc({ title: "Contained raised center", categoryLabel: "Call to action", - markup: ctaContainedRaisedCenterMarkup, - usedComponents: ctaBlockComponents, description: "Contained CTA on a raised surface with centered content.", whenToUse: "When a CTA needs moderate emphasis without using the primary surface.", }), "cta-contained-raised": createBlockVariantDoc({ title: "Contained raised", categoryLabel: "Call to action", - markup: ctaContainedRaisedMarkup, - usedComponents: ctaBlockComponents, description: "Contained CTA on a raised surface with left-aligned content.", whenToUse: "When a CTA should support a content section without dominating it.", }), "cta-full-bleed-alternate-center": createBlockVariantDoc({ title: "Full bleed alternate center", categoryLabel: "Call to action", - markup: ctaFullbleedAlternateCenterMarkup, - usedComponents: ctaBlockComponents, description: "Full-bleed alternate CTA with centered content.", whenToUse: "When a lower-emphasis CTA should span the full viewport width.", }), "cta-full-bleed-alternate": createBlockVariantDoc({ title: "Full bleed alternate", categoryLabel: "Call to action", - markup: ctaFullbleedAlternateMarkup, - usedComponents: ctaBlockComponents, description: "Full-bleed alternate CTA with left-aligned content.", whenToUse: "When a full-width CTA should read as a continuation of the page content.", }), "cta-full-bleed-primary-center": createBlockVariantDoc({ title: "Full bleed primary center", categoryLabel: "Call to action", - markup: ctaFullbleedPrimaryCenterMarkup, - usedComponents: ctaBlockComponents, description: "Full-bleed primary CTA with centered content.", whenToUse: "When the primary action should become a major page moment.", }), "cta-full-bleed-primary": createBlockVariantDoc({ title: "Full bleed primary", categoryLabel: "Call to action", - markup: ctaFullbleedPrimaryMarkup, - usedComponents: ctaBlockComponents, description: "Full-bleed primary CTA with left-aligned content.", whenToUse: "When the primary action should span the full viewport while following the page reading flow.", }), "feature-image-left-4-8": createBlockVariantDoc({ title: "Image left 4:8", categoryLabel: "Feature", - markup: featureFeature48ImgLeftMarkup, - usedComponents: featureBlockComponents, description: "Feature section with image in 4 columns and content in 8 columns.", whenToUse: "When supporting imagery should introduce a wider content area.", }), "feature-image-right-4-8": createBlockVariantDoc({ title: "Image right 4:8", categoryLabel: "Feature", - markup: featureFeature48ImgRightMarkup, - usedComponents: featureBlockComponents, description: "Feature section with content in 8 columns and image in 4 columns.", whenToUse: "When content should lead and supporting imagery should sit to the right.", }), "feature-component-left-6-6": createBlockVariantDoc({ title: "Component left 6:6", categoryLabel: "Feature", - markup: featureFeature66ComponentLeftMarkup, - usedComponents: featureBlockComponents, description: "Balanced feature section with an SGDS component on the left.", whenToUse: "When a live component example should sit beside explanatory content.", }), "feature-component-right-6-6": createBlockVariantDoc({ title: "Component right 6:6", categoryLabel: "Feature", - markup: featureFeature66ComponentRightMarkup, - usedComponents: featureBlockComponents, description: "Balanced feature section with an SGDS component on the right.", whenToUse: "When explanatory content should lead into a component example.", }), "feature-image-left-6-6": createBlockVariantDoc({ title: "Image left 6:6", categoryLabel: "Feature", - markup: featureFeature66ImgLeftMarkup, - usedComponents: featureBlockComponents, description: "Balanced feature section with image on the left.", whenToUse: "When image and content need equal visual weight.", }), "feature-image-right-6-6": createBlockVariantDoc({ title: "Image right 6:6", categoryLabel: "Feature", - markup: featureFeature66ImgRightMarkup, - usedComponents: featureBlockComponents, description: "Balanced feature section with image on the right.", whenToUse: "When content and image need equal visual weight with content first.", }), "feature-image-left-8-4": createBlockVariantDoc({ title: "Image left 8:4", categoryLabel: "Feature", - markup: featureFeature84ImgLeftMarkup, - usedComponents: featureBlockComponents, description: "Feature section with dominant image on the left.", whenToUse: "When imagery should carry most of the visual weight.", }), "feature-image-right-8-4": createBlockVariantDoc({ title: "Image right 8:4", categoryLabel: "Feature", - markup: featureFeature84ImgRightMarkup, - usedComponents: featureBlockComponents, description: "Feature section with dominant image on the right.", whenToUse: "When content should introduce a visually dominant image.", }), "feature-cards-below": createBlockVariantDoc({ title: "Cards below", categoryLabel: "Feature", - markup: featureFeatureCardsBelowMarkup, - usedComponents: featureBlockComponents, description: "Feature section with supporting cards below the heading content.", whenToUse: "When a feature needs supporting points or benefits beneath the main message.", }), "feature-no-image-center": createBlockVariantDoc({ title: "No image center", categoryLabel: "Feature", - markup: featureFeatureNoImgCenterMarkup, - usedComponents: featureBlockComponents, description: "Centered feature section without imagery.", whenToUse: "When the message should stand alone without a visual asset.", }), "feature-no-image-left": createBlockVariantDoc({ title: "No image left", categoryLabel: "Feature", - markup: featureFeatureNoImgLeftMarkup, - usedComponents: featureBlockComponents, description: "Left-aligned feature section without imagery.", whenToUse: "When the message should stay aligned with the surrounding content flow.", }), "filter-checkboxes": createBlockVariantDoc({ title: "Filter checkboxes", categoryLabel: "Filter", - markup: filterFilterMarkup, - usedComponents: filterBlockComponents, description: "Faceted filter panel with grouped checkbox controls.", whenToUse: "When users need to narrow search, catalogue, or list results with multiple facets.", }), "header-page-header-with-breadcrumb": createBlockVariantDoc({ title: "Page header with breadcrumb", categoryLabel: "Header", - markup: headerPageHeaderBreadcrumbMarkup, - usedComponents: headerBlockComponents, description: "Page header with breadcrumb, title, description, and action.", whenToUse: "When a page needs hierarchical context above the title.", }), "header-page-header": createBlockVariantDoc({ title: "Page header", categoryLabel: "Header", - markup: headerPageHeaderMarkup, - usedComponents: headerBlockComponents, description: "Page header with title, description, and action.", whenToUse: "When a page needs a clear title area and primary action.", }), "hero-background-image-light": createBlockVariantDoc({ title: "Hero background image light", categoryLabel: "Hero", - markup: heroHeroBgImageLightMarkup, - usedComponents: heroBlockComponents, description: "Hero with background image and light overlay treatment.", whenToUse: "When a hero needs photographic context while keeping a light visual tone.", }), "hero-background-image": createBlockVariantDoc({ title: "Hero background image", categoryLabel: "Hero", - markup: heroHeroBgImageMarkup, - usedComponents: heroBlockComponents, description: "Hero with background image and dark overlay treatment.", whenToUse: "When a hero needs a strong image-led first impression.", }), "hero-center": createBlockVariantDoc({ title: "Hero center", categoryLabel: "Hero", - markup: heroHeroCenterMarkup, - usedComponents: heroBlockComponents, description: "Centered hero with title, supporting text, and action.", whenToUse: "When a landing section should feel formal and balanced.", }), "hero-fullbleed": createBlockVariantDoc({ title: "Hero fullbleed", categoryLabel: "Hero", - markup: heroHeroFullbleedMarkup, - usedComponents: heroBlockComponents, description: "Hero with content and a full-bleed image treatment.", whenToUse: "When imagery should extend beyond the content container.", }), "hero-image": createBlockVariantDoc({ title: "Hero image", categoryLabel: "Hero", - markup: heroHeroImageMarkup, - usedComponents: heroBlockComponents, description: "Hero with content beside a right-aligned image.", whenToUse: "When the hero needs a clear visual companion without full bleed.", }), "hero-basic": createBlockVariantDoc({ title: "Basic hero", categoryLabel: "Hero", - markup: heroHeroMarkup, - usedComponents: heroBlockComponents, description: "Basic left-aligned hero with title, text, and action.", whenToUse: "When a page needs a simple introduction and primary action.", }), "stats-3-statistics": createBlockVariantDoc({ title: "3 statistics", categoryLabel: "Stats", - markup: statsStats3Markup, - usedComponents: statsBlockComponents, description: "Three side-by-side statistics centred on the page.", whenToUse: "When three metrics are enough to support the page narrative.", }), "stats-4-statistics": createBlockVariantDoc({ title: "4 statistics", categoryLabel: "Stats", - markup: statsStats4Markup, - usedComponents: statsBlockComponents, description: "Four side-by-side statistics for denser numeric summaries.", whenToUse: "When four metrics need equal emphasis.", }), "stats-5-statistics": createBlockVariantDoc({ title: "5 statistics", categoryLabel: "Stats", - markup: statsStats5Markup, - usedComponents: statsBlockComponents, description: "Five-column statistics for wider viewports.", whenToUse: "When a larger metric set needs to stay in one row on desktop.", }), "stats-right-6-column": createBlockVariantDoc({ title: "Statistic right 6 column", categoryLabel: "Stats", - markup: statsStatsRight6Markup, - usedComponents: statsBlockComponents, description: "Right-aligned six-column statistics grouping.", whenToUse: "When metrics should sit as a compact panel alongside content.", }), "stats-right-8-columns": createBlockVariantDoc({ title: "Statistic right 8 columns", categoryLabel: "Stats", - markup: statsStatsRight8Markup, - usedComponents: statsBlockComponents, description: "Right-aligned eight-column statistics grouping.", whenToUse: "When a dense metric group needs more horizontal space.", }), @@ -676,7 +499,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Hero", hideFromOverview: true, - usedComponents: ["sgds-button", "sgds-icon"], whenToUse: [ "At the top of a landing page to communicate the primary value proposition", "When you need a strong visual anchor before the main page content", @@ -686,12 +508,12 @@ const patternDocs: Record = { "Inside dashboards or data-heavy interfaces", ], demos: [ - { title: "Default", description: "Left-aligned headline + description + CTA, surface-default background.", markup: heroHeroMarkup }, - { title: "Center", description: "Same hero, content centered horizontally for a more formal feel.", markup: heroHeroCenterMarkup }, - { title: "Image right", description: "50/50 split — content on the left, image on the right.", markup: heroHeroImageMarkup }, - { title: "Full-bleed image right", description: "Content in 6 cols, image absolutely positioned full-bleed on the right.", markup: heroHeroFullbleedMarkup }, - { title: "Background image", description: "Full-cover background image with dark overlay and inverted text.", markup: heroHeroBgImageMarkup }, - { title: "Background image (light)", description: "Light translucent overlay over a background image, with fixed-dark text.", markup: heroHeroBgImageLightMarkup }, + { title: "Default", description: "Left-aligned headline + description + CTA, surface-default background." }, + { title: "Center", description: "Same hero, content centered horizontally for a more formal feel." }, + { title: "Image right", description: "50/50 split — content on the left, image on the right." }, + { title: "Full-bleed image right", description: "Content in 6 cols, image absolutely positioned full-bleed on the right." }, + { title: "Background image", description: "Full-cover background image with dark overlay and inverted text." }, + { title: "Background image (light)", description: "Light translucent overlay over a background image, with fixed-dark text." }, ], }, cards: { @@ -699,7 +521,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Cards", hideFromOverview: true, - usedComponents: ["sgds-card", "sgds-badge", "sgds-link", "sgds-icon"], whenToUse: [ "To display a collection of items of equal importance", "When users need to scan and compare multiple entries", @@ -710,8 +531,8 @@ const patternDocs: Record = { "When there are fewer than three items to show", ], demos: [ - { title: "3 columns", description: "3-column grid (3 per row) with overline + section title and clamped card titles.", markup: cardsCards3Markup }, - { title: "4 columns", description: "4-column grid for denser browsing layouts on wider viewports.", markup: cardsCards4Markup }, + { title: "3 columns", description: "3-column grid (3 per row) with overline + section title and clamped card titles."}, + { title: "4 columns", description: "4-column grid for denser browsing layouts on wider viewports."}, ], }, cta: { @@ -719,7 +540,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Call to action", hideFromOverview: true, - usedComponents: ["sgds-button"], whenToUse: [ "To convert visitors at the end of a marketing page", "To anchor a primary action in the middle of long-form content", @@ -730,14 +550,14 @@ const patternDocs: Record = { "When the user is mid-task and shouldn't be redirected", ], demos: [ - { title: "Contained · primary", description: "Constrained-width CTA on a primary surface, left-aligned.", markup: ctaContainedPrimaryMarkup }, - { title: "Contained · primary · center", description: "Same CTA, content centered.", markup: ctaContainedPrimaryCenterMarkup }, - { title: "Contained · raised", description: "Constrained-width CTA on a raised surface for soft emphasis.", markup: ctaContainedRaisedMarkup }, - { title: "Contained · raised · center", description: "Raised surface, content centered.", markup: ctaContainedRaisedCenterMarkup }, - { title: "Full-bleed · primary", description: "Edge-to-edge primary-coloured CTA section for maximum impact.", markup: ctaFullbleedPrimaryMarkup }, - { title: "Full-bleed · primary · center", description: "Edge-to-edge primary CTA, content centered.", markup: ctaFullbleedPrimaryCenterMarkup }, - { title: "Full-bleed · alternate", description: "Edge-to-edge alternate-surface CTA, lower visual weight.", markup: ctaFullbleedAlternateMarkup }, - { title: "Full-bleed · alternate · center", description: "Edge-to-edge alternate CTA, content centered.", markup: ctaFullbleedAlternateCenterMarkup }, + { title: "Contained · primary", description: "Constrained-width CTA on a primary surface, left-aligned." }, + { title: "Contained · primary · center", description: "Same CTA, content centered." }, + { title: "Contained · raised", description: "Constrained-width CTA on a raised surface for soft emphasis." }, + { title: "Contained · raised · center", description: "Raised surface, content centered." }, + { title: "Full-bleed · primary", description: "Edge-to-edge primary-coloured CTA section for maximum impact." }, + { title: "Full-bleed · primary · center", description: "Edge-to-edge primary CTA, content centered." }, + { title: "Full-bleed · alternate", description: "Edge-to-edge alternate-surface CTA, lower visual weight." }, + { title: "Full-bleed · alternate · center", description: "Edge-to-edge alternate CTA, content centered." }, ], }, feature: { @@ -745,7 +565,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Feature", hideFromOverview: true, - usedComponents: ["sgds-button", "sgds-card", "sgds-icon"], whenToUse: [ "To showcase a product capability or service benefit", "To pair an image or component with descriptive copy in a marketing page", @@ -756,17 +575,17 @@ const patternDocs: Record = { "When you need consistent uniform tiles — use the cards block", ], demos: [ - { title: "4 + 8 · image left", description: "Image in 4 cols, content in 8 cols, image first.", markup: featureFeature48ImgLeftMarkup }, - { title: "4 + 8 · image right", description: "Image in 4 cols, content in 8 cols, image second.", markup: featureFeature48ImgRightMarkup }, - { title: "6 + 6 · image left", description: "Balanced 50/50 split, image first.", markup: featureFeature66ImgLeftMarkup }, - { title: "6 + 6 · image right", description: "Balanced 50/50 split, image second.", markup: featureFeature66ImgRightMarkup }, - { title: "6 + 6 · component left", description: "50/50 split with an SGDS component (not an image) on the left.", markup: featureFeature66ComponentLeftMarkup }, - { title: "6 + 6 · component right", description: "50/50 split with an SGDS component on the right.", markup: featureFeature66ComponentRightMarkup }, - { title: "8 + 4 · image left", description: "Image in 8 cols (dominant), content in 4 cols, image first.", markup: featureFeature84ImgLeftMarkup }, - { title: "8 + 4 · image right", description: "Image in 8 cols (dominant), content in 4 cols, image second.", markup: featureFeature84ImgRightMarkup }, - { title: "Cards below", description: "Section header with feature cards arranged in a row below.", markup: featureFeatureCardsBelowMarkup }, - { title: "No image · center", description: "Headline + description + actions, no image, centered.", markup: featureFeatureNoImgCenterMarkup }, - { title: "No image · left", description: "Headline + description + actions, no image, left-aligned.", markup: featureFeatureNoImgLeftMarkup }, + { title: "4 + 8 · image left", description: "Image in 4 cols, content in 8 cols, image first."}, + { title: "4 + 8 · image right", description: "Image in 4 cols, content in 8 cols, image second."}, + { title: "6 + 6 · image left", description: "Balanced 50/50 split, image first."}, + { title: "6 + 6 · image right", description: "Balanced 50/50 split, image second."}, + { title: "6 + 6 · component left", description: "50/50 split with an SGDS component (not an image) on the left."}, + { title: "6 + 6 · component right", description: "50/50 split with an SGDS component on the right."}, + { title: "8 + 4 · image left", description: "Image in 8 cols (dominant), content in 4 cols, image first."}, + { title: "8 + 4 · image right", description: "Image in 8 cols (dominant), content in 4 cols, image second."}, + { title: "Cards below", description: "Section header with feature cards arranged in a row below." }, + { title: "No image · center", description: "Headline + description + actions, no image, centered." }, + { title: "No image · left", description: "Headline + description + actions, no image, left-aligned." }, ], }, filter: { @@ -774,7 +593,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Filter", hideFromOverview: true, - usedComponents: ["sgds-checkbox", "sgds-checkbox-group", "sgds-link"], whenToUse: [ "On catalogue, search, or admin list pages where users narrow down results", "When you have multiple facet groups (status, type, date) that combine independently", @@ -785,13 +603,12 @@ const patternDocs: Record = { "When filters need to be applied across multi-step flows — use a wizard instead", ], demos: [ - { title: "Sidebar filter", description: "Faceted filter panel with header, clear-all link, and grouped checkbox controls.", markup: filterFilterMarkup }, + { title: "Sidebar filter", description: "Faceted filter panel with header, clear-all link, and grouped checkbox controls." }, ], }, form: { title: "Form", group: "block templates", - usedComponents: formBlockComponents, hideFromOverview: true, whenToUse: [ "Whenever a page needs to collect structured input from users", @@ -803,22 +620,22 @@ const patternDocs: Record = { "For decisions that should be a confirmation dialog — use a modal", ], demos: [ - { title: "All field types", description: "Demonstration form showing every supported field type in one layout.", markup: formAllTypesMarkup }, - { title: "Basic · left", description: "Single-section form, content left-aligned within the page container.", markup: formBasicLeftMarkup }, - { title: "Basic · center", description: "Single-section form centered on the page.", markup: formBasicCenterMarkup }, - { title: "Basic · right", description: "Single-section form right-aligned.", markup: formBasicRightMarkup }, - { title: "Sections · single", description: "One labelled section grouping related fields.", markup: formSectionsSingleMarkup }, - { title: "Sections · two", description: "Two labelled sections separated by spacing.", markup: formSectionsTwoMarkup }, - { title: "Sections · three", description: "Three labelled sections — use for longer forms.", markup: formSectionsThreeMarkup }, - { title: "Multi-step · stepper", description: "Stepper-driven form for transactional flows.", markup: formFormMultistepStepperMarkup }, - { title: "Field types · checkbox", description: "Checkbox + checkbox-group examples, including grouped options.", markup: formFormFieldsCheckboxMarkup }, - { title: "Field types · radio", description: "Radio + radio-group examples.", markup: formFormFieldsRadioMarkup }, - { title: "Field types · select", description: "Select examples for single-value list inputs.", markup: formFormFieldsSelectsMarkup }, - { title: "Field types · textarea", description: "Textarea examples with hint and validation.", markup: formFormFieldsTextareaMarkup }, - { title: "Field types · dates & quantities", description: "Datepicker and quantity-toggle field examples.", markup: formFormFieldsDatesQuantitiesMarkup }, - { title: "Field types · file upload", description: "File upload field examples with drop zone and validation.", markup: formFormFieldsFileUploadMarkup }, - { title: "Full-width fields", description: "Layout where every field spans the form's full width.", markup: formFullwidthOnlyMarkup }, - { title: "Paired fields", description: "Layout pairing fields side-by-side on wider viewports.", markup: formPairedOnlyMarkup }, + { title: "All field types", description: "Demonstration form showing every supported field type in one layout." }, + { title: "Basic · left", description: "Single-section form, content left-aligned within the page container." }, + { title: "Basic · center", description: "Single-section form centered on the page." }, + { title: "Basic · right", description: "Single-section form right-aligned." }, + { title: "Sections · single", description: "One labelled section grouping related fields." }, + { title: "Sections · two", description: "Two labelled sections separated by spacing." }, + { title: "Sections · three", description: "Three labelled sections — use for longer forms." }, + { title: "Multi-step · stepper", description: "Stepper-driven form for transactional flows." }, + { title: "Field types · checkbox", description: "Checkbox + checkbox-group examples, including grouped options." }, + { title: "Field types · radio", description: "Radio + radio-group examples." }, + { title: "Field types · select", description: "Select examples for single-value list inputs." }, + { title: "Field types · textarea", description: "Textarea examples with hint and validation." }, + { title: "Field types · dates & quantities", description: "Datepicker and quantity-toggle field examples." }, + { title: "Field types · file upload", description: "File upload field examples with drop zone and validation." }, + { title: "Full-width fields", description: "Layout where every field spans the form's full width." }, + { title: "Paired fields", description: "Layout pairing fields side-by-side on wider viewports." }, ], }, ...formBlockVariantDocs, @@ -828,7 +645,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Header", hideFromOverview: true, - usedComponents: ["sgds-breadcrumb", "sgds-button", "sgds-icon"], whenToUse: [ "At the top of internal-tool pages and content pages alike", "To anchor a page with title, description, and primary actions", @@ -839,8 +655,8 @@ const patternDocs: Record = { "Inside modal dialogs — use the modal's own title slot", ], demos: [ - { title: "Default", description: "Page header with title, description, and right-aligned action.", markup: headerPageHeaderMarkup }, - { title: "With breadcrumb", description: "Page header with a breadcrumb above the title for hierarchical context.", markup: headerPageHeaderBreadcrumbMarkup }, + { title: "Default", description: "Page header with title, description, and right-aligned action." }, + { title: "With breadcrumb", description: "Page header with a breadcrumb above the title for hierarchical context." }, ], }, stats: { @@ -848,7 +664,6 @@ const patternDocs: Record = { group: "block templates", categoryLabel: "Stats", hideFromOverview: true, - usedComponents: ["sgds-icon"], whenToUse: [ "On about pages and reports to highlight quantitative outcomes", "On dashboards as a quick at-a-glance KPI summary", @@ -859,18 +674,17 @@ const patternDocs: Record = { "When the trend matters more than the snapshot — use a chart", ], demos: [ - { title: "3 columns", description: "Three side-by-side stats centred on the page.", markup: statsStats3Markup }, - { title: "4 columns", description: "Four side-by-side stats for denser numeric summaries.", markup: statsStats4Markup }, - { title: "5 columns", description: "Five-column stats — use sparingly on wider viewports.", markup: statsStats5Markup }, - { title: "6 columns · right-aligned", description: "Six-column right-aligned stats grouping for a compact panel.", markup: statsStatsRight6Markup }, - { title: "8 columns · right-aligned", description: "Eight-column right-aligned stats for the densest summaries.", markup: statsStatsRight8Markup }, + { title: "3 columns", description: "Three side-by-side stats centred on the page."}, + { title: "4 columns", description: "Four side-by-side stats for denser numeric summaries."}, + { title: "5 columns", description: "Five-column stats — use sparingly on wider viewports."}, + { title: "6 columns · right-aligned", description: "Six-column right-aligned stats grouping for a compact panel."}, + { title: "8 columns · right-aligned", description: "Eight-column right-aligned stats for the densest summaries."}, ], }, "form-page": { title: "Form page", group: "page templates", categoryLabel: "Forms", - usedComponents: ["sgds-input", "sgds-select", "sgds-button", "sgds-breadcrumb"], whenToUse: [ "For single-topic forms where all fields can be shown on one screen", "When the form is short enough not to need a stepper (under 8 fields)", @@ -883,7 +697,6 @@ const patternDocs: Record = { { title: "Default", description: "A simple form page with a heading, description, fields, and submission actions.", - markup: formPageMarkup, }, ], }, @@ -891,7 +704,6 @@ const patternDocs: Record = { title: "Multi-step form", group: "page templates", categoryLabel: "Forms", - usedComponents: ["sgds-stepper", "sgds-input", "sgds-button", "sgds-breadcrumb"], whenToUse: [ "When a form has more than 8 fields and benefits from being broken into logical steps", "When different sections of the form require different levels of user attention", @@ -904,7 +716,6 @@ const patternDocs: Record = { { title: "Default", description: "A multi-step form with a stepper indicator, step content, and navigation buttons.", - markup: multiStepFormPageMarkup, }, ], }, @@ -912,17 +723,6 @@ const patternDocs: Record = { title: "Application management", group: "page templates", categoryLabel: "Browse and manage", - usedComponents: [ - "sgds-masthead", - "sgds-mainnav", - "sgds-breadcrumb", - "sgds-checkbox-group", - "sgds-input", - "sgds-table", - "sgds-pagination", - "sgds-button", - "sgds-footer", - ], whenToUse: [ "For admin dashboards and management portals that list registered applications or records", "When users need sidebar filters together with a searchable, paginated data table", @@ -936,7 +736,6 @@ const patternDocs: Record = { { title: "Application list", description: "Sidebar filters, search bar, results count, and a paginated table of records.", - markup: applicationManagementMarkup, }, ], }, @@ -944,16 +743,6 @@ const patternDocs: Record = { title: "Catalogue", group: "page templates", categoryLabel: "Browse and manage", - usedComponents: [ - "sgds-masthead", - "sgds-mainnav", - "sgds-input", - "sgds-checkbox-group", - "sgds-select", - "sgds-card", - "sgds-pagination", - "sgds-footer", - ], whenToUse: [ "For public catalogues of programmes, events, services, or content", "When users need search, sidebar filters, sort, and a card-based results grid", @@ -967,7 +756,6 @@ const patternDocs: Record = { { title: "Search and filter", description: "Page header with search, sidebar filters, sort dropdown, and a responsive grid of result cards.", - markup: catalogueMarkup, }, ], }, @@ -975,13 +763,6 @@ const patternDocs: Record = { title: "About us", group: "page templates", categoryLabel: "Content pages", - usedComponents: [ - "sgds-masthead", - "sgds-mainnav", - "sgds-thumbnail-card", - "sgds-link", - "sgds-footer", - ], whenToUse: [ "For agency or product about pages that introduce the team, mission, and impact", "When the page combines a headline, supporting imagery, partner logos, and stats", @@ -995,7 +776,6 @@ const patternDocs: Record = { { title: "Default", description: "Two-column headline, image grid, animated logo strip, and an achievements stats panel.", - markup: aboutUsMarkup, }, ], }, @@ -1003,14 +783,6 @@ const patternDocs: Record = { title: "Landing page", group: "page templates", categoryLabel: "Landing pages", - usedComponents: [ - "sgds-masthead", - "sgds-mainnav", - "sgds-button", - "sgds-card", - "sgds-link", - "sgds-footer", - ], whenToUse: [ "For product or service launch pages with a clear primary call to action", "When you need a hero section followed by features, stats, and a closing CTA", @@ -1024,7 +796,6 @@ const patternDocs: Record = { { title: "Default", description: "Hero with headline and CTAs, life-moments feature cards, stats row, and a closing call to action.", - markup: landingMarkup, }, ], }, @@ -1032,13 +803,6 @@ const patternDocs: Record = { title: "Blog", group: "page templates", categoryLabel: "Content pages", - usedComponents: [ - "sgds-masthead", - "sgds-mainnav", - "sgds-breadcrumb", - "sgds-button", - "sgds-footer", - ], whenToUse: [ "For long-form content like blog posts, news articles, success stories, or case studies", "When the page needs a clear hierarchy of headline, body sections, and supporting stats", @@ -1052,7 +816,6 @@ const patternDocs: Record = { { title: "Success story", description: "Breadcrumb, article header, body sections with sub-headings, results stats, and a closing CTA.", - markup: blogMarkup, }, ], }, @@ -1101,7 +864,6 @@ export const templateOverviewGroups: TemplateOverviewGroup[] = ([ group: doc.group, groupLabel: doc.categoryLabel ?? templateGroupLabel[doc.group], demoCount: doc.demos.length, - usedComponents: doc.usedComponents, })), })); @@ -1126,12 +888,7 @@ const buildPatternPurposeCards = (doc: PatternDoc) => [ }, ]; -const buildPatternAnatomyParts = (doc: PatternDoc) => - (doc.usedComponents.length ? doc.usedComponents : ["sgds-container"]).map((component, index) => ({ - number: index + 1, - title: component, - note: "(used)", - })); +const buildPatternAnatomyParts = (_doc: PatternDoc) => [] as { number: number; title: string; note: string }[]; const buildPatternGuidance = (doc: PatternDoc) => { const guidance = [ @@ -1158,12 +915,9 @@ const buildPatternBestPractices = (doc: PatternDoc) => title: practice.title, tone: practice.tone, description: practice.items.join(" "), - markup: doc.demos[0]?.markup || `
`, })); const buildPatternAccessibilitySections = (doc: PatternDoc) => { - const previewMarkup = doc.demos[0]?.markup || `
`; - return [ { title: "Keyboard support", @@ -1172,7 +926,6 @@ const buildPatternAccessibilitySections = (doc: PatternDoc) => { "Check focus order and action placement in the surrounding page context, especially when the pattern groups multiple interactive elements together.", ], items: [], - markup: previewMarkup, }, { title: "Tab order", @@ -1183,7 +936,6 @@ const buildPatternAccessibilitySections = (doc: PatternDoc) => { "Confirm any revealed or supporting content remains reachable.", "Continue to the next interactive element on the page.", ], - markup: previewMarkup, }, ]; }; @@ -1240,14 +992,15 @@ export function getPatternDoc(key: string): ResolvedComponentDoc | null { `${doc.title} is an SGDS pattern for building structured interfaces.`, tag: "div", group: "layout", - demos: doc.demos, + demos: doc.demos.map((d) => ({ ...d, markup: "" })), purposeCards: buildPatternPurposeCards(doc), - anatomyMarkup: doc.demos[0]?.markup, + anatomyMarkup: undefined, resolvedAnatomyParts: buildPatternAnatomyParts(doc), usage: { guidance: buildPatternGuidance(doc), behaviours: doc.demos.map((demo) => ({ ...demo, + markup: "", surface: "default", })), bestPractices: buildPatternBestPractices(doc), diff --git a/docs/.vitepress/data/template-markup.ts b/docs/.vitepress/data/template-markup.ts deleted file mode 100644 index d1d767ce..00000000 --- a/docs/.vitepress/data/template-markup.ts +++ /dev/null @@ -1,1484 +0,0 @@ -// Storybook page-template markup, extracted from -// https://github.com/GovTechSG/sgds-web-component/tree/master/stories/templates -// -// Each export corresponds to one .stories.js file. Lit-specific syntax has -// been stripped where needed. Template scripts are preserved when they drive -// Storybook interactivity, and TemplateRaw executes them inside the preview. - -export const applicationManagementMarkup = `
-
- - - Logo - Home - Applications - Reports - -
- -
-
-
- - Home - Applications - - -
-
-
-
- -
-

Applications

-
-
- Browse and manage all registered applications in your organisation. -
-
- - - - Create application - -
-
- -
- - -
-
-
- -
-
All applications
-
- -
-
- -
- - - Filter - -
- -
Showing 6/14 result(s)
- - - - Application name - Organisation - Environment - Status - Actions - - - APEX Gateway v2.1.0 - [GVT] APEX - Production - Active - View - - - MyInfo Bridge v1.4.0 - [GVT] NDI - Staging - Pending - View - - - FormSG Webhook v3.0.0 - [GVT] OGP - Production - Active - View - - - SingPass Auth v1.2.0 - [GVT] GDS - Production - Rejected - View - - - Data.gov Sync v2.0.0 - [GVT] SNDGO - Development - Suspended - View - - - CorpPass Verify v1.0.0 - [GVT] ACRA - Staging - Active - View - - - - -
-
-
- -
-
`; - -export const catalogueMarkup = ` - - - - Logo - - -
-
-
-
Programmes
-

Browse Programmes

-

- Explore available government programmes and services. -

- - - -
-
-
- -
-
-
- - -
-
-
Showing 12 results
- - Most relevant - Date: Earliest first - Date: Latest first - Name: A–Z - Name: Z–A - -
- -
-
- - Keynote - Digital Infrastructure for the Next Decade - An overview of Singapore's plans for resilient and future-ready digital infrastructure. - View details - -
-
- - Panel Discussion - AI Governance in the Public Sector - Panellists explore responsible AI adoption frameworks and inter-agency collaboration. - View details - -
-
- - Presentation - Zero-Trust Architecture for Government Systems - A deep dive into implementing zero-trust principles across legacy and modern systems. - View details - -
-
- - Keynote - Securing the Cloud: Lessons from the Field - Key takeaways from real-world cloud migration projects across the Singapore government. - View details - -
-
- - Presentation - Incident Response Playbooks for CISOs - Practical frameworks for building effective incident response and recovery strategies. - View details - -
-
- - Panel Discussion - Workforce Upskilling for Cyber Resilience - How agencies are building cyber talent pipelines and fostering a security-aware culture. - View details - -
-
- -
- -
-
-
-
-
`; - -export const aboutUsMarkup = ` - - - - - Logo - - -
-
-
-
-

- Building digital services that matter for Singapore -

-
-
-

- We are a team of designers, engineers, and product thinkers committed to delivering citizen-centric digital experiences across government. -

-
-
- -
-
- Team collaborating on a project -
- -
- -
- Logo -
- - Trusted by agencies across the whole-of-government ecosystem to deliver accessible, compliant, and consistent digital interfaces. - - - Learn more - -
- - Office environment -
-
- -
-
-

- Trusted by agencies -

-
- -
-
-
-
Agency A
-
Agency B
-
Agency C
-
Agency D
-
Agency E
-
- -
-
-
- -
-
-
-

- Delivering impact at scale -

-
-
-

- Our platform powers services used by millions of residents and thousands of officers across the Singapore government. -

-
-
- -
-
-

12,000+

-

Active users

-
-
-

98%

-

Platform uptime

-
-
-

50+

-

Government agencies

-
-
-

5 years

-

In production

-
-
-
-
-
- -`; - -export const formPageMarkup = ` - - - Logo - - - -
-
-
-
- Profile Settings -
-

- Edit profile -

-

- Update your personal details and preferences. -

-
-
-
- -
-
-
- -
-
-
-

- Personal information -

-

- Your name and contact details. Only your agency administrator can see this information. -

-
- -
-
- - -
- - -
-
-
- - -
-
-
-

- Role & access -

-

- Your position and assigned permissions within the system. -

-
- -
- - - Policy - Operations - ICT - - - Viewer - Editor - Admin - -
-
-
- - -
-
-
-

- Notes -

-

- Optional additional context visible to your team. -

-
- -
- -
-
-
- - -
- Cancel - Save changes -
-
-
-
- - `; - -export const multiStepFormPageMarkup = ` - - - - - Logo - - Save draft - - - - - - -
-
- - - Before you begin: Ensure you have your company UEN, latest financial statements, and project - quotations ready. Applications typically take 20-30 minutes to complete. - - - - - - -
-
-
-
-
-

- Company Information -

-

- Basic details about your registered business entity. -

-
-
-
- - -
- - - Sole Proprietorship - Partnership / Limited Liability Partnership - Private Limited Company (Pte. Ltd.) - Public Limited Company (Ltd.) - Co-operative - - -
- - 1 - 10 - 11 - 50 - 51 - 200 - More than 200 (not eligible) - - - Less than S$1 million - S$1 million - S$10 million - S$10 million - S$50 million - S$50 million - S$100 million - More than S$100 million (not eligible) - -
-
-
-
- -
-
-
-

- Industry & History -

-

- Your primary sector and prior engagement with government grants. -

-
-
-
- - Food & Beverage - Retail - Manufacturing - Construction - Logistics & Transportation - Hospitality & Tourism - Professional Services - Healthcare - ICT & Digital Services - Other - - - Less than 1 year (not eligible) - 1 - 3 years - 3 - 5 years - More than 5 years - -
- - - No, this is my first application - Yes, for a different project - Yes, for a similar project (may affect eligibility) - -
-
-
- -
- - Next: Project Details - - -
-
-
- - -
-
-
-
-
-

- Project Overview -

-

- Describe the sustainability initiative you are seeking funding for. -

-
-
- - - - Renewable Energy (Solar, Wind, Biogas) - Energy Efficiency & Management - Water Conservation & Recycling - Waste Reduction & Circular Economy - Green Transport & Logistics - Sustainable Procurement & Supply Chain - Green Building Retrofit - Carbon Measurement & Management - - - -
-
-
- -
- - - Back - - - Next: Review - - -
-
-
- - -
-
-
-
-
-

- Application Summary -

-

- Review all details before submitting. Use the Back button to correct any information. -

-
-
-
- - Company Information - UEN- - Company Name- - Business Structure- - - - - Project Details - Project Title- - Category- - -
-
-
-
- -
-
-
-

- Declarations -

-

- All declarations must be acknowledged before submission. -

-
-
- - I declare that all information provided in this application is true, complete, and accurate to the - best of my knowledge. - - - - I have read and agree to the - Terms and Conditions. - -
-
-
- -
- - - Back - - - Submit Application - - -
-
-
- - -
-
- - -
-

- Application Submitted -

-

- Thank you for applying for the Enterprise Sustainability Grant. -

-
- -
-
- Reference Number -
-

- ESG-2026-12345 -

-
-
-
-
-
- - - - - `; - -export const reportIssueMarkup = ` - - Logo - - -
-
-
-
-
-
-

- Report an Issue -

-

- Help us improve by reporting problems in your area. We aim to respond within 3 working days. -

-
- -
- - - - - - Upload Photos - - - - Submit Report - -
-
-
-
-
-
- -`; - -export const blogMarkup = ` - - - - Logo - - -
-
-
- - Home - Stories - LifeSG Parenting Journey - - -
-
Success Story
-

- How LifeSG Helped 180,000 New Parents Navigate Government Services -

-

- A look at how the Parenting Journey feature reduced time-to-access for critical family services by 60% in its first year. -

-
-
-
-
- -
-
-
-

- When a child is born in Singapore, parents suddenly find themselves navigating a maze of government agencies - the Immigration and Checkpoints Authority for the birth certificate, HDB for housing grants, Baby Bonus from MSF, and CPF contributions. Each carries its own eligibility rules, deadlines, and application portals. -

-

- The LifeSG Parenting Journey was built to change this. By aggregating services across agencies into a single, guided flow, it removed the burden of discovery from parents during one of the most demanding periods of their lives. -

-
-
-
- -
-
-
-

The Challenge

-

- User research conducted in 2022 revealed three persistent pain points that parents faced when trying to access post-birth government services. -

-
    -
  1. Fragmented entry points. Parents had to know which agency offered each benefit before they could begin. Many missed out on grants simply because they were unaware of them.
  2. -
  3. Repeated data entry. The same personal and household details were required across six separate agency forms, leading to fatigue and errors.
  4. -
  5. No status visibility. Once applications were submitted, parents had no unified view of their status across agencies - each required a separate login to check progress.
  6. -
-
-
-
- -
-
-
-
-

Results After 12 Months

-

- Measured against a baseline cohort from the year prior to launch. -

-
- -
-
-
60%
-
Reduction in time-to-access
-

Average time from birth registration to first benefit received fell from 14 days to 5.5 days.

-
-
-
180K
-
Parents onboarded
-

Representing 94% of all new births registered in Singapore during the period.

-
-
-
4.7
-
Satisfaction score (out of 5)
-

Based on 12,400 post-task survey responses collected in-app.

-
-
-
-
-
- -
-
-
-

What's Next

-

- Building on the success of the Parenting Journey, the team is now expanding the life-moments model to cover eldercare transitions, housing upgrades, and retirement planning - applying the same cross-agency integration approach to new resident cohorts. -

-
Published April 2026
-

- Government Digital Services, Smart Nation and Digital Government Office -

- Read More Stories -
-
-
- -`; - -export const landingMarkup = ` - - - - Logo - - -
-
-
-
-
-
- Singapore Government Digital Services -
-

- One Platform.
Simpler Living. -

-

- Access government services anytime, anywhere. Built for residents, designed for ease. -

-
-
- Get Started - Learn More -
-
- -
- -
-
-
-
- -
-
-
-
-
Life Moments
-

- Built for Every Stage of Life -

-
- Services grouped around your life moments - not government structures. -
-
- -
-
- - FAMILY - Family and Relationships - Register births, apply for child development grants, and access parenting resources all in one place. - Learn more - -
-
- - HOUSING - Home and Housing - Check eligibility, apply for flats, and manage your property-related transactions with HDB and other agencies. - Learn more - -
-
- - EMPLOYMENT - Work and Employment - Search for jobs, upskill through SkillsFuture, and access employment support schemes tailored to your needs. - Learn more - -
-
-
-
-
- -
-
-
-
-
By the Numbers
-

Impact at a Glance

-

- Key metrics measured over the past 12 months across all participating agencies. -

-
- -
-
-
2.4M
-
Active Users
-

Residents actively using the platform to access government services each month.

-
-
-
400+
-
Government Services
-

Integrated services from agencies across the public sector in one place.

-
-
-
99.9%
-
Platform Uptime
-

Consistently high availability so residents can access services anytime.

-
-
-
16
-
Partner Agencies
-

Public agencies contributing services and data to the shared platform.

-
-
-
-
-
- -
-
-
-

- Ready to simplify your government experience? -

-

- Join millions of residents already using LifeSG to access the services that matter most to them. -

- Get Started with Singpass -
-
-
- -`; - -export const pageTemplateMarkupByKey: Record = { - "about-us": aboutUsMarkup, - "application-management": applicationManagementMarkup, - blog: blogMarkup, - catalogue: catalogueMarkup, - "form-page": formPageMarkup, - landing: landingMarkup, - "multi-step-form": multiStepFormPageMarkup, -}; diff --git a/docs/blocks/preview/raw/cards-3-per-column.md b/docs/blocks/preview/raw/cards-3-per-column.md deleted file mode 100644 index a205d3da..00000000 --- a/docs/blocks/preview/raw/cards-3-per-column.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: 3 per column ---- - - - - diff --git a/docs/blocks/preview/raw/cards-4-per-column.md b/docs/blocks/preview/raw/cards-4-per-column.md deleted file mode 100644 index d3c4f142..00000000 --- a/docs/blocks/preview/raw/cards-4-per-column.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: 4 per column ---- - - - - diff --git a/docs/blocks/preview/raw/cards.md b/docs/blocks/preview/raw/cards.md deleted file mode 100644 index 8380b3ce..00000000 --- a/docs/blocks/preview/raw/cards.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Cards ---- - - - - diff --git a/docs/blocks/preview/raw/cta-contained-primary-center.md b/docs/blocks/preview/raw/cta-contained-primary-center.md deleted file mode 100644 index 072c46d6..00000000 --- a/docs/blocks/preview/raw/cta-contained-primary-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Contained Primary Center ---- - - - - diff --git a/docs/blocks/preview/raw/cta-contained-primary.md b/docs/blocks/preview/raw/cta-contained-primary.md deleted file mode 100644 index abb3e6d5..00000000 --- a/docs/blocks/preview/raw/cta-contained-primary.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Contained Primary ---- - - - - diff --git a/docs/blocks/preview/raw/cta-contained-raised-center.md b/docs/blocks/preview/raw/cta-contained-raised-center.md deleted file mode 100644 index 6f19a04a..00000000 --- a/docs/blocks/preview/raw/cta-contained-raised-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Contained Raised Center ---- - - - - diff --git a/docs/blocks/preview/raw/cta-contained-raised.md b/docs/blocks/preview/raw/cta-contained-raised.md deleted file mode 100644 index 6a462c7d..00000000 --- a/docs/blocks/preview/raw/cta-contained-raised.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Contained Raised ---- - - - - diff --git a/docs/blocks/preview/raw/cta-full-bleed-alternate-center.md b/docs/blocks/preview/raw/cta-full-bleed-alternate-center.md deleted file mode 100644 index 8cc2a65f..00000000 --- a/docs/blocks/preview/raw/cta-full-bleed-alternate-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Full Bleed Alternate Center ---- - - - - diff --git a/docs/blocks/preview/raw/cta-full-bleed-alternate.md b/docs/blocks/preview/raw/cta-full-bleed-alternate.md deleted file mode 100644 index 77d9eff8..00000000 --- a/docs/blocks/preview/raw/cta-full-bleed-alternate.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Full Bleed Alternate ---- - - - - diff --git a/docs/blocks/preview/raw/cta-full-bleed-primary-center.md b/docs/blocks/preview/raw/cta-full-bleed-primary-center.md deleted file mode 100644 index 4007d226..00000000 --- a/docs/blocks/preview/raw/cta-full-bleed-primary-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Full Bleed Primary Center ---- - - - - diff --git a/docs/blocks/preview/raw/cta-full-bleed-primary.md b/docs/blocks/preview/raw/cta-full-bleed-primary.md deleted file mode 100644 index 04795aec..00000000 --- a/docs/blocks/preview/raw/cta-full-bleed-primary.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Full Bleed Primary ---- - - - - diff --git a/docs/blocks/preview/raw/cta.md b/docs/blocks/preview/raw/cta.md deleted file mode 100644 index e11766b4..00000000 --- a/docs/blocks/preview/raw/cta.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Call to action ---- - - - - diff --git a/docs/blocks/preview/raw/feature-cards-below.md b/docs/blocks/preview/raw/feature-cards-below.md deleted file mode 100644 index bc27e22d..00000000 --- a/docs/blocks/preview/raw/feature-cards-below.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Cards below ---- - - - - diff --git a/docs/blocks/preview/raw/feature-component-left-6-6.md b/docs/blocks/preview/raw/feature-component-left-6-6.md deleted file mode 100644 index 7f9e61f5..00000000 --- a/docs/blocks/preview/raw/feature-component-left-6-6.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Component left 6:6 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-component-right-6-6.md b/docs/blocks/preview/raw/feature-component-right-6-6.md deleted file mode 100644 index fb363b66..00000000 --- a/docs/blocks/preview/raw/feature-component-right-6-6.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Component right 6:6 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-image-left-4-8.md b/docs/blocks/preview/raw/feature-image-left-4-8.md deleted file mode 100644 index b5bfe8a6..00000000 --- a/docs/blocks/preview/raw/feature-image-left-4-8.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Image left 4:8 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-image-left-6-6.md b/docs/blocks/preview/raw/feature-image-left-6-6.md deleted file mode 100644 index 1e6f4193..00000000 --- a/docs/blocks/preview/raw/feature-image-left-6-6.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Image left 6:6 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-image-left-8-4.md b/docs/blocks/preview/raw/feature-image-left-8-4.md deleted file mode 100644 index 82bca1e2..00000000 --- a/docs/blocks/preview/raw/feature-image-left-8-4.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Image left 8:4 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-image-right-4-8.md b/docs/blocks/preview/raw/feature-image-right-4-8.md deleted file mode 100644 index 0b7afb54..00000000 --- a/docs/blocks/preview/raw/feature-image-right-4-8.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Image right 4:8 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-image-right-6-6.md b/docs/blocks/preview/raw/feature-image-right-6-6.md deleted file mode 100644 index a820165c..00000000 --- a/docs/blocks/preview/raw/feature-image-right-6-6.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Image right 6:6 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-image-right-8-4.md b/docs/blocks/preview/raw/feature-image-right-8-4.md deleted file mode 100644 index 4d5a383c..00000000 --- a/docs/blocks/preview/raw/feature-image-right-8-4.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Image right 8:4 ---- - - - - diff --git a/docs/blocks/preview/raw/feature-no-image-center.md b/docs/blocks/preview/raw/feature-no-image-center.md deleted file mode 100644 index fc9681ba..00000000 --- a/docs/blocks/preview/raw/feature-no-image-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: No image center ---- - - - - diff --git a/docs/blocks/preview/raw/feature-no-image-left.md b/docs/blocks/preview/raw/feature-no-image-left.md deleted file mode 100644 index 8e4b051b..00000000 --- a/docs/blocks/preview/raw/feature-no-image-left.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: No image left ---- - - - - diff --git a/docs/blocks/preview/raw/feature.md b/docs/blocks/preview/raw/feature.md deleted file mode 100644 index bd5e4335..00000000 --- a/docs/blocks/preview/raw/feature.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Feature ---- - - - - diff --git a/docs/blocks/preview/raw/filter-checkboxes.md b/docs/blocks/preview/raw/filter-checkboxes.md deleted file mode 100644 index 40a35289..00000000 --- a/docs/blocks/preview/raw/filter-checkboxes.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Filter checkboxes ---- - - - - diff --git a/docs/blocks/preview/raw/filter.md b/docs/blocks/preview/raw/filter.md deleted file mode 100644 index cabf7fc2..00000000 --- a/docs/blocks/preview/raw/filter.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Filter ---- - - - - diff --git a/docs/blocks/preview/raw/form-all-types.md b/docs/blocks/preview/raw/form-all-types.md deleted file mode 100644 index 636c110e..00000000 --- a/docs/blocks/preview/raw/form-all-types.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: All Types ---- - - - - diff --git a/docs/blocks/preview/raw/form-basic-center.md b/docs/blocks/preview/raw/form-basic-center.md deleted file mode 100644 index 33e82f11..00000000 --- a/docs/blocks/preview/raw/form-basic-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic Center ---- - - - - diff --git a/docs/blocks/preview/raw/form-basic-left.md b/docs/blocks/preview/raw/form-basic-left.md deleted file mode 100644 index 727f1fab..00000000 --- a/docs/blocks/preview/raw/form-basic-left.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic Left ---- - - - - diff --git a/docs/blocks/preview/raw/form-basic-right.md b/docs/blocks/preview/raw/form-basic-right.md deleted file mode 100644 index 7249805c..00000000 --- a/docs/blocks/preview/raw/form-basic-right.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic Right ---- - - - - diff --git a/docs/blocks/preview/raw/form-fields-checkbox.md b/docs/blocks/preview/raw/form-fields-checkbox.md deleted file mode 100644 index 61a2b776..00000000 --- a/docs/blocks/preview/raw/form-fields-checkbox.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Fields Checkbox ---- - - - - diff --git a/docs/blocks/preview/raw/form-fields-dates-quantities.md b/docs/blocks/preview/raw/form-fields-dates-quantities.md deleted file mode 100644 index 5f24ee3f..00000000 --- a/docs/blocks/preview/raw/form-fields-dates-quantities.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Fields Dates Quantities ---- - - - - diff --git a/docs/blocks/preview/raw/form-fields-file-upload.md b/docs/blocks/preview/raw/form-fields-file-upload.md deleted file mode 100644 index d9bf7080..00000000 --- a/docs/blocks/preview/raw/form-fields-file-upload.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Fields File Upload ---- - - - - diff --git a/docs/blocks/preview/raw/form-fields-radio.md b/docs/blocks/preview/raw/form-fields-radio.md deleted file mode 100644 index f15c42e0..00000000 --- a/docs/blocks/preview/raw/form-fields-radio.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Fields Radio ---- - - - - diff --git a/docs/blocks/preview/raw/form-fields-selects.md b/docs/blocks/preview/raw/form-fields-selects.md deleted file mode 100644 index b85170c8..00000000 --- a/docs/blocks/preview/raw/form-fields-selects.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Fields Selects ---- - - - - diff --git a/docs/blocks/preview/raw/form-fields-textarea.md b/docs/blocks/preview/raw/form-fields-textarea.md deleted file mode 100644 index 234d6c7e..00000000 --- a/docs/blocks/preview/raw/form-fields-textarea.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Fields Textarea ---- - - - - diff --git a/docs/blocks/preview/raw/form-full-width-only.md b/docs/blocks/preview/raw/form-full-width-only.md deleted file mode 100644 index fb99c172..00000000 --- a/docs/blocks/preview/raw/form-full-width-only.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Full-width only ---- - - - - diff --git a/docs/blocks/preview/raw/form-multi-step.md b/docs/blocks/preview/raw/form-multi-step.md deleted file mode 100644 index 9cbfd173..00000000 --- a/docs/blocks/preview/raw/form-multi-step.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form Multi-step ---- - - - - diff --git a/docs/blocks/preview/raw/form-paired-only.md b/docs/blocks/preview/raw/form-paired-only.md deleted file mode 100644 index 54a143da..00000000 --- a/docs/blocks/preview/raw/form-paired-only.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Paired Only ---- - - - - diff --git a/docs/blocks/preview/raw/form-sections-single.md b/docs/blocks/preview/raw/form-sections-single.md deleted file mode 100644 index 6d2bfe59..00000000 --- a/docs/blocks/preview/raw/form-sections-single.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Sections Single ---- - - - - diff --git a/docs/blocks/preview/raw/form-sections-three.md b/docs/blocks/preview/raw/form-sections-three.md deleted file mode 100644 index 8d458141..00000000 --- a/docs/blocks/preview/raw/form-sections-three.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Sections Three ---- - - - - diff --git a/docs/blocks/preview/raw/form-sections-two.md b/docs/blocks/preview/raw/form-sections-two.md deleted file mode 100644 index fa42412f..00000000 --- a/docs/blocks/preview/raw/form-sections-two.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Sections Two ---- - - - - diff --git a/docs/blocks/preview/raw/header-page-header-with-breadcrumb.md b/docs/blocks/preview/raw/header-page-header-with-breadcrumb.md deleted file mode 100644 index eb34eb31..00000000 --- a/docs/blocks/preview/raw/header-page-header-with-breadcrumb.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Page header with breadcrumb ---- - - - - diff --git a/docs/blocks/preview/raw/header-page-header.md b/docs/blocks/preview/raw/header-page-header.md deleted file mode 100644 index e5b4aa02..00000000 --- a/docs/blocks/preview/raw/header-page-header.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Page header ---- - - - - diff --git a/docs/blocks/preview/raw/header.md b/docs/blocks/preview/raw/header.md deleted file mode 100644 index 4f0c84e5..00000000 --- a/docs/blocks/preview/raw/header.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Page header ---- - - - - diff --git a/docs/blocks/preview/raw/hero-background-image-light.md b/docs/blocks/preview/raw/hero-background-image-light.md deleted file mode 100644 index 37a3b027..00000000 --- a/docs/blocks/preview/raw/hero-background-image-light.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero background image light ---- - - - - diff --git a/docs/blocks/preview/raw/hero-background-image.md b/docs/blocks/preview/raw/hero-background-image.md deleted file mode 100644 index 27f66db2..00000000 --- a/docs/blocks/preview/raw/hero-background-image.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero background image ---- - - - - diff --git a/docs/blocks/preview/raw/hero-basic.md b/docs/blocks/preview/raw/hero-basic.md deleted file mode 100644 index e7c1f4ca..00000000 --- a/docs/blocks/preview/raw/hero-basic.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic hero ---- - - - - diff --git a/docs/blocks/preview/raw/hero-center.md b/docs/blocks/preview/raw/hero-center.md deleted file mode 100644 index 4498b7e5..00000000 --- a/docs/blocks/preview/raw/hero-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero center ---- - - - - diff --git a/docs/blocks/preview/raw/hero-fullbleed.md b/docs/blocks/preview/raw/hero-fullbleed.md deleted file mode 100644 index a889212e..00000000 --- a/docs/blocks/preview/raw/hero-fullbleed.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero fullbleed ---- - - - - diff --git a/docs/blocks/preview/raw/hero-image.md b/docs/blocks/preview/raw/hero-image.md deleted file mode 100644 index 2bb13110..00000000 --- a/docs/blocks/preview/raw/hero-image.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero image ---- - - - - diff --git a/docs/blocks/preview/raw/hero.md b/docs/blocks/preview/raw/hero.md deleted file mode 100644 index c148fc46..00000000 --- a/docs/blocks/preview/raw/hero.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero ---- - - - - diff --git a/docs/blocks/preview/raw/stats-3-statistics.md b/docs/blocks/preview/raw/stats-3-statistics.md deleted file mode 100644 index a3337ccb..00000000 --- a/docs/blocks/preview/raw/stats-3-statistics.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: 3 statistics ---- - - - - diff --git a/docs/blocks/preview/raw/stats-4-statistics.md b/docs/blocks/preview/raw/stats-4-statistics.md deleted file mode 100644 index 37be9b6c..00000000 --- a/docs/blocks/preview/raw/stats-4-statistics.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: 4 statistics ---- - - - - diff --git a/docs/blocks/preview/raw/stats-5-statistics.md b/docs/blocks/preview/raw/stats-5-statistics.md deleted file mode 100644 index 50ccbff1..00000000 --- a/docs/blocks/preview/raw/stats-5-statistics.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: 5 statistics ---- - - - - diff --git a/docs/blocks/preview/raw/stats-right-6-column.md b/docs/blocks/preview/raw/stats-right-6-column.md deleted file mode 100644 index e98539e9..00000000 --- a/docs/blocks/preview/raw/stats-right-6-column.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Statistic right 6 column ---- - - - - diff --git a/docs/blocks/preview/raw/stats-right-8-columns.md b/docs/blocks/preview/raw/stats-right-8-columns.md deleted file mode 100644 index 9032cd18..00000000 --- a/docs/blocks/preview/raw/stats-right-8-columns.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Statistic right 8 columns ---- - - - - diff --git a/docs/blocks/preview/raw/stats.md b/docs/blocks/preview/raw/stats.md deleted file mode 100644 index 3b68f6f2..00000000 --- a/docs/blocks/preview/raw/stats.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Stats ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/cards.md b/docs/templates/block-templates/preview/raw/cards.md deleted file mode 100644 index 3d34464b..00000000 --- a/docs/templates/block-templates/preview/raw/cards.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Cards ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/cta.md b/docs/templates/block-templates/preview/raw/cta.md deleted file mode 100644 index ff7df237..00000000 --- a/docs/templates/block-templates/preview/raw/cta.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Call to action ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/feature.md b/docs/templates/block-templates/preview/raw/feature.md deleted file mode 100644 index d30e7144..00000000 --- a/docs/templates/block-templates/preview/raw/feature.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Feature ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/filter.md b/docs/templates/block-templates/preview/raw/filter.md deleted file mode 100644 index c93ab207..00000000 --- a/docs/templates/block-templates/preview/raw/filter.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Filter ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-all-types.md b/docs/templates/block-templates/preview/raw/form-all-types.md deleted file mode 100644 index 0cbdb908..00000000 --- a/docs/templates/block-templates/preview/raw/form-all-types.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: All types ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-basic-center.md b/docs/templates/block-templates/preview/raw/form-basic-center.md deleted file mode 100644 index e9e42df4..00000000 --- a/docs/templates/block-templates/preview/raw/form-basic-center.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic center ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-basic-left.md b/docs/templates/block-templates/preview/raw/form-basic-left.md deleted file mode 100644 index e5c8af65..00000000 --- a/docs/templates/block-templates/preview/raw/form-basic-left.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic left ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-basic-right.md b/docs/templates/block-templates/preview/raw/form-basic-right.md deleted file mode 100644 index adaf52f6..00000000 --- a/docs/templates/block-templates/preview/raw/form-basic-right.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Basic right ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-fields-checkbox.md b/docs/templates/block-templates/preview/raw/form-fields-checkbox.md deleted file mode 100644 index 85f18adb..00000000 --- a/docs/templates/block-templates/preview/raw/form-fields-checkbox.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form fields checkbox ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-fields-dates-quantities.md b/docs/templates/block-templates/preview/raw/form-fields-dates-quantities.md deleted file mode 100644 index 5aa75603..00000000 --- a/docs/templates/block-templates/preview/raw/form-fields-dates-quantities.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form fields dates quantities ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-fields-file-upload.md b/docs/templates/block-templates/preview/raw/form-fields-file-upload.md deleted file mode 100644 index 625c21e9..00000000 --- a/docs/templates/block-templates/preview/raw/form-fields-file-upload.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form fields file upload ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-fields-radio.md b/docs/templates/block-templates/preview/raw/form-fields-radio.md deleted file mode 100644 index 7857b806..00000000 --- a/docs/templates/block-templates/preview/raw/form-fields-radio.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form fields radio ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-fields-selects.md b/docs/templates/block-templates/preview/raw/form-fields-selects.md deleted file mode 100644 index 8bf6dcef..00000000 --- a/docs/templates/block-templates/preview/raw/form-fields-selects.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form fields selects ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-fields-textarea.md b/docs/templates/block-templates/preview/raw/form-fields-textarea.md deleted file mode 100644 index bd98fe34..00000000 --- a/docs/templates/block-templates/preview/raw/form-fields-textarea.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form fields textarea ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-full-width-only.md b/docs/templates/block-templates/preview/raw/form-full-width-only.md deleted file mode 100644 index 090f1aa5..00000000 --- a/docs/templates/block-templates/preview/raw/form-full-width-only.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Full-width only ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-multi-step.md b/docs/templates/block-templates/preview/raw/form-multi-step.md deleted file mode 100644 index e422f40c..00000000 --- a/docs/templates/block-templates/preview/raw/form-multi-step.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form multi-step ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-paired-only.md b/docs/templates/block-templates/preview/raw/form-paired-only.md deleted file mode 100644 index 05e7da33..00000000 --- a/docs/templates/block-templates/preview/raw/form-paired-only.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Paired only ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-sections-single.md b/docs/templates/block-templates/preview/raw/form-sections-single.md deleted file mode 100644 index 71b10140..00000000 --- a/docs/templates/block-templates/preview/raw/form-sections-single.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Sections single ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-sections-three.md b/docs/templates/block-templates/preview/raw/form-sections-three.md deleted file mode 100644 index 433181b2..00000000 --- a/docs/templates/block-templates/preview/raw/form-sections-three.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Sections three ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form-sections-two.md b/docs/templates/block-templates/preview/raw/form-sections-two.md deleted file mode 100644 index dd51ab18..00000000 --- a/docs/templates/block-templates/preview/raw/form-sections-two.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Sections two ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/form.md b/docs/templates/block-templates/preview/raw/form.md deleted file mode 100644 index 7baf2506..00000000 --- a/docs/templates/block-templates/preview/raw/form.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/header.md b/docs/templates/block-templates/preview/raw/header.md deleted file mode 100644 index f1b3a3de..00000000 --- a/docs/templates/block-templates/preview/raw/header.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Page header ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/hero.md b/docs/templates/block-templates/preview/raw/hero.md deleted file mode 100644 index c6fb4197..00000000 --- a/docs/templates/block-templates/preview/raw/hero.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Hero ---- - - - - diff --git a/docs/templates/block-templates/preview/raw/stats.md b/docs/templates/block-templates/preview/raw/stats.md deleted file mode 100644 index f4c39dbb..00000000 --- a/docs/templates/block-templates/preview/raw/stats.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Stats ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/about-us.md b/docs/templates/page-templates/preview/raw/about-us.md deleted file mode 100644 index 8155afde..00000000 --- a/docs/templates/page-templates/preview/raw/about-us.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: About us ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/application-management.md b/docs/templates/page-templates/preview/raw/application-management.md deleted file mode 100644 index d29e4034..00000000 --- a/docs/templates/page-templates/preview/raw/application-management.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Application management ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/blog.md b/docs/templates/page-templates/preview/raw/blog.md deleted file mode 100644 index a1322942..00000000 --- a/docs/templates/page-templates/preview/raw/blog.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Blog ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/catalogue.md b/docs/templates/page-templates/preview/raw/catalogue.md deleted file mode 100644 index e8959fed..00000000 --- a/docs/templates/page-templates/preview/raw/catalogue.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Catalogue ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/form-page.md b/docs/templates/page-templates/preview/raw/form-page.md deleted file mode 100644 index 782d40f9..00000000 --- a/docs/templates/page-templates/preview/raw/form-page.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Form page ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/landing.md b/docs/templates/page-templates/preview/raw/landing.md deleted file mode 100644 index c56af50b..00000000 --- a/docs/templates/page-templates/preview/raw/landing.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Landing page ---- - - - - diff --git a/docs/templates/page-templates/preview/raw/multi-step-form.md b/docs/templates/page-templates/preview/raw/multi-step-form.md deleted file mode 100644 index dfaa30bb..00000000 --- a/docs/templates/page-templates/preview/raw/multi-step-form.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: bare -title: Multi-step form ---- - - - -