More tweaks (godaddy-wordpress#357)

* Add .aligncenter

* Cleanup

* Adjust content width

* Remove unused code, now that content widths are simplier

* Clean up

* More clean up

* Fix hfeed and search

* Add new pagination to archive and search

* Minor fixes

* Pullquote fixes

* phpcs

* Update comments.php

* Update content-none.php

* Update content.php

* Update comments.php

* Update go.pot

* Update go.pot

* heading tweak for traditional

* Tweaks

* Add hover/focus transition to social icons and remove color hover

* Remove underline from modern

* More tweaks

* Minor tweaks

* Fixes

* Fixes

* Remove js_detection()

* Minor tweaks

* Update screenshot

* Add content to color palette translatable text

* Update go.pot

* Remove accessibility-ready for initial upload

.dev/assets/design-styles/modern/css/style-modern.css

@@ -8,23 +8,6 @@
 @import url("components/carousel.css");
 @import url("components/wc-button.css");
 
-.wp-block-code,
-.wp-block-verse,
-p.has-background,
-.wp-block-pullquote:not(.alignfull):not(.alignwide),
-.wp-block-coblocks-alert,
-.wp-block-quote,
-.wp-block-quote.is-style-large,
-.wp-block-separator.is-style-wide,
-.wp-block-group:not(.alignfull):not(.alignwide),
-.wp-block-cover:not(.alignwide):not(.alignfull),
-.wp-block-coblocks-dynamic-separator.is-style-fullwidth::before {
-	@media (--base) {
-		margin-left: var(--theme-block-padding-x);
-		margin-right: var(--theme-block-padding-x);
-	}
-}
-
 .site-search__toggle {
 	top: 2px;
 }
@@ -62,12 +45,20 @@ p.has-background,
 		}
 	}
 
+	&:hover {
+		text-decoration: none;
+	}
+
 	&:focus::after {
 		transform: scaleX(0);
 		transform-origin: right center;
 	}
 }
 
+.post-tags .meta-icon {
+	top: 2px;
+}
+
 textarea,
 input[type="text"],
 input[type="email"],

.dev/assets/design-styles/modern/settings.css

@@ -20,22 +20,21 @@
 	/*--------------------------------------------------------------
 	## Editor
 	--------------------------------------------------------------*/
-	--editor-title--font-size: 3.75em;
+	--editor-title--font-size: 2em;
 	--editor-max-w-base: 633px;
 	--editor-max-w-wide: 1280px;
 
+	@media (--medium) {
+		--editor-title--font-size: 3.65em;
+	}
+
 
 	/*--------------------------------------------------------------
 	## Base
 	--------------------------------------------------------------*/
-
-	--theme-max-w-base: 50rem;
+	--theme-max-w-base: 38rem;
 	--theme-max-w-wide: 90rem;
 
-	/* Below base width query */
-	@custom-media --base (max-width: 50rem);
-	@custom-media --wide (max-width: 90rem);
-
 	/* Vertical Rhythm */
 	--vertical-rhythm: 1.15rem;
 	--vertical-rhythm--med: 1.75rem;
@@ -59,7 +58,7 @@
 
 	/* Accessibility */
 	--theme-outline-color: var(--theme-color-primary);
-	--theme-selection--color: var(--theme-color-primary);
+	--theme-selection--bg: var(--theme-color-primary);
 
 	/* Transitions */
 	--theme-link-transition: color 200ms cubic-bezier(0.7, 0, 0.3, 1);
@@ -98,8 +97,8 @@
 
 	@media (--medium) {
 		--theme-h1--font-size: 4.5em;
-		--theme-h2--font-size: 3em;
-		--theme-h3--font-size: 2.5em;
+		--theme-h2--font-size: 3.5em;
+		--theme-h3--font-size: 2.75em;
 	}
 
 	/* Text Utilities */
@@ -141,7 +140,6 @@
 
 	/* Blockquote (Large) */
 	--theme-quote-large--color: var(--theme-color-heading);
-	--theme-quote-large--font-size: var(--theme-h2--font-size);
 	--theme-quote-large--leading: var(--theme-heading--leading);
 	--theme-quote-large--style: normal;
 
@@ -221,14 +219,13 @@
 	--theme-site-title--font: var(--theme-site-nav--font);
 	--theme-site-title--text-transform: uppercase;
 	--theme-site-title--tracking: 5px;
-	--theme-site-title--weight: 700;
 
 	--theme-site-description--color: var(--theme-color-heading);
 	--theme-site-description--leading: 1.4;
+	--theme-site-description--opacity: 1;
 
 	/* Header > Navigation */
 	--theme-site-nav--color: var(--theme-color-heading);
