Explorar o código

fix desktop menu:

Ben Dwyer %!s(int64=4) %!d(string=hai) anos
pai
achega
f0f2345eae

+ 40 - 27
spearhead/assets/sass/_header.scss

@@ -1,16 +1,16 @@
 $admin-bar-height: 46px;
 $site-branding-height: 68px;
 
-.has-main-navigation {
+.has-main-navigation { // to override seedlet
 	.site-header {
-		padding: 0;
+		padding: var(--global--spacing-vertical) 0;
 
-		a {
-			border-bottom: 1px solid transparent;
+		@include media( laptop ){
+			padding: var(--global--spacing-vertical) var(--global--spacing-horizontal);
 		}
 
-		@include media( laptop ){
-			padding: 35px var(--global--spacing-horizontal);
+		a {
+			border-bottom: 1px solid transparent;
 		}
 
 		@include media( laptop-only ){
@@ -30,11 +30,19 @@ $site-branding-height: 68px;
 }
 
 .site-header {
+	display: grid;
+	grid-template-areas:
+		"site-logo site-logo site-logo"
+		"branding branding primary-navigation";
+	grid-template-columns: 0.5fr 1fr 0.5fr;
+	grid-template-rows: auto;
+	grid-column-gap: 16px;
 	max-width: var(--responsive--alignfull-width);
-	padding: var(--global--spacing-horizontal);
 
 	@include media( laptop ){
-		padding: 35px var(--global--spacing-horizontal);
+		grid-template-areas:
+			"site-logo site-logo site-logo"
+			"branding primary-navigation primary-navigation";
 	}
 
 	.site-branding {
@@ -44,6 +52,10 @@ $site-branding-height: 68px;
 		justify-self: flex-start;
 		align-self: center;
 
+		@include media( laptop ){
+			padding: 0;
+		}
+
 		.site-logo {
 			margin-left: 0;
 			margin-top: 0;
@@ -62,6 +74,14 @@ $site-branding-height: 68px;
 	.site-logo {
 		grid-area: site-logo;
 		margin: 0;
+
+		a {
+			display: block;
+
+			&:hover {
+				border-color: transparent;
+			}
+		}
 	}
 
 	.primary-navigation-wrapper {
@@ -167,20 +187,28 @@ $site-branding-height: 68px;
 
 .has-title-and-tagline {
 	.site-logo {
-		padding-top: var(--global--spacing-horizontal);
 		margin: 0;
+
+		@include media( laptop ){
+			padding-bottom: var(--global--spacing-vertical);
+		}
 	}
 	.site-branding {
 		align-self: flex-start;
 	}
 }
 
-.primary-navigation-open .has-title-and-tagline .site-logo {
-	display: none;
+.primary-navigation-open {
+	.site-header {
+		padding-top: 0;
+	}
+
+	.has-title-and-tagline .site-logo {
+		display: none;
+	}
 }
 
 .site-header div.menu-button-container {
-
 	button#primary-open-menu {
 		padding: var(--global--spacing-horizontal);
 		margin-top: 0;
@@ -198,18 +226,3 @@ $site-branding-height: 68px;
 		margin: 0;
 	}
 }
-
-.site-header {
-	display: grid;
-	grid-template-areas:
-		"site-logo site-logo site-logo"
-		"branding branding primary-navigation";
-	grid-template-columns: 0.5fr 1fr 0.5fr;
-	grid-template-rows: minmax(min-content, max-content);
-	grid-column-gap: 16px;
-}
-
-.navigation-wrapper {
-	grid-area: primary-navigation;
-	margin: 0;
-}

+ 10 - 0
spearhead/assets/sass/_woocommerce.scss

@@ -20,6 +20,10 @@ body[class*="woocommerce"] #page {
 			}
 		}
 	}
+
+	.woo-navigation .woocommerce-cart-widget {
+		max-width: 100%;
+	}
 }
 
 #woocommerce-wrapper {
@@ -31,3 +35,9 @@ body[class*="woocommerce"] #page {
 		}
 	}
 }
+
+@include media( laptop ){
+	.woo-navigation {
+		padding-top: var(--global--spacing-vertical);
+	}
+}

+ 5 - 11
spearhead/assets/sass/navigation.scss

@@ -9,9 +9,13 @@ $navigation-max-break-point: 'laptop-only';
 
 @import "../../../seedlet/assets/sass/components/navigation/style";
 
+.navigation-wrapper {
+	grid-area: primary-navigation;
+	margin: 0;
+}
+
 .primary-navigation,
 .woo-navigation {
-
 	// Top-level Menu Item
 	.primary-menu-container > ul > .menu-item {
 		padding: 0;
@@ -51,7 +55,6 @@ $navigation-max-break-point: 'laptop-only';
 	}
 }
 
-
 $header-height: 80px;
 div.extra-navigation-wrapper {
 	@include media( $navigation-max-break-point ) {
@@ -101,15 +104,6 @@ div.extra-navigation-wrapper {
 	}
 }
 
-/*.has-logo.has-title-and-tagline .menu-button-container {
-	top: calc( var(--branding--logo--max-height) + var(--global--spacing-vertical) );
-
-	.admin-bar & {
-		top: calc( var(--wpadmin-bar--height) + var(--branding--logo--max-height) + var(--global--spacing-vertical) );
-	}
-}
-*/
-
 .social-navigation {
 	grid-area: navigation;
 }

+ 5 - 8
spearhead/navigation-rtl.css

@@ -529,6 +529,11 @@
 	}
 }
 
+.navigation-wrapper {
+	grid-area: primary-navigation;
+	margin: 0;
+}
+
 .primary-navigation .primary-menu-container > ul > .menu-item,
 .woo-navigation .primary-menu-container > ul > .menu-item {
 	padding: 0;
@@ -613,14 +618,6 @@
 	top: unset;
 }
 
-/*.has-logo.has-title-and-tagline .menu-button-container {
-	top: calc( var(--branding--logo--max-height) + var(--global--spacing-vertical) );
-
-	.admin-bar & {
-		top: calc( var(--wpadmin-bar--height) + var(--branding--logo--max-height) + var(--global--spacing-vertical) );
-	}
-}
-*/
 .social-navigation {
 	grid-area: navigation;
 }

+ 5 - 8
spearhead/navigation.css

@@ -529,6 +529,11 @@
 	}
 }
 
