浏览代码

Brompton: Fix padding issues in menu on mobile screens.

Allan Cole 5 年之前
父节点
当前提交
ac89b4db25
共有 3 个文件被更改,包括 251 次插入178 次删除
  1. 44 40
      brompton/style-editor.css
  2. 103 69
      brompton/style-rtl.css
  3. 104 69
      brompton/style.css

+ 44 - 40
brompton/style-editor.css

@@ -430,6 +430,45 @@ object {
 	padding-left: 0;
 	padding-left: 0;
 }
 }
 
 
+.wp-block-latest-posts > li > a {
+	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-size: 1.728rem;
+	font-weight: 900;
+	line-height: 1.125;
+}
+
+.wp-block-latest-posts:not(.is-grid) > li {
+	/* Vertical margins logic */
+	margin-top: 32px;
+	margin-bottom: 32px;
+}
+
+.wp-block-latest-posts:not(.is-grid) > li:first-child {
+	margin-top: 0;
+}
+
+.wp-block-latest-posts:not(.is-grid) > li:last-child {
+	margin-bottom: 0;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: #666666;
+	font-size: 0.83333rem;
+	line-height: 1.78;
+}
+
+[class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
+.has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: currentColor;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
+.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
+	font-size: 0.83333rem;
+	line-height: 1.78;
+	margin: 0;
+}
+
 .wp-block-media-text .block-editor-inner-blocks {
 .wp-block-media-text .block-editor-inner-blocks {
 	padding-right: 16px;
 	padding-right: 16px;
 	padding-left: 16px;
 	padding-left: 16px;
@@ -638,86 +677,51 @@ table th,
 	color: #E8E4DD !important;
 	color: #E8E4DD !important;
 }
 }
 
 