-	--theme-site-nav--color-interactive: var(--theme-color-primary);
 	--theme-site-nav--font: "Montserrat", sans-serif;
 	--theme-site-nav--font-size: 0.75rem;
 	--theme-site-nav--font-size-mobile: 1rem;
@@ -264,7 +261,6 @@
 	--------------------------------------------------------------*/
 	--theme-search-toggle--color: var(--theme-color-heading);
 	--theme-search-toggle--color-interactive: var(--theme-color-heading);
-	--theme-search-toggle--size: 22px;
 
 	--theme-search-submit--bg: var(--theme-color-primary);
 	--theme-search-submit--bg-interactive: var(--theme-color-heading);
@@ -291,11 +287,9 @@
 
 	/* Footer > Navigation */
 	--theme-footer-nav--color: var(--theme-site-nav--color);
-	--theme-footer-nav--color-interactive: var(--theme-color-primary);
 	--theme-footer-nav--leading: 2.5;
 	--theme-footer-nav--padding-x: 1rem;
 	--theme-footer-nav--padding-y: 0.25rem;
-	--theme-footer-nav--transition: var(--theme-link-transition);
 
 	@media (--medium) {
 		--theme-footer-nav--padding-x: 1.75rem;
@@ -304,7 +298,6 @@
 
 	/* Footer > Social Icons */
 	--theme-social--color: var(--theme-color-heading);
-	--theme-social--color-hover: var(--theme-color-primary);
 	--theme-social--size: 1.5rem;
 	--theme-social--spacing: 0.5rem;
 
@@ -317,10 +310,19 @@
 	--theme-footer-3-site-info--border-color: 0, 0%, 80%;
 
 
+	/*--------------------------------------------------------------
+	## Post
+	--------------------------------------------------------------*/
+	--theme-entry-header--width: 70rem;
+	--theme-meta--color: var(--theme-color-heading);
+	--theme-meta--font: var(--theme-body--font);
+	--theme-meta--font-size: var(--theme-body--font-size);
+
+
 	/*--------------------------------------------------------------
 	## CoBlocks
 	--------------------------------------------------------------*/
-	--coblocks-accordion--bg-hover: hsla(var(--theme-selection--color), 0.1);
+	--coblocks-accordion--bg-hover: hsla(var(--theme-selection--bg), 0.1);
 	--coblocks-accordion--border-color: var(--theme-color-heading);
 	--coblocks-accordion--border: var(--coblocks-accordion--border-width, 2px) solid hsl(var(--coblocks-accordion--border-color));
 	--coblocks-accordion--color: var(--theme-color-heading);

.dev/assets/design-styles/playful/css/style-playful.css

@@ -5,21 +5,6 @@
 @import url("../settings.css");
 @import url("components/carousel.css");
 
-.wp-block-code,
-.wp-block-verse,
-p.has-background,
-.wp-block-pullquote:not(.alignfull):not(.alignwide),
-.wp-block-coblocks-alert,
-.wp-block-separator.is-style-wide,
-.wp-block-group:not(.alignfull):not(.alignwide),
-.wp-block-cover:not(.alignwide):not(.alignfull),
-.wp-block-coblocks-dynamic-separator.is-style-fullwidth::before {
-	@media (--base) {
-		margin-left: var(--theme-block-padding-x);
-		margin-right: var(--theme-block-padding-x);
-	}
-}
-
 .wp-block-separator:not(.is-style-dots) {
 	background-color: hsl(var(--theme-color-secondary));
 	background-position: 50%;

.dev/assets/design-styles/playful/settings.css

@@ -20,20 +20,16 @@
 	/*--------------------------------------------------------------
 	## Editor
 	--------------------------------------------------------------*/
-	--editor-max-w-base: 622px;
+	--editor-max-w-base: 702px;
 	--editor-max-w-wide: 942px;
 
 
 	/*--------------------------------------------------------------
 	## Base
 	--------------------------------------------------------------*/
-	--theme-max-w-base: 50rem;
+	--theme-max-w-base: 42rem;
 	--theme-max-w-wide: 70rem;
 
-	/* Below base width query */
-	@custom-media --base (max-width: 50rem);
-	@custom-media --wide (max-width: 70rem);
-
 	/* Vertical Rhythm */
 	--vertical-rhythm: 1.75rem;
 	--vertical-rhythm--med: 2.25rem;
@@ -59,7 +55,7 @@
 	--theme-outline-color: var(--theme-color-primary);
 	--theme-outline-width: 1px;
 
-	--theme-selection--color: var(--theme-color-primary);
+	--theme-selection--bg: var(--theme-color-primary);
 
 	/* Transitions */
 	--theme-link-transition: color 200ms cubic-bezier(0.7, 0, 0.3, 1);
@@ -104,16 +100,13 @@
 
 	/* Text Utilities */
 	--theme-text-sm: 80%;
+	--theme-text-xs: 80%;
 
 	/* Captions */
 	--theme-caption--alignment: center;
 	--theme-caption--color: var(--theme-color-text-secondary);
 	--theme-caption--font-size: 0.85rem;
 
-	/* Links */
-	--theme-link--color: var(--theme-color-heading);
-	--theme-link--color-interactive: var(--theme-color-primary);
-
 	/* Pullquote */
 	--theme-pullquote--font: "Poppins", sans-serif;
 	--theme-pullquote--border-color: transparent;
@@ -141,7 +134,6 @@
 
 	/* Blockquote (Large) */
 	--theme-quote-large--color: var(--theme-color-heading);
-	--theme-quote-large--font-size: var(--theme-h2--font-size);
 	--theme-quote-large--leading: var(--theme-heading--leading);
 	--theme-quote-large--style: normal;
 
@@ -153,7 +145,7 @@
 	--theme-label--font-size: var(--theme-body--font-size);
 	--theme-label--font: var(--theme-site-nav--font);
 	--theme-label--tracking: var(--theme-site-nav--tracking);
-	--theme-label--transform: lowercase;
+	--theme-label--transform: normal;
 	--theme-label--weight: 600;
 	--theme-label--spacing: 0.35rem;
 
@@ -223,14 +215,12 @@
 	--theme-site-title--font: "Poppins", sans-serif;
 	--theme-site-title--text-transform: none;
 	--theme-site-title--tracking: 0;
-	--theme-site-title--weight: 700;
 
-	--theme-site-description--color: var(--theme-color-heading);
+	--theme-site-description--color: var(--color-white);
 	--theme-site-description--leading: 1.4;
 
 	/* Header > Navigation */
 	--theme-site-nav--color: var(--color-white);
-	--theme-site-nav--color-interactive: var(--color-white);
 	--theme-site-nav--font: var(--theme-body--font);
 	--theme-site-nav--font-size: 1.1rem;
 	--theme-site-nav--font-size-mobile: 1.4rem;
@@ -266,7 +256,6 @@
 	--------------------------------------------------------------*/
 	--theme-search-toggle--color: var(--color-white);
 	--theme-search-toggle--color-interactive: var(--color-white);
-	--theme-search-toggle--size: 20px;
 
 	--theme-search-submit--bg: var(--theme-color-primary);
 	--theme-search-submit--bg-interactive: var(--theme-color-primary);
@@ -293,11 +282,9 @@
 
 	/* Footer > Navigation */
 	--theme-footer-nav--color: var(--color-white);
-	--theme-footer-nav--color-interactive: var(--color-white);
 	--theme-footer-nav--leading: 2.5;
 	--theme-footer-nav--padding-x: 1rem;
 	--theme-footer-nav--padding-y: 0.25rem;
-	--theme-footer-nav--transition: var(--theme-link-transition);
 
 	@media (--medium) {
 		--theme-footer-nav--padding-x: 1.75rem;
@@ -306,7 +293,6 @@
 
 	/* Footer > Social Icons */
 	--theme-social--color: var(--color-white);
-	--theme-social--color-hover: var(--theme-color-secondary);
 	--theme-social--size: 1.5rem;
 	--theme-social--spacing: 0.5rem;
 
@@ -319,6 +305,14 @@
 	--theme-footer-3-site-info--border-width: 10px;
 
 
+	/*--------------------------------------------------------------
+	## Post
+	--------------------------------------------------------------*/
+	--theme-entry-header--width: 70rem;
+	--theme-meta--color: var(--theme-color-primary);
+	--theme-comment-p--font-size: 0.95rem;
+
+
 	/*--------------------------------------------------------------
 	## CoBlocks
 	--------------------------------------------------------------*/

.dev/assets/design-styles/traditional/css/style-traditional.css

@@ -4,21 +4,6 @@
 @import url("../../../shared/css/config/media-queries.css");
 @import url("../settings.css");
 
-.wp-block-code,
-.wp-block-verse,
-p.has-background,
-.wp-block-pullquote:not(.alignfull):not(.alignwide),
-.wp-block-coblocks-alert,
-.wp-block-separator.is-style-wide,
-.wp-block-group:not(.alignfull):not(.alignwide),
-.wp-block-cover:not(.alignwide):not(.alignfull),
-.wp-block-coblocks-dynamic-separator.is-style-fullwidth::before {
-	@media (--base) {
-		margin-left: var(--theme-block-padding-x);
-		margin-right: var(--theme-block-padding-x);
-	}
-}
-
 .site-branding {
 	position: relative;
 	top: -2px;
@@ -35,3 +20,12 @@ p.has-background,
 .wp-block-coblocks-food-item__attributes {
 	top: 0;
 }
+
+.meta-icon {
+	position: relative;
+	top: 1px;
+}
+
+.post-date .meta-icon {
+	top: 2px;
+}