Browse Source

Friendly Business: Standardize the margin around Media & Text block contents

Danny Dudzic 6 years ago
parent
commit
3cf31bbe2d

+ 5 - 31
friendly-business/sass/blocks/_blocks.scss

@@ -783,8 +783,12 @@
 				color: inherit;
 			}
 
+			> :first-child {
+				margin-top: 0.88889rem;
+			}
+
 			> :last-child {
-				margin-bottom: 1.5em;
+				margin-bottom: 0.88889rem;
 			}
 
 			h1,
@@ -797,17 +801,6 @@
 			}
 		}
 
-		&.has-media-on-the-right .wp-block-media-text__content {
-			> :first-child {
-				margin-top: $size__vertical-spacing-unit;
-			}
-
-			> :last-child {
-				margin-bottom: $size__vertical-spacing-unit;
-			}
-		}
-
-
 		&.has-media-on-the-right.is-stacked-on-mobile {
 			.wp-block-media-text__media {
 				grid-area: media-text-content;
@@ -833,25 +826,6 @@
 			}
 		}
 
-		@include media(tablet) {
-
-			.wp-block-media-text__content {
-				> :last-child {
-					margin-bottom: $size__vertical-spacing-unit;
-				}
-			}
-
-			&.has-media-on-the-right {
-
-				.wp-block-media-text__content {
-
-					> :first-child {
-						margin-top: $size__vertical-spacing-unit;
-					}
-				}
-			}
-		}
-
 		@include media(desktop) {
 			.wp-block-media-text__content {
 				padding-left: 8%;

+ 5 - 18
friendly-business/style-rtl.css

@@ -4210,8 +4210,12 @@ body.page .main-navigation {
   color: inherit;
 }
 
+.entry .entry-content .wp-block-media-text .wp-block-media-text__content > :first-child {
+  margin-top: 0.88889rem;
+}
+
 .entry .entry-content .wp-block-media-text .wp-block-media-text__content > :last-child {
-  margin-bottom: 1.5em;
+  margin-bottom: 0.88889rem;
 }
 
 .entry .entry-content .wp-block-media-text .wp-block-media-text__content h1,
@@ -4223,14 +4227,6 @@ body.page .main-navigation {
   text-align: right;
 }
 
-.entry .entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content > :first-child {
-  margin-top: 32px;
-}
-
-.entry .entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content > :last-child {
-  margin-bottom: 32px;
-}
-
 .entry .entry-content .wp-block-media-text.has-media-on-the-right.is-stacked-on-mobile .wp-block-media-text__media {
   grid-area: media-text-content;
 }
@@ -4252,15 +4248,6 @@ body.page .main-navigation {
   }
 }
 
-@media only screen and (min-width: 768px) {
-  .entry .entry-content .wp-block-media-text .wp-block-media-text__content > :last-child {
-    margin-bottom: 32px;
-  }
-  .entry .entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content > :first-child {
-    margin-top: 32px;
-  }
-}
-
 @media only screen and (min-width: 1168px) {
   .entry .entry-content .wp-block-media-text .wp-block-media-text__content {
     padding-right: 8%;

+ 5 - 18
friendly-business/style.css

@@ -4222,8 +4222,12 @@ body.page .main-navigation {
   color: inherit;
 }
 
+.entry .entry-content .wp-block-media-text .wp-block-media-text__content > :first-child {
+  margin-top: 0.88889rem;
+}
+
 .entry .entry-content .wp-block-media-text .wp-block-media-text__content > :last-child {
-  margin-bottom: 1.5em;
+  margin-bottom: 0.88889rem;
 }
 
 .entry .entry-content .wp-block-media-text .wp-block-media-text__content h1,
@@ -4235,14 +4239,6 @@ body.page .main-navigation {
   text-align: left;
 }
 
-.entry .entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content > :first-child {
-  margin-top: 32px;
-}
-
-.entry .entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content > :last-child {
-  margin-bottom: 32px;
-}
-
 .entry .entry-content .wp-block-media-text.has-media-on-the-right.is-stacked-on-mobile .wp-block-media-text__media {
   grid-area: media-text-content;
 }
@@ -4264,15 +4260,6 @@ body.page .main-navigation {
   }
 }
 
-@media only screen and (min-width: 768px) {
-  .entry .entry-content .wp-block-media-text .wp-block-media-text__content > :last-child {
-    margin-bottom: 32px;
-  }
-  .entry .entry-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content > :first-child {
-    margin-top: 32px;
-  }
-}
-
 @media only screen and (min-width: 1168px) {
   .entry .entry-content .wp-block-media-text .wp-block-media-text__content {
     padding-left: 8%;