Morden: Add extra spacing utility classes

morden/style-editor.css

@@ -533,6 +533,7 @@ p.has-background:not(.has-background-background-color) a {
 }
 
 .wp-block-quote p {
+	font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 1.52087em;
 	letter-spacing: normal;
 }
@@ -543,6 +544,7 @@ p.has-background:not(.has-background-background-color) a {
 }
 
 .wp-block-quote.is-large p, .wp-block-quote.is-style-large p {
+	font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 1.74901em;
 	letter-spacing: normal;
 	line-height: 1.125;
@@ -637,7 +639,8 @@ table th,
 	color: white;
 }
 
-.has-primary-background-color[class] p, .has-primary-background-color[class] h1, .has-primary-background-color[class] h2, .has-primary-background-color[class] h3, .has-primary-background-color[class] h4, .has-primary-background-color[class] h5, .has-primary-background-color[class] h6 {
+.has-primary-background-color[class] p, .has-primary-background-color[class] h1, .has-primary-background-color[class] h2, .has-primary-background-color[class] h3, .has-primary-background-color[class] h4, .has-primary-background-color[class] h5, .has-primary-background-color[class] h6,
+.has-primary-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -646,7 +649,8 @@ table th,
 	color: white;
 }
 
-.has-secondary-background-color[class] p, .has-secondary-background-color[class] h1, .has-secondary-background-color[class] h2, .has-secondary-background-color[class] h3, .has-secondary-background-color[class] h4, .has-secondary-background-color[class] h5, .has-secondary-background-color[class] h6 {
+.has-secondary-background-color[class] p, .has-secondary-background-color[class] h1, .has-secondary-background-color[class] h2, .has-secondary-background-color[class] h3, .has-secondary-background-color[class] h4, .has-secondary-background-color[class] h5, .has-secondary-background-color[class] h6,
+.has-secondary-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -655,7 +659,8 @@ table th,
 	color: white;
 }
 
-.has-foreground-background-color[class] p, .has-foreground-background-color[class] h1, .has-foreground-background-color[class] h2, .has-foreground-background-color[class] h3, .has-foreground-background-color[class] h4, .has-foreground-background-color[class] h5, .has-foreground-background-color[class] h6 {
+.has-foreground-background-color[class] p, .has-foreground-background-color[class] h1, .has-foreground-background-color[class] h2, .has-foreground-background-color[class] h3, .has-foreground-background-color[class] h4, .has-foreground-background-color[class] h5, .has-foreground-background-color[class] h6,
+.has-foreground-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -664,7 +669,8 @@ table th,
 	color: white;
 }
 
-.has-foreground-light-background-color[class] p, .has-foreground-light-background-color[class] h1, .has-foreground-light-background-color[class] h2, .has-foreground-light-background-color[class] h3, .has-foreground-light-background-color[class] h4, .has-foreground-light-background-color[class] h5, .has-foreground-light-background-color[class] h6 {
+.has-foreground-light-background-color[class] p, .has-foreground-light-background-color[class] h1, .has-foreground-light-background-color[class] h2, .has-foreground-light-background-color[class] h3, .has-foreground-light-background-color[class] h4, .has-foreground-light-background-color[class] h5, .has-foreground-light-background-color[class] h6,
+.has-foreground-light-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -673,7 +679,8 @@ table th,
 	color: white;
 }
 
-.has-foreground-dark-background-color[class] p, .has-foreground-dark-background-color[class] h1, .has-foreground-dark-background-color[class] h2, .has-foreground-dark-background-color[class] h3, .has-foreground-dark-background-color[class] h4, .has-foreground-dark-background-color[class] h5, .has-foreground-dark-background-color[class] h6 {
+.has-foreground-dark-background-color[class] p, .has-foreground-dark-background-color[class] h1, .has-foreground-dark-background-color[class] h2, .has-foreground-dark-background-color[class] h3, .has-foreground-dark-background-color[class] h4, .has-foreground-dark-background-color[class] h5, .has-foreground-dark-background-color[class] h6,
+.has-foreground-dark-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -682,7 +689,8 @@ table th,
 	color: #303030;
 }
 
