From b3df9ddd80a8e0f309c7185742d2e22dea492819 Mon Sep 17 00:00:00 2001 From: vpolessky Date: Tue, 11 Aug 2026 15:01:50 +0200 Subject: [PATCH] patch(design-system): switch heading typography to the Poppins font across the type scale and load Poppins via the Google Fonts loader [AR-77582] --- .changeset/poppins-heading-font.md | 6 ++++++ packages/design-system/src/styles/_root.scss | 2 +- packages/design-system/src/styles/_typography.scss | 1 + .../src/__tests__/__snapshots__/index.test.ts.snap | 2 ++ packages/vite-plugin/src/index.ts | 1 + 5 files changed, 11 insertions(+), 1 deletion(-) create mode 100644 .changeset/poppins-heading-font.md diff --git a/.changeset/poppins-heading-font.md b/.changeset/poppins-heading-font.md new file mode 100644 index 000000000..f7bb91569 --- /dev/null +++ b/.changeset/poppins-heading-font.md @@ -0,0 +1,6 @@ +--- +'@drivenets/design-system': patch +'@drivenets/vite-plugin-design-system': patch +--- + +Switch heading typography to the Poppins font across the type scale and load Poppins via the Google Fonts loader diff --git a/packages/design-system/src/styles/_root.scss b/packages/design-system/src/styles/_root.scss index e160baf5b..b14317ac5 100644 --- a/packages/design-system/src/styles/_root.scss +++ b/packages/design-system/src/styles/_root.scss @@ -473,5 +473,5 @@ /* string */ --font-family-base: Roboto; --font-family-code: Fira Mono; - --font-family-heading: Roboto; + --font-family-heading: Poppins; } diff --git a/packages/design-system/src/styles/_typography.scss b/packages/design-system/src/styles/_typography.scss index 7b0f4455c..92395eed3 100644 --- a/packages/design-system/src/styles/_typography.scss +++ b/packages/design-system/src/styles/_typography.scss @@ -164,6 +164,7 @@ @mixin heading($font-weight: var(--heading-font-size-3xl), $line-height: var(--heading-line-height-3xl)) { @include font-base; + font-family: var(--font-family-heading); font-size: $font-weight; font-weight: var(--font-weight-semi-bold); line-height: $line-height; diff --git a/packages/vite-plugin/src/__tests__/__snapshots__/index.test.ts.snap b/packages/vite-plugin/src/__tests__/__snapshots__/index.test.ts.snap index 5282e5771..570bd1d3b 100644 --- a/packages/vite-plugin/src/__tests__/__snapshots__/index.test.ts.snap +++ b/packages/vite-plugin/src/__tests__/__snapshots__/index.test.ts.snap @@ -7,6 +7,8 @@ exports[`vite-plugin-design-system > should inject fonts into index.html 1`] = ` + + diff --git a/packages/vite-plugin/src/index.ts b/packages/vite-plugin/src/index.ts index 1a6852cb2..a2f3ef2aa 100644 --- a/packages/vite-plugin/src/index.ts +++ b/packages/vite-plugin/src/index.ts @@ -4,6 +4,7 @@ export const fontPreconnectURLs = ['https://fonts.googleapis.com', 'https://font export const fontStylesheetURLs = [ 'https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,600;0,700;0,900;1,100;1,300;1,400;1,500;1,600;1,700;1,900&display=swap', + 'https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap', 'https://fonts.googleapis.com/css2?family=Fira+Mono:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap', 'https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20,400,0..1,0&display=block', 'https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20,400,0..1,0&display=block',