+.navigation-wrapper {
+	grid-area: primary-navigation;
+	margin: 0;
+}
+
 .primary-navigation .primary-menu-container > ul > .menu-item,
 .woo-navigation .primary-menu-container > ul > .menu-item {
 	padding: 0;
@@ -613,14 +618,6 @@
 	top: unset;
 }
 
-/*.has-logo.has-title-and-tagline .menu-button-container {
-	top: calc( var(--branding--logo--max-height) + var(--global--spacing-vertical) );
-
-	.admin-bar & {
-		top: calc( var(--wpadmin-bar--height) + var(--branding--logo--max-height) + var(--global--spacing-vertical) );
-	}
-}
-*/
 .social-navigation {
 	grid-area: navigation;
 }

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 0 - 0
spearhead/navigation.css.map


+ 46 - 22
spearhead/style-rtl.css

@@ -214,19 +214,19 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .has-main-navigation .site-header {
-	padding: 0;
-}
-
-.has-main-navigation .site-header a {
-	border-bottom: 1px solid transparent;
+	padding: var(--global--spacing-vertical) 0;
 }
 
 @media only screen and (min-width: 830px) {
 	.has-main-navigation .site-header {
-		padding: 35px var(--global--spacing-horizontal);
+		padding: var(--global--spacing-vertical) var(--global--spacing-horizontal);
 	}
 }
 
+.has-main-navigation .site-header a {
+	border-bottom: 1px solid transparent;
+}
+
 @media only screen and (max-width: 829px) {
 	.has-main-navigation .site-header .site-title {
 		margin: 0;
@@ -241,13 +241,17 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .site-header {
+	display: grid;
+	grid-template-areas: "site-logo site-logo site-logo" "branding branding primary-navigation";
+	grid-template-columns: 0.5fr 1fr 0.5fr;
+	grid-template-rows: auto;
+	grid-column-gap: 16px;
 	max-width: var(--responsive--alignfull-width);
-	padding: var(--global--spacing-horizontal);
 }
 
 @media only screen and (min-width: 830px) {
 	.site-header {
-		padding: 35px var(--global--spacing-horizontal);
+		grid-template-areas: "site-logo site-logo site-logo" "branding primary-navigation primary-navigation";
 	}
 }
 
@@ -259,6 +263,12 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 	align-self: center;
 }
 
+@media only screen and (min-width: 830px) {
+	.site-header .site-branding {
+		padding: 0;
+	}
+}
+
 .site-header .site-branding .site-logo {
 	margin-right: 0;
 	margin-top: 0;
@@ -278,6 +288,14 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 	margin: 0;
 }
 
+.site-header .site-logo a {
+	display: block;
+}
+
+.site-header .site-logo a:hover {
+	border-color: transparent;
+}
+
 .site-header .primary-navigation-wrapper {
 	margin-bottom: 6px;
 }
@@ -375,14 +393,23 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .has-title-and-tagline .site-logo {
-	padding-top: var(--global--spacing-horizontal);
 	margin: 0;
 }
 
+@media only screen and (min-width: 830px) {
+	.has-title-and-tagline .site-logo {
+		padding-bottom: var(--global--spacing-vertical);
+	}
+}
+
 .has-title-and-tagline .site-branding {
 	align-self: flex-start;
 }
 
+.primary-navigation-open .site-header {
+	padding-top: 0;
+}
+
 .primary-navigation-open .has-title-and-tagline .site-logo {
 	display: none;
 }
@@ -405,19 +432,6 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 	margin: 0;
 }
 