-.has-background-light-background-color[class] p, .has-background-light-background-color[class] h1, .has-background-light-background-color[class] h2, .has-background-light-background-color[class] h3, .has-background-light-background-color[class] h4, .has-background-light-background-color[class] h5, .has-background-light-background-color[class] h6 {
+.has-background-light-background-color[class] p, .has-background-light-background-color[class] h1, .has-background-light-background-color[class] h2, .has-background-light-background-color[class] h3, .has-background-light-background-color[class] h4, .has-background-light-background-color[class] h5, .has-background-light-background-color[class] h6,
+.has-background-light-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -691,7 +699,8 @@ table th,
 	color: #303030;
 }
 
-.has-background-dark-background-color[class] p, .has-background-dark-background-color[class] h1, .has-background-dark-background-color[class] h2, .has-background-dark-background-color[class] h3, .has-background-dark-background-color[class] h4, .has-background-dark-background-color[class] h5, .has-background-dark-background-color[class] h6 {
+.has-background-dark-background-color[class] p, .has-background-dark-background-color[class] h1, .has-background-dark-background-color[class] h2, .has-background-dark-background-color[class] h3, .has-background-dark-background-color[class] h4, .has-background-dark-background-color[class] h5, .has-background-dark-background-color[class] h6,
+.has-background-dark-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -700,7 +709,8 @@ table th,
 	color: #303030;
 }
 
-.has-background-background-color[class] p, .has-background-background-color[class] h1, .has-background-background-color[class] h2, .has-background-background-color[class] h3, .has-background-background-color[class] h4, .has-background-background-color[class] h5, .has-background-background-color[class] h6 {
+.has-background-background-color[class] p, .has-background-background-color[class] h1, .has-background-background-color[class] h2, .has-background-background-color[class] h3, .has-background-background-color[class] h4, .has-background-background-color[class] h5, .has-background-background-color[class] h6,
+.has-background-background-color[class] .wp-block-quote__citation {
 	color: currentColor;
 }
 
@@ -735,6 +745,111 @@ table th,
 	font-weight: bold;
 }
 
+/**
+ * Spacing Overrides
+ */
+/*
+ * Margins
+ */
+.margin-top-none {
+	margin-top: 0 !important;
+}
+
+.margin-top-half {
+	margin-top: 16px !important;
+}
+
+.margin-top-default {
+	margin-top: 32px !important;
+}
+
+.margin-right-none {
+	margin-top: 0 !important;
+}
+
+.margin-right-half {
+	margin-top: 16px !important;
+}
+
+.margin-right-default {
+	margin-top: 32px !important;
+}
+
+.margin-bottom-none {
+	margin-bottom: 0 !important;
+}
+
+.margin-bottom-half {
+	margin-bottom: 16px !important;
+}
+
+.margin-bottom-default {
+	margin-bottom: 32px !important;
+}
+
+.margin-left-none {
+	margin-top: 0 !important;
+}
+
+.margin-left-half {
+	margin-top: 16px !important;
+}
+
+.margin-left-default {
+	margin-top: 32px !important;
+}
+
+/*
+ * Padding
+ */
+.padding-top-none {
+	padding-top: 0 !important;
+}
+
+.padding-top-half {
+	padding-top: 16px !important;
+}
+
+.padding-top-default {
+	padding-top: 32px !important;
+}
+
+.padding-right-none {
+	padding-top: 0 !important;
+}
+
+.padding-right-half {
+	padding-top: 16px !important;
+}
+
+.padding-right-default {
+	padding-top: 32px !important;
+}
+
+.padding-bottom-none {
+	padding-bottom: 0 !important;
+}
+
+.padding-bottom-half {
+	padding-bottom: 16px !important;
+}
+
+.padding-bottom-default {
+	padding-bottom: 32px !important;
+}
+
+.padding-left-none {
+	padding-top: 0 !important;
+}
+
+.padding-left-half {
+	padding-top: 16px !important;
+}
+
+.padding-left-default {
+	padding-top: 32px !important;
+}
+
 /**
  * Extras
  */

