Merge branch 'enhancement/add-wc-support' into enhancement/add-wc-support-shawburn

stratford/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "stratford",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

stratford/package.json

@@ -1,6 +1,6 @@
 {
   "name": "stratford",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "Stratford",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

stratford/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Stratford is the perfect design for your business or educational institutes online presence. Highlight your products and services, Stratford is versatile enough to be your personal blog too.
 Requires at least: WordPress 4.9.6
-Version: 1.2.1
+Version: 1.2.2
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

stratford/style-rtl.css

@@ -6,7 +6,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Stratford is the perfect design for your business or educational institutes online presence. Highlight your products and services, Stratford is versatile enough to be your personal blog too.
 Requires at least: WordPress 4.9.6
-Version: 1.2.1
+Version: 1.2.2
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia
@@ -684,9 +684,7 @@ a {
 .site-header:after,
 .site-content:after,
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }
 
 /**

stratford/style.css

@@ -6,7 +6,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Stratford is the perfect design for your business or educational institutes online presence. Highlight your products and services, Stratford is versatile enough to be your personal blog too.
 Requires at least: WordPress 4.9.6
-Version: 1.2.1
+Version: 1.2.2
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia
@@ -684,9 +684,7 @@ a {
 .site-header:after,
 .site-content:after,
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }
 
 /**

varia/sass/abstracts/_responsive-logic.scss

@@ -3,7 +3,7 @@
  */
 
 /* Responsive width-content overrides */
-$horizontal-padding: #{2 * map-deep-get($config-global, "spacing", "horizontal")};
+$horizontal-padding: (2 * map-deep-get($config-global, "spacing", "horizontal"));
 $content-width-flex: 100%;
 $content-width-sm: calc( #{map-deep-get($config-global, "breakpoint", "sm")} - #{$horizontal-padding} );
 $content-width-md: calc( #{map-deep-get($config-global, "breakpoint", "md")} - #{$horizontal-padding} );
@@ -110,6 +110,19 @@ $content-width-xxl: calc( #{map-deep-get($config-global, "breakpoint", "xxl")} -
 	}
 }
 
+%responsive-alignfull-nested {
+
+	width: 100%;
+	max-width: 100%;
+	margin-left: auto;
+	margin-right: auto;
+
+	@include media(mobile) {
+		width: calc(100% - #{2 * $horizontal-padding});
+		max-width: 100%;
+	}
+}
+
 %responsive-alignright {
 
 	/*rtl:ignore*/

varia/sass/base/_clearings.scss

@@ -21,7 +21,5 @@
 .site-header:after,
 .site-content:after,
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }

varia/sass/child-theme/_config-child-theme-woocommerce.scss

@@ -4,6 +4,9 @@
 
 $config-woocommerce: (
 
+	/* Wrapper Width - accepts full, wide, or defuault */
+	"wrapper-width": default,
+
 	/* Tables */
 	"table": (
 		/* Borders */
@@ -30,6 +33,9 @@ $config-woocommerce: (
 	"mini-cart": (
 		/* Color */
 		"color": (
+			"background": map-deep-get($config-global, "color", "background", "default"),
+			"border": map-deep-get($config-global, "color", "border", "dark"),
+			"text": map-deep-get($config-global, "color", "foreground", "default"),
 			"subtotal": map-deep-get($config-global, "color", "foreground", "default"),
 			"count": map-deep-get($config-global, "color", "foreground", "light"),
 		),
@@ -38,6 +44,7 @@ $config-woocommerce: (
 			"color": map-deep-get($config-button, "color", "text"),
 			"background-color": map-deep-get($config-button, "color", "background"),
 		),
+		"width": #{25 * map-deep-get($config-global, "spacing", "unit")},
 	),
 
 	/* Star Rating */

varia/sass/vendors/woocommerce/abstracts/_config-woocommerce.scss

@@ -4,6 +4,9 @@
 
 $config-woocommerce: (
 
+	/* Wrapper Width - accepts full, wide, or defuault */
+	"wrapper-width": default,
+
 	/* Tables */
 	"table": (
 		/* Borders */
@@ -30,6 +33,9 @@ $config-woocommerce: (
 	"mini-cart": (
 		/* Color */
 		"color": (
+			"background": map-deep-get($config-global, "color", "background", "default"),
+			"border": map-deep-get($config-global, "color", "border", "dark"),
+			"text": map-deep-get($config-global, "color", "foreground", "default"),
 			"subtotal": map-deep-get($config-global, "color", "foreground", "default"),
 			"count": map-deep-get($config-global, "color", "foreground", "light"),
 		),
@@ -38,6 +44,7 @@ $config-woocommerce: (
 			"color": map-deep-get($config-button, "color", "text"),
 			"background-color": map-deep-get($config-button, "color", "background"),
 		),
+		"width": #{25 * map-deep-get($config-global, "spacing", "unit")},
 	),
 
 	/* Star Rating */

varia/sass/vendors/woocommerce/components/_mini-cart.scss

@@ -47,6 +47,9 @@ body[class*="woocommerce"] #page { // adding #page here to override default wc s
 		}
 
 		.woocommerce-cart-widget {
+
+			background-color: map-deep-get($config-woocommerce, "mini-cart", "color", "background");
+			color: map-deep-get($config-woocommerce, "mini-cart", "color", "text");
 			max-width: 100%;
 			padding: #{0.5 * map-deep-get($config-header, "main-nav", "link-padding")} 0;
 
@@ -55,6 +58,18 @@ body[class*="woocommerce"] #page { // adding #page here to override default wc s
 				padding: #{map-deep-get($config-header, "main-nav", "link-padding")};
 			}
 
+			.woocommerce.widget_shopping_cart .cart_list {
+				border-bottom: 1px solid map-deep-get($config-woocommerce, "mini-cart", "color", "border");
+				li {
+					border-top: 1px solid map-deep-get($config-woocommerce, "mini-cart", "color", "border");
+				}
+
+				a.remove:hover,
+				a.remove:focus {
+					text-decoration: none;
+				}
+			}
+
 			.woocommerce-mini-cart__total {
 				text-align: right;
 			}
@@ -109,6 +124,25 @@ body[class*="woocommerce"] #page { // adding #page here to override default wc s
 			@include font-family( map-deep-get($config-header, "main-nav", "font", "family") );
 			font-size: #{map-deep-get($config-global, "font", "size", "base")};
 		}
+
+		@include media(mobile) {
+
+			& > div > ul > li.woocommerce-menu-item > .sub-menu {
+				left: auto;
+				right: 0;
+			}
+
+			.woocommerce-cart-widget {
+				max-width: #{map-deep-get($config-woocommerce, "mini-cart", "width")};
+			}
+
+			& > div > ul > li.woocommerce-menu-item:hover > ul:before,
+			& > div > ul > li.woocommerce-menu-item.focus > ul:before,
+			& > div > ul > li.woocommerce-menu-item.current-menu-item > ul:before {
+				margin-left: auto;
+				margin-right: #{map-deep-get($config-global, "spacing", "unit")};
+			}
+		}
 	}
 }
 

varia/sass/vendors/woocommerce/layout/_structure.scss

@@ -2,6 +2,28 @@
  * Structure
  */
 
+
+/**
+ * WooCommerce Wrapper Width
+ */
+
+body[class*="woocommerce"] #page .woocommerce:not(.widget),
+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) {
+
+	// Get wrapper width setting
+	$wc-wrapper-width: map-deep-get($config-woocommerce, "wrapper-width");
+
+	@if $wc-wrapper-width == wide {
+		@extend %responsive-alignwide-nested;
+	} @else if $wc-wrapper-width == full {
+		@extend %responsive-alignfull-nested;
+	} @else {
+		// Default width
+	}
+}
+
+
 /**
  * Vertical Space - 32px
  */

varia/style-rtl.css

@@ -802,9 +802,7 @@ a {
 .site-header:after,
 .site-content:after,
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }
 
 /**

varia/style-woocommerce-rtl.css

@@ -766,6 +766,8 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-link + .sub-
 }
 
 body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
+	background-color: white;
+	color: #444444;
 	max-width: 100%;
 	padding: 8px 0;
 }
@@ -777,6 +779,19 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
 	}
 }
 
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list {
+	border-bottom: 1px solid #AAAAAA;
+}
+
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list li {
+	border-top: 1px solid #AAAAAA;
+}
+
+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;
 }
@@ -832,6 +847,22 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-mini-cart__total
 	font-size: 1rem;
 }
 
+@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;
@@ -1154,6 +1185,9 @@ body[class*="woocommerce"] #page #reviews #comments .commentlist > li::before {
 /**
  * Structure
  */
+/**
+ * WooCommerce Wrapper Width
+ */
 /**
  * Vertical Space - 32px
  */

varia/style-woocommerce.css

@@ -766,6 +766,8 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-link + .sub-
 }
 
 body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
+	background-color: white;
+	color: #444444;
 	max-width: 100%;
 	padding: 8px 0;
 }
@@ -777,6 +779,19 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
 	}
 }
 
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list {
+	border-bottom: 1px solid #AAAAAA;
+}
+
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget .woocommerce.widget_shopping_cart .cart_list li {
+	border-top: 1px solid #AAAAAA;
+}
+
+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;
 }
@@ -832,6 +847,22 @@ body[class*="woocommerce"] #page .main-navigation .woocommerce-mini-cart__total
 	font-size: 1rem;
 }
 
+@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;
@@ -1154,6 +1185,9 @@ body[class*="woocommerce"] #page #reviews #comments .commentlist > li::before {
 /**
  * Structure
  */
+/**
+ * WooCommerce Wrapper Width
+ */
 /**
  * Vertical Space - 32px
  */

varia/style.css

@@ -802,9 +802,7 @@ a {
 .site-header:after,
 .site-content:after,
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }
 
 /**