-.site-header {
-	display: grid;
-	grid-template-areas: "site-logo site-logo site-logo" "branding branding primary-navigation";
-	grid-template-columns: 0.5fr 1fr 0.5fr;
-	grid-template-rows: minmax(min-content, max-content);
-	grid-column-gap: 16px;
-}
-
-.navigation-wrapper {
-	grid-area: primary-navigation;
-	margin: 0;
-}
-
 .site-footer > .site-info {
 	font-family: var(--global--font-secondary);
 }
@@ -826,6 +840,16 @@ body[class*="woocommerce"] #page span.onsale {
 	}
 }
 
+body[class*="woocommerce"] #page .woo-navigation .woocommerce-cart-widget {
+	max-width: 100%;
+}
+
 #woocommerce-wrapper ul.products li.product .price {
 	color: var(--global--color-foreground);
+}
+
+@media only screen and (min-width: 830px) {
+	.woo-navigation {
+		padding-top: var(--global--spacing-vertical);
+	}
 }

+ 46 - 22
spearhead/style.css

@@ -214,19 +214,19 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .has-main-navigation .site-header {
-	padding: 0;
-}
-
-.has-main-navigation .site-header a {
-	border-bottom: 1px solid transparent;
+	padding: var(--global--spacing-vertical) 0;
 }
 
 @media only screen and (min-width: 830px) {
 	.has-main-navigation .site-header {
-		padding: 35px var(--global--spacing-horizontal);
+		padding: var(--global--spacing-vertical) var(--global--spacing-horizontal);
 	}
 }
 
+.has-main-navigation .site-header a {
+	border-bottom: 1px solid transparent;
+}
+
 @media only screen and (max-width: 829px) {
 	.has-main-navigation .site-header .site-title {
 		margin: 0;
@@ -241,13 +241,17 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .site-header {
+	display: grid;
+	grid-template-areas: "site-logo site-logo site-logo" "branding branding primary-navigation";
+	grid-template-columns: 0.5fr 1fr 0.5fr;
+	grid-template-rows: auto;
+	grid-column-gap: 16px;
 	max-width: var(--responsive--alignfull-width);
-	padding: var(--global--spacing-horizontal);
 }
 
 @media only screen and (min-width: 830px) {
 	.site-header {
-		padding: 35px var(--global--spacing-horizontal);
+		grid-template-areas: "site-logo site-logo site-logo" "branding primary-navigation primary-navigation";
 	}
 }
 
@@ -259,6 +263,12 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 	align-self: center;
 }
 
+@media only screen and (min-width: 830px) {
+	.site-header .site-branding {
+		padding: 0;
+	}
+}
+
 .site-header .site-branding .site-logo {
 	margin-left: 0;
 	margin-top: 0;
@@ -278,6 +288,14 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 	margin: 0;
 }
 
+.site-header .site-logo a {
+	display: block;
+}
+
+.site-header .site-logo a:hover {
+	border-color: transparent;
+}
+
 .site-header .primary-navigation-wrapper {
 	margin-bottom: 6px;
 }
@@ -375,14 +393,23 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 }
 
 .has-title-and-tagline .site-logo {
-	padding-top: var(--global--spacing-horizontal);
 	margin: 0;
 }
 
+@media only screen and (min-width: 830px) {
+	.has-title-and-tagline .site-logo {
+		padding-bottom: var(--global--spacing-vertical);
+	}
+}
+
 .has-title-and-tagline .site-branding {
 	align-self: flex-start;
 }
 
+.primary-navigation-open .site-header {
+	padding-top: 0;
+}
+
 .primary-navigation-open .has-title-and-tagline .site-logo {
 	display: none;
 }
@@ -405,19 +432,6 @@ Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-me
 	margin: 0;
 }
 
-.site-header {
-	display: grid;
-	grid-template-areas: "site-logo site-logo site-logo" "branding branding primary-navigation";
-	grid-template-columns: 0.5fr 1fr 0.5fr;
-	grid-template-rows: minmax(min-content, max-content);
-	grid-column-gap: 16px;
-}
-
-.navigation-wrapper {
-	grid-area: primary-navigation;
-	margin: 0;
-}
-
 .site-footer > .site-info {
 	font-family: var(--global--font-secondary);
 }
@@ -826,8 +840,18 @@ body[class*="woocommerce"] #page span.onsale {
 	}
 }
 
+body[class*="woocommerce"] #page .woo-navigation .woocommerce-cart-widget {
+	max-width: 100%;
+}
+
 #woocommerce-wrapper ul.products li.product .price {
 	color: var(--global--color-foreground);
 }
 
+@media only screen and (min-width: 830px) {
+	.woo-navigation {
+		padding-top: var(--global--spacing-vertical);
+	}
+}
+
 /*# sourceMappingURL=style.css.map */

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 0 - 0
spearhead/style.css.map


+ 1 - 1
spearhead/template-parts/header/navigation.php

@@ -88,4 +88,4 @@
 			</button>
 		<?php endif; ?>
 	</div>
-</div>
+</div>

Algúns arquivos non se mostraron porque demasiados arquivos cambiaron neste cambio