morden/style-rtl.css

@@ -1168,11 +1168,6 @@ input.has-focus[type="submit"],
 	 */
 }
 
-.wp-block-columns .wp-block-column {
-	/* Resetting margins to match _block-container.scss */
-	margin-bottom: 0;
-}
-
 .wp-block-columns .wp-block-column > * {
 	margin-top: 21.312px;
 	margin-bottom: 21.312px;
@@ -1193,6 +1188,27 @@ input.has-focus[type="submit"],
 	margin-bottom: 0;
 }
 
+.wp-block-columns .wp-block-column:last-child {
+	margin-bottom: 0;
+}
+
+.wp-block-columns .wp-block-column:not(:last-child) {
+	margin-bottom: 21.312px;
+}
+
+@media only screen and (min-width: 560px) {
+	.wp-block-columns .wp-block-column:not(:last-child) {
+		margin-bottom: 32px;
+	}
+}
+
+@media only screen and (min-width: 782px) {
+	.wp-block-columns .wp-block-column:not(:last-child) {
+		/* Resetting margins to match _block-container.scss */
+		margin-bottom: 0;
+	}
+}
+
 .wp-block-columns.alignfull {
 	padding-right: 16px;
 	padding-left: 16px;
@@ -1794,6 +1810,12 @@ p.has-background:not(.has-background-background-color) a {
 	letter-spacing: normal;
 }
 
+.has-background .wp-block-quote .wp-block-quote__citation, .has-background
+.wp-block-quote cite, .has-background
+.wp-block-quote footer {
+	color: currentColor;
+}
+
 .wp-block-quote[style*="text-align:right"], .wp-block-quote[style*="text-align: right"] {
 	border-left-color: #CD2220;
 }
@@ -2100,6 +2122,111 @@ table th,
 	}
 }
 
+/**
+ * Spacing Overrides
+ */
+/*
+ * Margins
+ */
+.margin-top-none {
+	margin-top: 0 !important;
+}
+
+.margin-top-half {
+	margin-top: 16px !important;
+}
+
+.margin-top-default {
+	margin-top: 32px !important;
+}
+
+.margin-right-none {
+	margin-top: 0 !important;
+}
+
+.margin-right-half {
+	margin-top: 16px !important;
+}
+
+.margin-right-default {
+	margin-top: 32px !important;
+}
+
+.margin-bottom-none {
+	margin-bottom: 0 !important;
+}
+
+.margin-bottom-half {
+	margin-bottom: 16px !important;
+}
+
+.margin-bottom-default {
+	margin-bottom: 32px !important;
+}
+
+.margin-left-none {
+	margin-top: 0 !important;
+}
+
+.margin-left-half {
+	margin-top: 16px !important;
+}
+
+.margin-left-default {
+	margin-top: 32px !important;
+}
+
+/*
+ * Padding
+ */
+.padding-top-none {
+	padding-top: 0 !important;
+}
+
+.padding-top-half {
+	padding-top: 16px !important;
+}
+
+.padding-top-default {
+	padding-top: 32px !important;
+}
+
+.padding-right-none {
+	padding-top: 0 !important;
+}
+
+.padding-right-half {
+	padding-top: 16px !important;
+}
+
+.padding-right-default {
+	padding-top: 32px !important;
+}
+
+.padding-bottom-none {
+	padding-bottom: 0 !important;
+}
+
+.padding-bottom-half {
+	padding-bottom: 16px !important;
+}
+
+.padding-bottom-default {
+	padding-bottom: 32px !important;
+}
+
+.padding-left-none {
+	padding-top: 0 !important;
+}
+
+.padding-left-half {
+	padding-top: 16px !important;
+}
+
+.padding-left-default {
+	padding-top: 32px !important;
+}
+
 /**
  * Components
  * - Similar to Blocks but exist outside of the "current" editor context

morden/style.css

@@ -1168,11 +1168,6 @@ input.has-focus[type="submit"],
 	 */
 }
 