+.has-background p, .has-background a, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
+.has-background .wp-block-quote__citation {
+	color: currentColor;
+}
+
 .has-primary-background-color[class] {
 .has-primary-background-color[class] {
 	background-color: #C04239 !important;
 	background-color: #C04239 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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;
-}
-
 .has-secondary-background-color[class] {
 .has-secondary-background-color[class] {
 	background-color: #FFFFFF !important;
 	background-color: #FFFFFF !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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;
-}
-
 .has-foreground-background-color[class] {
 .has-foreground-background-color[class] {
 	background-color: #252E36 !important;
 	background-color: #252E36 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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;
-}
-
 .has-foreground-light-background-color[class] {
 .has-foreground-light-background-color[class] {
 	background-color: #666666 !important;
 	background-color: #666666 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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;
-}
-
 .has-foreground-dark-background-color[class] {
 .has-foreground-dark-background-color[class] {
 	background-color: #474747 !important;
 	background-color: #474747 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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;
-}
-
 .has-background-light-background-color[class] {
 .has-background-light-background-color[class] {
 	background-color: #CFCDC7 !important;
 	background-color: #CFCDC7 !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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;
-}
-
 .has-background-dark-background-color[class] {
 .has-background-dark-background-color[class] {
 	background-color: #B9B6B2 !important;
 	background-color: #B9B6B2 !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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;
-}
-
 .has-background-background-color[class] {
 .has-background-background-color[class] {
 	background-color: #E8E4DD !important;
 	background-color: #E8E4DD !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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;
-}
-
 .is-small-text,
 .is-small-text,
 .has-small-font-size {
 .has-small-font-size {
 	font-size: 0.83333em;
 	font-size: 0.83333em;

+ 103 - 69
brompton/style-rtl.css

@@ -1531,12 +1531,29 @@ img {
 	line-height: 1.78;
 	line-height: 1.78;
 }
 }
 
 
-.wp-block-latest-posts .wp-block-latest-posts__post-excerpt {
+.entry-content [class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
+.entry-content .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: currentColor;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
+.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
 	font-size: 0.83333rem;
 	font-size: 0.83333rem;
 	line-height: 1.78;
 	line-height: 1.78;
 	margin: 0;
 	margin: 0;
 }
 }
 
 
+.wp-block-latest-posts.alignfull {
+	padding-right: 16px;
+	padding-left: 16px;
+}
+
+.entry-content [class*="inner-container"] .wp-block-latest-posts.alignfull,
+.entry-content .has-background .wp-block-latest-posts.alignfull {
+	padding-right: 0;
+	padding-left: 0;
+}
+
 .gallery-item {
 .gallery-item {
 	display: inline-block;
 	display: inline-block;
 	text-align: center;
 	text-align: center;
@@ -1962,25 +1979,40 @@ table th,
 	vertical-align: middle;
 	vertical-align: middle;
 }
 }
 
 
-/* Text Alignments */
+/* Block Alignments */
+/**
+ * .alignleft
+ */
 .alignleft {
 .alignleft {
 	text-align: left;
 	text-align: left;
 	float: left;
 	float: left;
 	margin-top: 0;
 	margin-top: 0;
+	margin-right: 16px;
 	margin-bottom: 32px;
 	margin-bottom: 32px;
 }
 }
 
 
+/**
+ * .aligncenter
+ */
 .aligncenter {
 .aligncenter {
 	clear: both;
 	clear: both;
 	float: none;
 	float: none;
 	text-align: center;
 	text-align: center;
 }
 }
 
 
+/**
+ * .alignright
+ */
 .alignright {
 .alignright {
 	float: right;
 	float: right;
-	margin-left: 16px;
 	margin-top: 0;
 	margin-top: 0;
 	margin-bottom: 32px;
 	margin-bottom: 32px;
+	margin-left: 16px;
+}
+
+.entry-content * > .alignleft + *,
+.entry-content * > .alignright + * {
+	margin-top: 0;
 }
 }
 
 
 /**
 /**
@@ -2048,78 +2080,50 @@ table th,
 	color: #E8E4DD !important;
 	color: #E8E4DD !important;
 }
 }
 
 
+.has-background p, .has-background a, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
+	color: currentColor;
+}
+
 .has-primary-background-color[class] {
 .has-primary-background-color[class] {
 	background-color: #C04239 !important;
 	background-color: #C04239 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-secondary-background-color[class] {
 .has-secondary-background-color[class] {
 	background-color: #FFFFFF !important;
 	background-color: #FFFFFF !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-foreground-background-color[class] {
 .has-foreground-background-color[class] {
 	background-color: #252E36 !important;
 	background-color: #252E36 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-foreground-light-background-color[class] {
 .has-foreground-light-background-color[class] {
 	background-color: #666666 !important;
 	background-color: #666666 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-foreground-dark-background-color[class] {
 .has-foreground-dark-background-color[class] {
 	background-color: #474747 !important;
 	background-color: #474747 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-background-light-background-color[class] {
 .has-background-light-background-color[class] {
 	background-color: #CFCDC7 !important;
 	background-color: #CFCDC7 !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-background-dark-background-color[class] {
 .has-background-dark-background-color[class] {
 	background-color: #B9B6B2 !important;
 	background-color: #B9B6B2 !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-background-background-color[class] {
 .has-background-background-color[class] {
 	background-color: #E8E4DD !important;
 	background-color: #E8E4DD !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .is-small-text,
 .is-small-text,
 .has-small-font-size {
 .has-small-font-size {
 	font-size: 0.83333rem;
 	font-size: 0.83333rem;
@@ -2415,14 +2419,6 @@ table th,
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type {
-	margin-right: -16px;
-}
-
-.main-navigation > div > ul > li:last-of-type {
-	margin-left: -16px;
-}
-
 .main-navigation > div > ul > li > a {
 .main-navigation > div > ul > li > a {
 	line-height: 1;
 	line-height: 1;
 }
 }
@@ -2442,6 +2438,15 @@ table th,
 	margin-top: -0.11em;
 	margin-top: -0.11em;
 }
 }
 
 
+@media only screen and (min-width: 560px) {
+	.main-navigation > div > ul > li:first-of-type > a {
+		padding-right: 0;
+	}
+	.main-navigation > div > ul > li:last-of-type > a {
+		padding-left: 0;
+	}
+}
+
 .main-navigation > div > ul > li > .sub-menu {
 .main-navigation > div > ul > li > .sub-menu {
 	margin: 0;
 	margin: 0;
 	position: relative;
 	position: relative;
@@ -2471,7 +2476,13 @@ table th,
 	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 0.83333rem;
 	font-size: 0.83333rem;
 	font-weight: 900;
 	font-weight: 900;
-	padding: 16px;
+	padding: 16px 0;
+}
+
+@media only screen and (min-width: 560px) {
+	.main-navigation a {
+		padding: 16px;
+	}
 }
 }
 
 
 .main-navigation a:link, .main-navigation a:visited {
 .main-navigation a:link, .main-navigation a:visited {
@@ -2528,12 +2539,12 @@ table th,
 	margin: 0;
 	margin: 0;
 }
 }
 
 
-.social-navigation > div > ul > li:first-of-type {
-	margin-right: calc(-0.5 * 16px);
+.social-navigation > div > ul > li:first-of-type > a {
+	padding-right: 0;
 }
 }
 
 
-.social-navigation > div > ul > li:last-of-type {
-	margin-left: calc(-0.5 * 16px);
+.social-navigation > div > ul > li:last-of-type > a {
+	padding-left: 0;
 }
 }
 
 
 .social-navigation a {
 .social-navigation a {
@@ -2631,12 +2642,12 @@ table th,
 	display: inline;
 	display: inline;
 }
 }
 
 
-.footer-navigation .footer-menu > li:first-of-type {
-	margin-right: -16px;
+.footer-navigation .footer-menu > li:first-of-type > a {
+	padding-right: 0;
 }
 }
 
 
 .footer-navigation .footer-menu > li:last-of-type {
 .footer-navigation .footer-menu > li:last-of-type {
-	margin-left: -16px;
+	padding-left: 0;
 }
 }
 
 
 .footer-navigation .footer-menu a {
 .footer-navigation .footer-menu a {
@@ -3196,7 +3207,7 @@ img#wpstats {
 
 
 .entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 .entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	width: calc(100% + 256px);
 	width: calc(100% + 256px);
-	max-width: calc(100vw - 32px);
+	max-width: calc(100% - 32px);
 	margin-right: auto;
 	margin-right: auto;
 	margin-left: auto;
 	margin-left: auto;
 }
 }
@@ -3204,35 +3215,35 @@ img#wpstats {
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 560px - 32px) + 256px);
 		width: calc(calc( 560px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 640px) {
 @media only screen and (min-width: 640px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 640px - 32px) + 256px);
 		width: calc(calc( 640px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 782px) {
 @media only screen and (min-width: 782px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 782px - 32px) + 256px);
 		width: calc(calc( 782px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1024px) {
 @media only screen and (min-width: 1024px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 782px - 32px) + 256px);
 		width: calc(calc( 782px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1280px) {
 @media only screen and (min-width: 1280px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 782px - 32px) + 256px);
 		width: calc(calc( 782px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
@@ -3282,70 +3293,70 @@ img#wpstats {
 	/* Letting the box-model do all the work here. */
 	/* Letting the box-model do all the work here. */
 }
 }
 
 
-.alignright {
+.entry-content > .alignright {
 	margin-right: 16px;
 	margin-right: 16px;
 }
 }
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
-	.alignright {
+	.entry-content > .alignright {
 		margin-right: calc( 0.5 * (100vw - calc( 560px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 560px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 640px) {
 @media only screen and (min-width: 640px) {
-	.alignright {
+	.entry-content > .alignright {
 		margin-right: calc( 0.5 * (100vw - calc( 640px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 640px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 782px) {
 @media only screen and (min-width: 782px) {
-	.alignright {
+	.entry-content > .alignright {
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1024px) {
 @media only screen and (min-width: 1024px) {
-	.alignright {
+	.entry-content > .alignright {
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1280px) {
 @media only screen and (min-width: 1280px) {
-	.alignright {
+	.entry-content > .alignright {
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
-.alignleft {
+.entry-content > .alignleft {
 	margin-left: 16px;
 	margin-left: 16px;
 }
 }
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		margin-left: calc( 0.5 * (100vw - calc( 560px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 560px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 640px) {
 @media only screen and (min-width: 640px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		margin-left: calc( 0.5 * (100vw - calc( 640px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 640px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 782px) {
 @media only screen and (min-width: 782px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1024px) {
 @media only screen and (min-width: 1024px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1280px) {
 @media only screen and (min-width: 1280px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
@@ -3358,6 +3369,29 @@ img#wpstats {
  * Vendors
  * Vendors
  * - 3rd-party compatibility styles
  * - 3rd-party compatibility styles
  */
  */
+/**
+ * Subscription Form
+ */
+.wp-block-jetpack-subscriptions form > * {
+	margin-top: 21.312px;
+	margin-bottom: 21.312px;
+}
+
+@media only screen and (min-width: 560px) {
+	.wp-block-jetpack-subscriptions form > * {
+		margin-top: 32px;
+		margin-bottom: 32px;
+	}
+}
+
+.wp-block-jetpack-subscriptions form > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-jetpack-subscriptions form > *:last-child {
+	margin-bottom: 0;
+}
+
 /**
 /**
  * Child Theme Extra Styles
  * Child Theme Extra Styles
  */
  */

+ 104 - 69
brompton/style.css

@@ -1531,12 +1531,29 @@ img {
 	line-height: 1.78;
 	line-height: 1.78;
 }
 }
 
 
-.wp-block-latest-posts .wp-block-latest-posts__post-excerpt {
+.entry-content [class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
+.entry-content .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: currentColor;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
+.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
 	font-size: 0.83333rem;
 	font-size: 0.83333rem;
 	line-height: 1.78;
 	line-height: 1.78;
 	margin: 0;
 	margin: 0;
 }
 }
 
 
+.wp-block-latest-posts.alignfull {
+	padding-left: 16px;
+	padding-right: 16px;
+}
+
+.entry-content [class*="inner-container"] .wp-block-latest-posts.alignfull,
+.entry-content .has-background .wp-block-latest-posts.alignfull {
+	padding-left: 0;
+	padding-right: 0;
+}
+
 .gallery-item {
 .gallery-item {
 	display: inline-block;
 	display: inline-block;
 	text-align: center;
 	text-align: center;
@@ -1962,29 +1979,45 @@ table th,
 	vertical-align: middle;
 	vertical-align: middle;
 }
 }
 
 
-/* Text Alignments */
+/* Block Alignments */
+/**
+ * .alignleft
+ */
 .alignleft {
 .alignleft {
 	/*rtl:ignore*/
 	/*rtl:ignore*/
 	text-align: left;
 	text-align: left;
 	/*rtl:ignore*/
 	/*rtl:ignore*/
 	float: left;
 	float: left;
 	margin-top: 0;
 	margin-top: 0;
+	/*rtl:ignore*/
+	margin-right: 16px;
 	margin-bottom: 32px;
 	margin-bottom: 32px;
 }
 }
 
 
+/**
+ * .aligncenter
+ */
 .aligncenter {
 .aligncenter {
 	clear: both;
 	clear: both;
 	float: none;
 	float: none;
 	text-align: center;
 	text-align: center;
 }
 }
 
 
+/**
+ * .alignright
+ */
 .alignright {
 .alignright {
 	/*rtl:ignore*/
 	/*rtl:ignore*/
 	float: right;
 	float: right;
+	margin-top: 0;
+	margin-bottom: 32px;
 	/*rtl:ignore*/
 	/*rtl:ignore*/
 	margin-left: 16px;
 	margin-left: 16px;
+}
+
+.entry-content * > .alignleft + *,
+.entry-content * > .alignright + * {
 	margin-top: 0;
 	margin-top: 0;
-	margin-bottom: 32px;
 }
 }
 
 
 /**
 /**
@@ -2052,78 +2085,50 @@ table th,
 	color: #E8E4DD !important;
 	color: #E8E4DD !important;
 }
 }
 
 
+.has-background p, .has-background a, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
+	color: currentColor;
+}
+
 .has-primary-background-color[class] {
 .has-primary-background-color[class] {
 	background-color: #C04239 !important;
 	background-color: #C04239 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-secondary-background-color[class] {
 .has-secondary-background-color[class] {
 	background-color: #FFFFFF !important;
 	background-color: #FFFFFF !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-foreground-background-color[class] {
 .has-foreground-background-color[class] {
 	background-color: #252E36 !important;
 	background-color: #252E36 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-foreground-light-background-color[class] {
 .has-foreground-light-background-color[class] {
 	background-color: #666666 !important;
 	background-color: #666666 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-foreground-dark-background-color[class] {
 .has-foreground-dark-background-color[class] {
 	background-color: #474747 !important;
 	background-color: #474747 !important;
 	color: #E8E4DD;
 	color: #E8E4DD;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-background-light-background-color[class] {
 .has-background-light-background-color[class] {
 	background-color: #CFCDC7 !important;
 	background-color: #CFCDC7 !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-background-dark-background-color[class] {
 .has-background-dark-background-color[class] {
 	background-color: #B9B6B2 !important;
 	background-color: #B9B6B2 !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .has-background-background-color[class] {
 .has-background-background-color[class] {
 	background-color: #E8E4DD !important;
 	background-color: #E8E4DD !important;
 	color: #252E36;
 	color: #252E36;
 }
 }
 
 
-.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 {
-	color: currentColor;
-}
-
 .is-small-text,
 .is-small-text,
 .has-small-font-size {
 .has-small-font-size {
 	font-size: 0.83333rem;
 	font-size: 0.83333rem;
@@ -2419,14 +2424,6 @@ table th,
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type {
-	margin-left: -16px;
-}
-
-.main-navigation > div > ul > li:last-of-type {
-	margin-right: -16px;
-}
-
 .main-navigation > div > ul > li > a {
 .main-navigation > div > ul > li > a {
 	line-height: 1;
 	line-height: 1;
 }
 }
@@ -2446,6 +2443,15 @@ table th,
 	margin-top: -0.11em;
 	margin-top: -0.11em;
 }
 }
 
 
+@media only screen and (min-width: 560px) {
+	.main-navigation > div > ul > li:first-of-type > a {
+		padding-left: 0;
+	}
+	.main-navigation > div > ul > li:last-of-type > a {
+		padding-right: 0;
+	}
+}
+
 .main-navigation > div > ul > li > .sub-menu {
 .main-navigation > div > ul > li > .sub-menu {
 	margin: 0;
 	margin: 0;
 	position: relative;
 	position: relative;
@@ -2475,7 +2481,13 @@ table th,
 	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 0.83333rem;
 	font-size: 0.83333rem;
 	font-weight: 900;
 	font-weight: 900;
-	padding: 16px;
+	padding: 16px 0;
+}
+
+@media only screen and (min-width: 560px) {
+	.main-navigation a {
+		padding: 16px;
+	}
 }
 }
 
 
 .main-navigation a:link, .main-navigation a:visited {
 .main-navigation a:link, .main-navigation a:visited {
@@ -2532,12 +2544,12 @@ table th,
 	margin: 0;
 	margin: 0;
 }
 }
 
 
-.social-navigation > div > ul > li:first-of-type {
-	margin-left: calc(-0.5 * 16px);
+.social-navigation > div > ul > li:first-of-type > a {
+	padding-left: 0;
 }
 }
 
 
-.social-navigation > div > ul > li:last-of-type {
-	margin-right: calc(-0.5 * 16px);
+.social-navigation > div > ul > li:last-of-type > a {
+	padding-right: 0;
 }
 }
 
 
 .social-navigation a {
 .social-navigation a {
@@ -2635,12 +2647,12 @@ table th,
 	display: inline;
 	display: inline;
 }
 }
 
 
-.footer-navigation .footer-menu > li:first-of-type {
-	margin-left: -16px;
+.footer-navigation .footer-menu > li:first-of-type > a {
+	padding-left: 0;
 }
 }
 
 
 .footer-navigation .footer-menu > li:last-of-type {
 .footer-navigation .footer-menu > li:last-of-type {
-	margin-right: -16px;
+	padding-right: 0;
 }
 }
 
 
 .footer-navigation .footer-menu a {
 .footer-navigation .footer-menu a {
@@ -3200,7 +3212,7 @@ img#wpstats {
 
 
 .entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 .entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	width: calc(100% + 256px);
 	width: calc(100% + 256px);
-	max-width: calc(100vw - 32px);
+	max-width: calc(100% - 32px);
 	margin-left: auto;
 	margin-left: auto;
 	margin-right: auto;
 	margin-right: auto;
 }
 }
@@ -3208,35 +3220,35 @@ img#wpstats {
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 560px - 32px) + 256px);
 		width: calc(calc( 560px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 640px) {
 @media only screen and (min-width: 640px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 640px - 32px) + 256px);
 		width: calc(calc( 640px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 782px) {
 @media only screen and (min-width: 782px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 782px - 32px) + 256px);
 		width: calc(calc( 782px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1024px) {
 @media only screen and (min-width: 1024px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 782px - 32px) + 256px);
 		width: calc(calc( 782px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1280px) {
 @media only screen and (min-width: 1280px) {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
 		width: calc(calc( 782px - 32px) + 256px);
 		width: calc(calc( 782px - 32px) + 256px);
-		max-width: calc(100vw - 32px);
+		max-width: calc(100% - 32px);
 	}
 	}
 }
 }
 
 
@@ -3286,81 +3298,81 @@ img#wpstats {
 	/* Letting the box-model do all the work here. */
 	/* Letting the box-model do all the work here. */
 }
 }
 
 
-.alignright {
+.entry-content > .alignright {
 	/*rtl:ignore*/
 	/*rtl:ignore*/
 	margin-right: 16px;
 	margin-right: 16px;
 }
 }
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
-	.alignright {
+	.entry-content > .alignright {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-right: calc( 0.5 * (100vw - calc( 560px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 560px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 640px) {
 @media only screen and (min-width: 640px) {
-	.alignright {
+	.entry-content > .alignright {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-right: calc( 0.5 * (100vw - calc( 640px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 640px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 782px) {
 @media only screen and (min-width: 782px) {
-	.alignright {
+	.entry-content > .alignright {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1024px) {
 @media only screen and (min-width: 1024px) {
-	.alignright {
+	.entry-content > .alignright {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1280px) {
 @media only screen and (min-width: 1280px) {
-	.alignright {
+	.entry-content > .alignright {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-right: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
-.alignleft {
+.entry-content > .alignleft {
 	/*rtl:ignore*/
 	/*rtl:ignore*/
 	margin-left: 16px;
 	margin-left: 16px;
 }
 }
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-left: calc( 0.5 * (100vw - calc( 560px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 560px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 640px) {
 @media only screen and (min-width: 640px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-left: calc( 0.5 * (100vw - calc( 640px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 640px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 782px) {
 @media only screen and (min-width: 782px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1024px) {
 @media only screen and (min-width: 1024px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
 }
 }
 
 
 @media only screen and (min-width: 1280px) {
 @media only screen and (min-width: 1280px) {
-	.alignleft {
+	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		/*rtl:ignore*/
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 		margin-left: calc( 0.5 * (100vw - calc( 782px - 32px)));
 	}
 	}
@@ -3374,6 +3386,29 @@ img#wpstats {
  * Vendors
  * Vendors
  * - 3rd-party compatibility styles
  * - 3rd-party compatibility styles
  */
  */
+/**
+ * Subscription Form
+ */
+.wp-block-jetpack-subscriptions form > * {
+	margin-top: 21.312px;
+	margin-bottom: 21.312px;
+}
+
+@media only screen and (min-width: 560px) {
+	.wp-block-jetpack-subscriptions form > * {
+		margin-top: 32px;
+		margin-bottom: 32px;
+	}
+}
+
+.wp-block-jetpack-subscriptions form > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-jetpack-subscriptions form > *:last-child {
+	margin-bottom: 0;
+}
+
 /**
 /**
  * Child Theme Extra Styles
  * Child Theme Extra Styles
  */
  */