Dalston: Adding more variables and improvemenst to match Pro Business theme

dalston/functions.php

@@ -60,27 +60,22 @@ if ( ! function_exists( 'dalston_setup' ) ) :
 				array(
 					'name'  => __( 'Primary', 'dalston' ),
 					'slug'  => 'primary',
-					'color' => '#0000FF',
-				),
-				array(
-					'name'  => __( 'Secondary', 'dalston' ),
-					'slug'  => 'secondary',
-					'color' => '#FF0000',
+					'color' => '#0073AA',
 				),
 				array(
 					'name'  => __( 'Dark Gray', 'dalston' ),
 					'slug'  => 'foreground-dark',
-					'color' => '#111111',
+					'color' => '#000000',
 				),
 				array(
 					'name'  => __( 'Gray', 'dalston' ),
 					'slug'  => 'foreground',
-					'color' => '#444444',
+					'color' => '#1E1E1E',
 				),
 				array(
 					'name'  => __( 'Light Gray', 'dalston' ),
 					'slug'  => 'foreground-light',
-					'color' => '#767676',
+					'color' => '#FAFAFA',
 				),
 				array(
 					'name'  => __( 'Lighter Gray', 'dalston' ),

dalston/sass/_config-child-theme-deep.scss

@@ -10,7 +10,7 @@
 // Vertical Rhythm Multiplier
 $baseline-unit: 8px;
 
-$typescale-root: 20px; // Set 16px/1em default on html
+$typescale-root: 22px; // Set 16px/1em default on html
 $typescale-base: 1rem; // Set 1em default on body == $typescale-root;
 $typescale-ratio: 1.125; // Run ratio math on 1em == $typescale-base * $typescale-root;
 
@@ -71,7 +71,7 @@ $config-global: (
 		"foreground": (
 			"default": #1e1e1e,
 			"light": #767676, // must be accessible against background
-			"dark": #111111, // must be accessible against background
+			"dark": #000000, // must be accessible against background
 		),
 		"background": (
 			"default": #FFFFFF,
@@ -319,7 +319,7 @@ $config-header: (
 		// Fonts
 		"font": (
 			"family": map-deep-get($config-global, "font", "family", "secondary"),
-			"size": map-deep-get($config-global, "font", "size", "md"),
+			"size": map-deep-get($config-global, "font", "size", "base"),
 			"weight": normal,
 			"line-height": 1,
 		),

dalston/sass/_extra-child-theme.scss

@@ -79,10 +79,9 @@ a {
 				margin-right: -#{0.5 * map-deep-get($config-global, "spacing", "horizontal")};
 
 				& > li {
-					padding: #{map-deep-get($config-header, "main-nav", "link-padding")};
 
 					& > a {
-						padding: 0;
+						padding: 0 #{map-deep-get($config-header, "main-nav", "link-padding")};
 					}
 				}
 

dalston/style-editor.css

@@ -171,7 +171,7 @@ body {
 	color: #1e1e1e;
 	background-color: #FFFFFF;
 	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
-	font-size: 20px;
+	font-size: 22px;
 	font-weight: normal;
 	line-height: 1.6;
 	-moz-osx-font-smoothing: grayscale;
@@ -179,7 +179,7 @@ body {
 }
 
 .editor-post-title__block {
-	font-size: 20px;
+	font-size: 22px;
 }
 
 p {
@@ -310,7 +310,7 @@ object {
 	font-size: 1.125em;
 	line-height: 1;
 	background-color: #0073AA;
-	border-radius: 10px;
+	border-radius: 11px;
 	padding: 16px 16px;
 }
 
@@ -631,7 +631,7 @@ table th,
 }
 
 .has-foreground-dark-color[class] {
-	color: #111111 !important;
+	color: #000000 !important;
 }
 
 .has-background-light-color[class] {
@@ -687,7 +687,7 @@ table th,
 }
 
 .has-foreground-dark-background-color[class] {
-	background-color: #111111 !important;
+	background-color: #000000 !important;
 	color: #FFFFFF;
 }
 

dalston/style-rtl.css

@@ -588,14 +588,14 @@ html {
  * HTML resets
  */
 html {
-	font-size: 17.77778px;
+	font-size: 19.55556px;
 	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
 	line-height: 1.6;
 }
 
 @media only screen and (min-width: 560px) {
 	html {
-		font-size: 20px;
+		font-size: 22px;
 	}
 }
 
@@ -1080,7 +1080,7 @@ input[type="submit"],
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 1.125rem;
 	background-color: #0073AA;
-	border-radius: 10px;
+	border-radius: 11px;
 	border-width: 0;
 	padding: 16px 16px;
 }
@@ -2449,7 +2449,7 @@ table th,
 	color: #0073AA;
 	display: block;
 	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
-	font-size: 1.125rem;
+	font-size: 1rem;
 	font-weight: normal;
 	padding: 16px;
 }
@@ -3452,11 +3452,8 @@ a {
 		margin-right: -8px;
 		margin-left: -8px;
 	}
-	.site-header .main-navigation > div > ul > li {
-		padding: 16px;
-	}
 	.site-header .main-navigation > div > ul > li > a {
-		padding: 0;
+		padding: 0 16px;
 	}
 	.site-header .main-navigation > div > ul > .menu-item-has-children > a::after {
 		font-size: 0.5rem;

dalston/style.css

@@ -588,14 +588,14 @@ html {
  * HTML resets
  */
 html {
-	font-size: 17.77778px;
+	font-size: 19.55556px;
 	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
 	line-height: 1.6;
 }
 
 @media only screen and (min-width: 560px) {
 	html {
-		font-size: 20px;
+		font-size: 22px;
 	}
 }
 
@@ -1080,7 +1080,7 @@ input[type="submit"],
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 1.125rem;
 	background-color: #0073AA;
-	border-radius: 10px;
+	border-radius: 11px;
 	border-width: 0;
 	padding: 16px 16px;
 }
@@ -2026,7 +2026,7 @@ table th,
 }
 
 .has-foreground-dark-color[class] {
-	color: #111111 !important;
+	color: #000000 !important;
 }
 
 .has-background-light-color[class] {
@@ -2078,7 +2078,7 @@ table th,
 }
 
 .has-foreground-dark-background-color[class] {
-	background-color: #111111 !important;
+	background-color: #000000 !important;
 	color: #FFFFFF;
 }
 
@@ -2454,7 +2454,7 @@ table th,
 	color: #0073AA;
 	display: block;
 	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
-	font-size: 1.125rem;
+	font-size: 1rem;
 	font-weight: normal;
 	padding: 16px;
 }
@@ -3457,11 +3457,8 @@ a {
 		margin-left: -8px;
 		margin-right: -8px;
 	}
-	.site-header .main-navigation > div > ul > li {
-		padding: 16px;
-	}
 	.site-header .main-navigation > div > ul > li > a {
-		padding: 0;
+		padding: 0 16px;
 	}
 	.site-header .main-navigation > div > ul > .menu-item-has-children > a::after {
 		font-size: 0.5rem;