-.wp-block-columns .wp-block-column {
-	/* Resetting margins to match _block-container.scss */
-	margin-bottom: 0;
-}
-
 .wp-block-columns .wp-block-column > * {
 	margin-top: 21.312px;
 	margin-bottom: 21.312px;
@@ -1193,6 +1188,27 @@ input.has-focus[type="submit"],
 	margin-bottom: 0;
 }
 
+.wp-block-columns .wp-block-column:last-child {
+	margin-bottom: 0;
+}
+
+.wp-block-columns .wp-block-column:not(:last-child) {
+	margin-bottom: 21.312px;
+}
+
+@media only screen and (min-width: 560px) {
+	.wp-block-columns .wp-block-column:not(:last-child) {
+		margin-bottom: 32px;
+	}
+}
+
+@media only screen and (min-width: 782px) {
+	.wp-block-columns .wp-block-column:not(:last-child) {
+		/* Resetting margins to match _block-container.scss */
+		margin-bottom: 0;
+	}
+}
+
 .wp-block-columns.alignfull {
 	padding-left: 16px;
 	padding-right: 16px;
@@ -1794,6 +1810,12 @@ p.has-background:not(.has-background-background-color) a {
 	letter-spacing: normal;
 }
 
+.has-background .wp-block-quote .wp-block-quote__citation, .has-background
+.wp-block-quote cite, .has-background
+.wp-block-quote footer {
+	color: currentColor;
+}
+
 .wp-block-quote[style*="text-align:right"], .wp-block-quote[style*="text-align: right"] {
 	border-right-color: #CD2220;
 }
@@ -2105,6 +2127,111 @@ table th,
 	}
 }
 
+/**
+ * Spacing Overrides
+ */
+/*
+ * Margins
+ */
+.margin-top-none {
+	margin-top: 0 !important;
+}
+
+.margin-top-half {
+	margin-top: 16px !important;
+}
+
+.margin-top-default {
+	margin-top: 32px !important;
+}
+
+.margin-right-none {
+	margin-top: 0 !important;
+}
+
+.margin-right-half {
+	margin-top: 16px !important;
+}
+
+.margin-right-default {
+	margin-top: 32px !important;
+}
+
+.margin-bottom-none {
+	margin-bottom: 0 !important;
+}
+
+.margin-bottom-half {
+	margin-bottom: 16px !important;
+}
+
+.margin-bottom-default {
+	margin-bottom: 32px !important;
+}
+
+.margin-left-none {
+	margin-top: 0 !important;
+}
+
+.margin-left-half {
+	margin-top: 16px !important;
+}
+
+.margin-left-default {
+	margin-top: 32px !important;
+}
+
+/*
+ * Padding
+ */
+.padding-top-none {
+	padding-top: 0 !important;
+}
+
+.padding-top-half {
+	padding-top: 16px !important;
+}
+
+.padding-top-default {
+	padding-top: 32px !important;
+}
+
+.padding-right-none {
+	padding-top: 0 !important;
+}
+
+.padding-right-half {
+	padding-top: 16px !important;
+}
+
+.padding-right-default {
+	padding-top: 32px !important;
+}
+
+.padding-bottom-none {
+	padding-bottom: 0 !important;
+}
+
+.padding-bottom-half {
+	padding-bottom: 16px !important;
+}
+
+.padding-bottom-default {
+	padding-bottom: 32px !important;
+}
+
+.padding-left-none {
+	padding-top: 0 !important;
+}
+
+.padding-left-half {
+	padding-top: 16px !important;
+}
+
+.padding-left-default {
+	padding-top: 32px !important;
+}
+
 /**
  * Components
  * - Similar to Blocks but exist outside of the "current" editor context