feat(TitleBlockZen): update title font to match composable header

cultureamp · Jun 18, 2024 · 9b8e5f4 · 9b8e5f4
1 parent c736f4d
commit 9b8e5f4
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/.changeset/fresh-parents-cough.md b/.changeset/fresh-parents-cough.md
@@ -0,0 +1,5 @@
+---
+"@kaizen/draft-title-block-zen": minor
+---
+
+Update TitleBlockZen title font to match composable header.
diff --git a/draft-packages/title-block-zen/KaizenDraft/TitleBlockZen/TitleBlockZen.module.scss b/draft-packages/title-block-zen/KaizenDraft/TitleBlockZen/TitleBlockZen.module.scss
@@ -168,19 +168,18 @@ $tab-container-height-medium-and-small-collapsed: 0;
 }
 
 .titleTextOverride.titleTextOverride {
+  // Match the composable header styles
+  font-family: $typography-display-0-font-family;
+  font-weight: 500;
   padding: 4px 0;
 
   @media (max-width: $breadcrumb-breakpoint-width) {
-    font-family: $typography-heading-2-font-family;
-    font-weight: $typography-heading-2-font-weight;
     font-size: $typography-heading-2-font-size;
     line-height: $typography-heading-2-line-height;
     letter-spacing: $typography-heading-2-letter-spacing;
   }
 
   @include title-block-under-1366 {
-    font-family: $typography-heading-2-font-family;
-    font-weight: $typography-heading-2-font-weight;
     font-size: $typography-heading-2-font-size;
     line-height: $typography-heading-2-line-height;
     letter-spacing: $typography-heading-2-letter-spacing;
@@ -189,8 +188,6 @@ $tab-container-height-medium-and-small-collapsed: 0;
 
   .hasLongTitle & {
     @include title-block-under-1366 {
-      font-family: $typography-heading-3-font-family;
-      font-weight: $typography-heading-3-font-weight;
       font-size: $typography-heading-3-font-size;
       line-height: $typography-heading-3-line-height;
       letter-spacing: $typography-heading-3-letter-spacing;
@@ -201,8 +198,6 @@ $tab-container-height-medium-and-small-collapsed: 0;
   &,
   .hasLongTitle & {
     @include title-block-medium-and-small {
-      font-family: $typography-heading-4-font-family;
-      font-weight: $typography-heading-4-font-weight;
       font-size: $typography-heading-4-font-size;
       line-height: $typography-heading-4-line-height;
       letter-spacing: $typography-heading-4-letter-spacing;