Browse Source

Fix site title margins, social navigation margins, and button padding.

Jeff Ong 4 years ago
parent
commit
2347477454

+ 6 - 3
spearhead/assets/sass/_header.scss

@@ -3,9 +3,12 @@ $site-branding-height: 68px;
 
 .has-main-navigation {
 	.site-header {
-		padding: 35px var(--global--spacing-horizontal);
+		padding: var(--global--spacing-horizontal);
+		@include media( laptop ){
+			padding: 35px var(--global--spacing-horizontal);
+		}
 
-		@include media( mobile-only ){
+		@include media( laptop-only ){
 			.site-title {
 				margin: 0;
 			}
@@ -107,7 +110,7 @@ $site-branding-height: 68px;
 		ul {
 			justify-content: flex-start;
 			flex-wrap: nowrap;
-			margin-top: var(--global--spacing-vertical);
+			margin-top: var(--social-nav--padding);
 
 			li {
 				margin: 0;

+ 9 - 3
spearhead/style-rtl.css

@@ -102,10 +102,16 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .has-main-navigation .site-header {
-	padding: 35px var(--global--spacing-horizontal);
+	padding: var(--global--spacing-horizontal);
 }
 
-@media only screen and (max-width: 481px) {
+@media only screen and (min-width: 830px) {
+	.has-main-navigation .site-header {
+		padding: 35px var(--global--spacing-horizontal);
+	}
+}
+
+@media only screen and (max-width: 829px) {
 	.has-main-navigation .site-header .site-title {
 		margin: 0;
 	}
@@ -205,7 +211,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 .site-header .social-navigation ul {
 	justify-content: flex-start;
 	flex-wrap: nowrap;
-	margin-top: var(--global--spacing-vertical);
+	margin-top: var(--social-nav--padding);
 }
 
 .site-header .social-navigation ul li {

+ 9 - 3
spearhead/style.css

@@ -102,10 +102,16 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .has-main-navigation .site-header {
-	padding: 35px var(--global--spacing-horizontal);
+	padding: var(--global--spacing-horizontal);
 }
 
-@media only screen and (max-width: 481px) {
+@media only screen and (min-width: 830px) {
+	.has-main-navigation .site-header {
+		padding: 35px var(--global--spacing-horizontal);
+	}
+}
+
+@media only screen and (max-width: 829px) {
 	.has-main-navigation .site-header .site-title {
 		margin: 0;
 	}
@@ -205,7 +211,7 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 .site-header .social-navigation ul {
 	justify-content: flex-start;
 	flex-wrap: nowrap;
-	margin-top: var(--global--spacing-vertical);
+	margin-top: var(--social-nav--padding);
 }
 
 .site-header .social-navigation ul li {

File diff suppressed because it is too large
+ 0 - 0
spearhead/style.css.map


+ 2 - 0
spearhead/variables.css

@@ -52,6 +52,8 @@
 	--button--font-weight: bold;
 	--button--font-family: var(--global--font-secondary);
 	--button--font-size: var(--global--font-size-sm);
+	--button--padding-vertical: 24px;
+	--button--padding-horizontal: 28px;
 
 	--cover--color-foreground: var(--global--color-background);
 

Some files were not shown because too many files changed in this diff