Fix merge conflicts

digitoimistodude · Oct 25, 2024 · 73619cd · 73619cd
2 parents 2195caf + 1eba8a1
commit 73619cd
Show file tree

Hide file tree

Showing 43 changed files with 310 additions and 164 deletions.
diff --git a/sass/base/_accessibility.scss b/sass/base/_accessibility.scss
@@ -33,7 +33,7 @@
     clip-path: none;
     display: block;
     font-size: 1.7rem;
-    font-weight: var(--font-weight-bold);
+    font-weight: var(--typography-weight-bold);
     height: auto;
     left: .5rem;
     line-height: normal;

diff --git a/sass/components/_button-size-large.scss b/sass/components/_button-size-large.scss
@@ -1,6 +1,6 @@
 // stylelint-disable number-max-precision, rem-over-px/rem-over-px
 @mixin button-size-large() {
-  font-size: var(--font-size-18);
+  font-size: var(--typography-size-18);
   line-height: 1.66;
   padding-bottom: calc(17px - calc(var(--border-width-input-field) * 2));
   padding-left: calc(21px - calc(var(--border-width-input-field) * 2));

diff --git a/sass/components/_button-size-small.scss b/sass/components/_button-size-small.scss
@@ -1,6 +1,6 @@
 // stylelint-disable number-max-precision, rem-over-px/rem-over-px
 @mixin button-size-small() {
-  font-size: var(--font-size-16);
+  font-size: var(--typography-size-16);
   line-height: 20.9091px;
   padding-bottom: calc(10px - calc(var(--border-width-input-field) * 2));
   padding-left: calc(21px - calc(var(--border-width-input-field) * 2));

diff --git a/sass/components/_button.scss b/sass/components/_button.scss
@@ -8,8 +8,8 @@
   cursor: pointer;
   display: inline-block;
   font-family: var(--font-paragraph);
-  font-size: var(--font-size-16);
-  font-weight: var(--font-weight-semibold);
+  font-size: var(--typography-size-16);
+  font-weight: var(--typography-weight-semibold);
   line-height: 1.39;
   margin-bottom: 0;
   max-width: 23rem;

diff --git a/sass/features/_gravity-forms.scss b/sass/features/_gravity-forms.scss
@@ -6,8 +6,8 @@
 div.validation_error {
   background-color: var(--color-error);
   color: var(--color-white);
-  font-size: var(--font-size-17);
-  font-weight: var(--font-weight-bold);
+  font-size: var(--typography-size-17);
+  font-weight: var(--typography-weight-bold);
   margin-bottom: var(--form-row-gap);
   padding: 2rem;
 
@@ -22,8 +22,8 @@ body *[aria-invalid="true"] {
 
 .validation_message {
   color: var(--color-error);
-  font-size: var(--font-size-16);
-  font-weight: var(--font-weight-regular);
+  font-size: var(--typography-size-16);
+  font-weight: var(--typography-weight-regular);
 }
 
 .validation_list {
@@ -39,7 +39,7 @@ body *[aria-invalid="true"] {
 
   li {
     color: var(--color-error);
-    font-weight: var(--font-weight-bold);
+    font-weight: var(--typography-weight-bold);
   }
 }
 
@@ -51,7 +51,7 @@ body *[aria-invalid="true"] {
 
 // Default required label
 .gfield_required.gfield_required_asterisk {
-  font-size: var(--font-size-required-asterisk-label);
+  font-size: var(--typography-size-required-asterisk-label);
 }
 
 .gfield_required.gfield_required_asterisk,
@@ -60,7 +60,7 @@ body *[aria-invalid="true"] {
 }
 
 .gfield_required.gfield_required_text {
-  font-size: var(--font-size-required-text-label);
+  font-size: var(--typography-size-required-text-label);
 }
 
 // Gravity forms minimal default styles
@@ -188,7 +188,7 @@ body *[aria-invalid="true"] {
   background-color: transparent;
   border: 2px solid var(--color-success);
   color: var(--color-success);
-  font-size: var(--font-size-paragraph);
-  font-weight: var(--font-weight-semibold);
+  font-size: var(--typography-size-paragraph);
+  font-weight: var(--typography-weight-semibold);
   padding: 2rem;
 }
diff --git a/sass/features/_pagination.scss b/sass/features/_pagination.scss
@@ -32,7 +32,7 @@
   border-top: 2px solid var(--color-blue-chalk);
   color: var(--color-pagination-text);
   display: flex;
-  font-weight: var(--font-weight-medium);
+  font-weight: var(--typography-weight-medium);
   height: 3.5rem;
   justify-content: center;
   margin-left: 0;

diff --git a/sass/features/_top.scss b/sass/features/_top.scss
@@ -4,16 +4,16 @@
   --color-background-top-hover: #f0f0f0;
   background-color: var(--color-background-top);
   border-radius: 2px;
-  bottom: var(--padding-container-horizontal);
+  bottom: var(--spacing-container-padding-inline);
   color: var(--color-black);
   cursor: pointer;
-  font-size: var(--font-size-16);
+  font-size: var(--typography-size-16);
   height: 3rem;
   // stylelint-disable-next-line rem-over-px/rem-over-px
   line-height: 30px;
   opacity: 0;
   position: fixed;
-  right: var(--padding-container-horizontal);
+  right: var(--spacing-container-padding-inline);
   text-align: center;
   text-decoration: none;
   transition: 500ms opacity;

diff --git a/sass/global.scss b/sass/global.scss
@@ -17,7 +17,7 @@
 @import 'variables/breakpoints';
 @import 'variables/font-face';
 @import 'variables/font-family';
-@import 'variables/font-size';
+@import 'variables/typography-size';
 @import 'variables/forms';
 @import 'variables/spacings';
 

diff --git a/sass/gutenberg-editor-styles.scss b/sass/gutenberg-editor-styles.scss
@@ -17,7 +17,7 @@
 @import 'variables/colors';
 @import 'variables/breakpoints';
 @import 'variables/font-family';
-@import 'variables/font-size';
+@import 'variables/typography-size';
 @import 'variables/forms';
 @import 'variables/spacings';
 

diff --git a/sass/gutenberg/_editor.scss b/sass/gutenberg/_editor.scss
@@ -81,8 +81,8 @@
   .wp-block-gallery,
   .wp-block.editor-post-title {
     @media (max-width: $width-max-article + 40px) {
-      padding-left: var(--padding-container-horizontal);
-      padding-right: var(--padding-container-horizontal);
+      padding-left: var(--spacing-container-padding-inline);
+      padding-right: var(--spacing-container-padding-inline);
       width: 100%;
 
       &.alignleft,
@@ -103,12 +103,12 @@
 
   // Full width gallery should be always be with paddings
   .wp-block[data-align="full"] > .wp-block-gallery {
-    padding-left: var(--padding-container-horizontal);
-    padding-right: var(--padding-container-horizontal);
+    padding-left: var(--spacing-container-padding-inline);
+    padding-right: var(--spacing-container-padding-inline);
 
     &.alignfull {
-      padding-left: var(--padding-container-horizontal);
-      padding-right: var(--padding-container-horizontal);
+      padding-left: var(--spacing-container-padding-inline);
+      padding-right: var(--spacing-container-padding-inline);
     }
   }
 

diff --git a/sass/gutenberg/blocks/_boxed.scss b/sass/gutenberg/blocks/_boxed.scss
@@ -3,10 +3,10 @@
 .is-style-boxed {
   border: 2px solid var(--color-paragraph);
   color: var(--color-paragraph);
-  font-size: var(--font-size-17);
+  font-size: var(--typography-size-17);
   font-style: normal;
-  font-weight: var(--font-weight-medium);
-  line-height: var(--line-height-paragraph);
+  font-weight: var(--typography-weight-medium);
+  line-height: var(--typography-paragraph-line-height);
   padding: 2rem;
   width: calc(100% - 4rem);
 }

diff --git a/sass/gutenberg/blocks/_core-blockquote.scss b/sass/gutenberg/blocks/_core-blockquote.scss
@@ -14,7 +14,7 @@ blockquote {
   p {
     color: var(--color-paragraph);
     font-style: normal;
-    font-weight: var(--font-weight-semibold);
+    font-weight: var(--typography-weight-semibold);
     margin-bottom: 0;
     overflow: visible;
     position: relative;
@@ -28,7 +28,7 @@ blockquote {
 
 .wp-block-quote {
   border-left: 2px solid var(--color-paragraph);
-  line-height: var(--line-height-paragraph);
+  line-height: var(--typography-paragraph-line-height);
   margin-bottom: 4rem;
   margin-left: auto;
   margin-right: auto;
@@ -38,12 +38,12 @@ blockquote {
 
   > p {
     color: var(--color-paragraph);
-    line-height: var(--line-height-paragraph);
+    line-height: var(--typography-paragraph-line-height);
   }
 
   @media (max-width: $width-max-article + 40px) {
     padding: 3.5rem 2rem;
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+    width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
   }
 
   @media (max-width: $container-mobile) {
@@ -53,9 +53,9 @@ blockquote {
 
 .wp-block-blockquote.alignwide,
 .wp-block-blockquote.alignfull {
-  padding-left: var(--padding-container-horizontal);
-  padding-right: var(--padding-container-horizontal);
-  width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+  padding-left: var(--spacing-container-padding-inline);
+  padding-right: var(--spacing-container-padding-inline);
+  width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
 }
 
 .wp-block-blockquote blockquote {

diff --git a/sass/gutenberg/blocks/_core-columns.scss b/sass/gutenberg/blocks/_core-columns.scss
@@ -14,8 +14,8 @@ h3 {
 
 @for $i from 1 through 9 {
   .wp-block-columns.has-#{$i}-columns.alignfull {
-    padding-left: var(--padding-container-horizontal);
-    padding-right: var(--padding-container-horizontal);
+    padding-left: var(--spacing-container-padding-inline);
+    padding-right: var(--spacing-container-padding-inline);
     width: 100%;
   }
 

diff --git a/sass/gutenberg/blocks/_core-heading.scss b/sass/gutenberg/blocks/_core-heading.scss
@@ -6,7 +6,7 @@ h2,
 h3,
 h4,
 h5 {
-  line-height: var(--line-height-core-heading);
+  line-height: var(--typography-core-heading-line-height);
 }
 
 // Don't add extra margin on top of first title

diff --git a/sass/gutenberg/blocks/_core-image.scss b/sass/gutenberg/blocks/_core-image.scss
@@ -1,8 +1,8 @@
 // Image block
 .wp-block-image {
   display: block;
-  margin-bottom: var(--margin-wp-block-image);
-  margin-top: var(--margin-wp-block-image);
+  margin-bottom: var(--spacing-wp-block-image-margin-block);
+  margin-top: var(--spacing-wp-block-image-margin-block);
 
   &.alignwide,
   &.alignfull {
@@ -48,7 +48,7 @@
 
   @media (max-width: $width-grid-base + 40px) {
     &.alignwide {
-      width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+      width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
     }
   }
 

diff --git a/sass/gutenberg/blocks/_core-list.scss b/sass/gutenberg/blocks/_core-list.scss
@@ -2,7 +2,7 @@
 ul,
 ol {
   list-style-position: outside;
-  width: calc((100% - calc(var(--padding-container-horizontal) * 2)));
+  width: calc((100% - calc(var(--spacing-container-padding-inline) * 2)));
 }
 
 ul {

diff --git a/sass/gutenberg/blocks/_core-paragraph.scss b/sass/gutenberg/blocks/_core-paragraph.scss
@@ -1,23 +1,23 @@
 // Core/paragraph block
 .has-larger-font-size,
 .has-large-font-size {
-  line-height: var(--line-height-heading);
+  line-height: var(--typography-heading-line-height);
 }
 
 .has-large-font-size {
   @media (max-width: $container-mobile) {
-    font-size: var(--font-size-18);
+    font-size: var(--typography-size-18);
   }
 }
 
 .has-larger-font-size {
   @media (max-width: $container-mobile) {
-    font-size: var(--font-size-22);
+    font-size: var(--typography-size-22);
   }
 }
 
 @media (max-width: $width-grid-base + 40px) {
   .has-background {
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+    width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
   }
 }
diff --git a/sass/gutenberg/blocks/_core-pullquote.scss b/sass/gutenberg/blocks/_core-pullquote.scss
@@ -11,7 +11,7 @@
   }
 
   @media (max-width: $width-grid-base + 40px) {
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+    width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
   }
 }
 
@@ -25,13 +25,13 @@
   }
 
   @media (max-width: $width-grid-base + 40px) {
-    margin-left: var(--padding-container-horizontal);
-    margin-right: var(--padding-container-horizontal);
+    margin-left: var(--spacing-container-padding-inline);
+    margin-right: var(--spacing-container-padding-inline);
   }
 }
 
 .wp-block-pullquote.alignfull {
-  margin-left: var(--padding-container-horizontal);
-  margin-right: var(--padding-container-horizontal);
-  width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+  margin-left: var(--spacing-container-padding-inline);
+  margin-right: var(--spacing-container-padding-inline);
+  width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
 }
diff --git a/sass/gutenberg/blocks/_core-table.scss b/sass/gutenberg/blocks/_core-table.scss
@@ -4,7 +4,7 @@ th {
   backface-visibility: hidden;
   background-color: var(--color-scorpion);
   color: var(--color-white);
-  font-weight: var(--font-weight-bold);
+  font-weight: var(--typography-weight-bold);
   overflow: hidden;
   text-align: left;
 }
@@ -19,7 +19,7 @@ th,
 .wp-block-table th {
   border: 0;
   font-family: var(--font-paragraph);
-  font-size: var(--font-size-14);
+  font-size: var(--typography-size-14);
   height: 2rem;
   padding: .6rem 1.5rem;
 }
@@ -55,20 +55,20 @@ table {
 
 .wp-block-table {
   @media (max-width: $width-grid-base + 40px) {
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+    width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
   }
 }
 
 .wp-block-table.alignfull {
-  margin-left: var(--padding-container-horizontal);
-  margin-right: var(--padding-container-horizontal);
-  width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+  margin-left: var(--spacing-container-padding-inline);
+  margin-right: var(--spacing-container-padding-inline);
+  width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
 }
 
 @media (max-width: $width-grid-base + 40px) {
   .wp-block-table.alignwide {
-    margin-left: var(--padding-container-horizontal);
-    margin-right: var(--padding-container-horizontal);
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+    margin-left: var(--spacing-container-padding-inline);
+    margin-right: var(--spacing-container-padding-inline);
+    width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
   }
 }
diff --git a/sass/gutenberg/blocks/_core-video.scss b/sass/gutenberg/blocks/_core-video.scss
@@ -6,7 +6,7 @@
 
 @media (max-width: $width-grid-base + 40px) {
   .wp-block-video.alignwide {
-    width: calc(100% - calc(var(--padding-container-horizontal) * 2));
+    width: calc(100% - calc(var(--spacing-container-padding-inline) * 2));
   }
 }