Update font-* variable instances, T-20761

digitoimistodude · Oct 25, 2024 · ce6c372 · ce6c372
1 parent 9f7fcec
commit ce6c372
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 12 deletions.
diff --git a/sass/components/_button.scss b/sass/components/_button.scss
@@ -7,7 +7,7 @@
   color: var(--color-button);
   cursor: pointer;
   display: inline-block;
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
   font-size: var(--typography-size-16);
   font-weight: var(--typography-weight-semibold);
   line-height: 1.39;

diff --git a/sass/features/_pagination.scss b/sass/features/_pagination.scss
@@ -3,7 +3,7 @@
 .navigation:not(.post-navigation) .nav-links {
   align-items: flex-start;
   display: flex;
-  font-family: var(--font-heading);
+  font-family: var(--typography-family-heading);
   font-size: 1.4rem;
   justify-content: flex-start;
   margin-top: 4rem;

diff --git a/sass/gutenberg/_editor.scss b/sass/gutenberg/_editor.scss
@@ -134,7 +134,7 @@
 
 // Default editor blocks
 .is-root-container > .wp-block {
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
 
   // Font smoothing
   -moz-osx-font-smoothing: grayscale;
@@ -203,7 +203,7 @@
 .is-root-container .wp-block.wp-block-quote,
 .is-root-container .wp-block[data-type^="core"],
 .is-root-container [contenteditable] p {
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
 
   // Font smoothing
   -moz-osx-font-smoothing: grayscale;

diff --git a/sass/gutenberg/blocks/_core-table.scss b/sass/gutenberg/blocks/_core-table.scss
@@ -18,7 +18,7 @@ th,
 .wp-block-table td,
 .wp-block-table th {
   border: 0;
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
   font-size: var(--typography-size-14);
   height: 2rem;
   padding: .6rem 1.5rem;

diff --git a/sass/layout/_forms.scss b/sass/layout/_forms.scss
@@ -60,7 +60,7 @@ input[type="search"] {
   border-style: solid;
   border-width: var(--border-width-input-field);
   color: var(--color-form-text);
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
   font-size: var(--typography-size-input-fields);
   line-height: var(--form-line-height);
   margin-bottom: 0;
@@ -102,7 +102,7 @@ select {
   border-style: solid;
   border-width: var(--border-width-input-field);
   color: var(--color-form-text);
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
   font-size: var(--typography-size-input-fields);
   line-height: var(--form-line-height);
   max-width: 100%;

diff --git a/sass/layout/_typography.scss b/sass/layout/_typography.scss
@@ -13,7 +13,7 @@
 .acf-block-preview .block,
 body {
   color: var(--color-paragraph);
-  font-family: var(--font-paragraph);
+  font-family: var(--typography-family-paragraph);
   font-size: var(--typography-size-paragraph);
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
@@ -31,7 +31,7 @@ h4,
 h5,
 h6 {
   color: var(--color-heading);
-  font-family: var(--font-heading);
+  font-family: var(--typography-family-heading);
   font-weight: var(--typography-weight-heading);
   margin-bottom: var(--margin-between-paragraphs);
   margin-top: var(--margin-between-paragraphs);

diff --git a/sass/variables/_font-family.scss b/sass/variables/_font-family.scss
@@ -4,7 +4,7 @@
 // and then attach them to elements: --font-paragraph: var(--font-barlow)
 :root {
   // Fonts in use for content
-  --font-inter: 'Inter', -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;
-  --font-paragraph: var(--font-inter);
-  --font-heading: var(--font-inter);
+  --typography-family-inter: 'Inter', -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;
+  --typography-family-paragraph: var(--typography-family-inter);
+  --typography-family-heading: var(--typography-family-inter);
 }