Browse Source

Alves: Update WC mini-cart positioning.

Allan Cole 5 years ago
parent
commit
dbfb8f543a

+ 1 - 0
alves/sass/_config-child-theme-woocommerce.scss

@@ -41,6 +41,7 @@ $config-woocommerce: (
 			"color": map-deep-get($config-global, "color", "primary", "default"),
 			"background-color": map-deep-get($config-global, "color", "background", "default"),
 		),
+		"width": #{25 * map-deep-get($config-global, "spacing", "unit")},
 	),
 
 	/* Star Rating */

+ 0 - 27
alves/sass/style-child-theme-woocommerce.scss

@@ -49,30 +49,3 @@ body[class*="woocommerce"] #page #woocommerce-wrapper,
 body[class*="woocommerce"] #page .woocommerce-Tabs-panel.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment) {
 	@extend %responsive-alignwide-nested;
 }
-
-/**
- * Mini cart
- */
-
-body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li .sub-menu a.remove:hover,
-body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li .sub-menu a.remove:focus {
-	text-decoration: none;
-}
-
-@include media(mobile) {
-	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item > .sub-menu {
-		left: auto;
-		right: 0;
-	}
-
-	body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
-		max-width: 400px;
-	}
-
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item:hover > ul:before,
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item.focus > ul:before,
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item.current-menu-item > ul:before {
-		margin-left: auto;
-		margin-right: #{map-deep-get($config-global, "spacing", "unit")};
-	}
-}

+ 21 - 23
alves/style-woocommerce-rtl.css

@@ -881,6 +881,11 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .wooc
 	border-top: 1px solid #ffffff;
 }
 
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list a.remove:hover,
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list a.remove:focus {
+	text-decoration: none;
+}
+
 body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce-mini-cart__total {
 	text-align: left;
 }
@@ -936,6 +941,22 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-mini-cart__total
 	font-size: 1.25rem;
 }
 
+@media only screen and (min-width: 560px) {
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item > .sub-menu {
+		right: auto;
+		left: 0;
+	}
+	body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
+		max-width: 400px;
+	}
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item:hover > ul:before,
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item.focus > ul:before,
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item.current-menu-item > ul:before {
+		margin-right: auto;
+		margin-left: 16px;
+	}
+}
+
 .woocommerce-cart #page .woocommerce-menu-item .sub-menu,
 .woocommerce-checkout #page .woocommerce-menu-item .sub-menu {
 	display: none;
@@ -2049,26 +2070,3 @@ body[class*="woocommerce"] #page .widget_price_filter .price_slider_wrapper .ui-
 /**
  * WC Wrap
  */
-/**
- * Mini cart
- */
-body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li .sub-menu a.remove:hover,
-body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li .sub-menu a.remove:focus {
-	text-decoration: none;
-}
-
-@media only screen and (min-width: 560px) {
-	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item > .sub-menu {
-		right: auto;
-		left: 0;
-	}
-	body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
-		max-width: 400px;
-	}
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item:hover > ul:before,
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item.focus > ul:before,
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item.current-menu-item > ul:before {
-		margin-right: auto;
-		margin-left: 16px;
-	}
-}

+ 21 - 23
alves/style-woocommerce.css

@@ -881,6 +881,11 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .wooc
 	border-top: 1px solid #ffffff;
 }
 
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list a.remove:hover,
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list a.remove:focus {
+	text-decoration: none;
+}
+
 body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce-mini-cart__total {
 	text-align: right;
 }
@@ -936,6 +941,22 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-mini-cart__total
 	font-size: 1.25rem;
 }
 
+@media only screen and (min-width: 560px) {
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item > .sub-menu {
+		left: auto;
+		right: 0;
+	}
+	body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
+		max-width: 400px;
+	}
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item:hover > ul:before,
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item.focus > ul:before,
+	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item.current-menu-item > ul:before {
+		margin-left: auto;
+		margin-right: 16px;
+	}
+}
+
 .woocommerce-cart #page .woocommerce-menu-item .sub-menu,
 .woocommerce-checkout #page .woocommerce-menu-item .sub-menu {
 	display: none;
@@ -2049,26 +2070,3 @@ body[class*="woocommerce"] #page .widget_price_filter .price_slider_wrapper .ui-
 /**
  * WC Wrap
  */
-/**
- * Mini cart
- */
-body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li .sub-menu a.remove:hover,
-body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li .sub-menu a.remove:focus {
-	text-decoration: none;
-}
-
-@media only screen and (min-width: 560px) {
-	body[class*="woocommerce"] #page .main-navigation > div > ul > li.woocommerce-menu-item > .sub-menu {
-		left: auto;
-		right: 0;
-	}
-	body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
-		max-width: 400px;
-	}
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item:hover > ul:before,
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item.focus > ul:before,
-	body[class*="woocommerce"] #page .site-header .main-navigation > div > ul > li.woocommerce-menu-item.current-menu-item > ul:before {
-		margin-left: auto;
-		margin-right: 16px;
-	}
-}