Varia: Adding config file for WC, cleaning up table styles

varia/sass/abstracts/_extends.scss

@@ -1,52 +0,0 @@
-/**
- * Button Placeholder style
- * - Since buttons appear in various blocks,
- *   let’s use a placeholder to keep them all
- *   in-sync
- */
-%button-style {
-	@include crop-text(map-deep-get($config-button, "font", "line-height"));
-	color: #{map-deep-get($config-button, "color", "text")};
-	cursor: pointer;
-	font-weight: #{map-deep-get($config-button, "font", "weight")};
-	font-family: #{map-deep-get($config-button, "font", "family")};
-	font-size: #{map-deep-get($config-button, "font", "size")};
-	background-color: #{map-deep-get($config-button, "color", "background")};
-	border-radius: #{map-deep-get($config-button, "border-radius")};
-	border-width: 0;
-	padding: #{map-deep-get($config-button, "padding", "vertical")} #{map-deep-get($config-button, "padding", "horizontal")};
-
-	&:hover,
-	&:focus,
-	&.has-focus {
-		color: #{map-deep-get($config-button, "color", "text-hover")};
-		background-color: #{map-deep-get($config-button, "color", "background-hover")};
-	}
-}
-
-/**
- * Onsale Placeholder style
- * - Since buttons appear in various blocks,
- *   let’s use a placeholder to keep them all
- *   in-sync
- */
-%onsale-style {
-	border-radius: 100%;
-	background-color: map-deep-get($config-global, "color", "alert", "warning");
-	color: map-deep-get($config-global, "color", "foreground", "dark");
-	font-size: map-deep-get($config-global, "font", "size", "sm");
-	font-weight: 700;
-	font-family: #{map-deep-get($config-global, "font", "family", "primary")};
-	min-height: 3.236rem;
-	min-width: 3.236rem;
-	padding: 0.202rem;
-	position: absolute;
-	text-align: center;
-	text-transform: none;
-	line-height: 3.236;
-	top: -0.5em;
-	right: -0.5em;
-	left: auto;
-	margin: 0;
-	z-index: 9;
-}

varia/sass/abstracts/_imports.scss

@@ -6,4 +6,3 @@
 @import "functions";
 @import "config-global";
 @import "mixins";
-@import "extends";

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

@@ -0,0 +1,12 @@
+// WooCommerce
+$config-woocommerce: (
+
+	/* Tables */
+	"table": (
+		/* Font Family */
+		"border-color": map-deep-get($config-global, "color", "border", "default"),
+		"border-radius": 0,
+		"border-width": 1px,
+		"padding": map-deep-get($config-global, "spacing", "unit"),
+	),
+);

varia/sass/vendors/woocommerce/abstracts/_imports.scss

@@ -2,4 +2,5 @@
  * Abstracts Imports
  */
 
+@import "config-woocommerce";
 @import "extends";

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

@@ -11,6 +11,12 @@ body[class*="woocommerce"] #page { // adding #page here to override default wc s
 
 	.main-navigation {
 
+		.woocommerce-cart-link .svg-icon {
+			float: left;
+			height: #{map-deep-get($config-global, "font", "size", "md")};
+			width: #{map-deep-get($config-global, "font", "size", "md")};
+		}
+
 		.woocommerce-cart-widget {
 			max-width: #{20 * map-deep-get($config-global, "spacing", "horizontal")};
 			padding: #{0.5 * map-deep-get($config-header, "main-nav", "link-padding")} 0;

varia/sass/vendors/woocommerce/pages/_cart.scss

@@ -24,6 +24,19 @@ body[class*="woocommerce"] #page { // adding #page here to override default wc s
 		}
 	}
 
+	td.product-remove {
+		height: map-deep-get($config-global, "font", "size", "lg");
+		width: map-deep-get($config-global, "font", "size", "lg");
+	}
+
+	td.product-thumbnail {
+		width: #{6 * map-deep-get($config-global, "spacing", "horizontal")};
+
+		img {
+			width: inherit;
+		}
+	}
+
 	td.product-name {
 
 		font-family: #{map-deep-get($config-global, "font", "family", "primary")};

varia/style-editor-content-width.scss

@@ -9,7 +9,6 @@
 @import "sass/abstracts/functions";
 @import "sass/abstracts/config-global";
 @import "sass/abstracts/mixins";
-@import "sass/abstracts/extends";
 
 /**
  * Structure

varia/style-editor.css

@@ -112,6 +112,9 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Crop Text Boundry
  * - Sets a fixed-width on content within alignwide and alignfull blocks
  */
+/**
+ * Extends
+ */
 /**
  * Button Placeholder style
  * - Since buttons appear in various blocks,

varia/style-editor.scss

@@ -9,7 +9,11 @@
 @import "sass/abstracts/functions";
 @import "sass/abstracts/config-global";
 @import "sass/abstracts/mixins";
-@import "sass/abstracts/extends";
+
+/**
+ * Extends
+ */
+@import "sass/base/extends";
 
 /**
  * Base

varia/style-rtl.css

@@ -135,6 +135,9 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Crop Text Boundry
  * - Sets a fixed-width on content within alignwide and alignfull blocks
  */
+/**
+ * Extends
+ */
 /**
  * Button Placeholder style
  * - Since buttons appear in various blocks,

varia/style-woocommerce.css

@@ -742,6 +742,12 @@ body[class*="woocommerce"] #page .wc-block-grid__product-add-to-cart .added_to_c
 	text-decoration: none;
 }
 
+body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-link .svg-icon {
+	float: left;
+	height: 1.2rem;
+	width: 1.2rem;
+}
+
 body[class*="woocommerce"] #page .main-navigation .woocommerce-cart-widget {
 	max-width: 320px;
 	padding: 8px 0;
@@ -1376,6 +1382,19 @@ body[class*="woocommerce"] #page table.shop_table tbody th {
 	border-top-color: #DDDDDD;
 }
 
+body[class*="woocommerce"] #page td.product-remove {
+	height: 1.44rem;
+	width: 1.44rem;
+}
+
+body[class*="woocommerce"] #page td.product-thumbnail {
+	width: 96px;
+}
+
+body[class*="woocommerce"] #page td.product-thumbnail img {
+	width: inherit;
+}
+
 body[class*="woocommerce"] #page td.product-name {
 	font-family: sans-serif;
 	font-weight: 700;

varia/style.css

@@ -135,6 +135,9 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
  * Crop Text Boundry
  * - Sets a fixed-width on content within alignwide and alignfull blocks
  */
+/**
+ * Extends
+ */
 /**
  * Button Placeholder style
  * - Since buttons appear in various blocks,

varia/style.scss

@@ -27,6 +27,11 @@ Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
  */
 @import "sass/abstracts/imports";
 
+/**
+ * Extends
+ */
+@import "sass/base/extends";
+
 /**
  * Base
  * - Reset the browser