Browse Source

used variables for spacing

Maggie 3 years ago
parent
commit
fe58c90821
2 changed files with 6 additions and 6 deletions
  1. 2 2
      skatepark/assets/theme.css
  2. 4 4
      skatepark/sass/templates/_header.scss

+ 2 - 2
skatepark/assets/theme.css

@@ -571,9 +571,9 @@ header.wp-block-template-part > .wp-block-group .wp-block-social-links.is-style-
 }
 
 header.wp-block-template-part .site-brand {
-	margin-top: 20px;
+	margin-top: calc( 0.5 * var(--wp--custom--margin--vertical));
 	display: grid;
-	grid-column-gap: 30px;
+	grid-column-gap: var(--wp--custom--margin--horizontal);
 	grid-template-columns: auto 1fr;
 }
 

+ 4 - 4
skatepark/sass/templates/_header.scss

@@ -10,8 +10,8 @@ header.wp-block-template-part {
 		> * {
 			flex-grow: 1; // Needed to maintain alignment when the containers stack
 			> * { // Apply a stack layout (page 69 of the every-layout.dev PDF) 
-				margin-top: calc( 0.5 * var(--wp--custom--margin--vertical));
-				margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical));
+				margin-top: calc( 0.5 * var(--wp--custom--margin--vertical) );
+				margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical) );
 			}
 		}
 
@@ -24,9 +24,9 @@ header.wp-block-template-part {
 	}
 
 	.site-brand {
-		margin-top: 20px;
+		margin-top: calc( 0.5 * var(--wp--custom--margin--vertical) );
 		display: grid;
-		grid-column-gap: 30px;
+		grid-column-gap: var(--wp--custom--margin--horizontal);
 		grid-template-columns: auto 1fr;
 		.wp-block-site-logo {
 			grid-column-start: 1;