Browse Source

Modern Business: Limit the Media & Text padding fix to mobile

Danny Dudzic 6 years ago
parent
commit
1aedba9bcd

+ 12 - 4
modern-business/sass/blocks/_blocks.scss

@@ -191,11 +191,19 @@
 			}
 		}
 
-		&.alignfull .wp-block-media-text__content {
-			padding: 8% 1rem;
+		&.alignfull {
+			.wp-block-media-text__content {
+				padding: 8% 1rem;
 
-			@include media(tablet) {
-				padding: 8%;
+				@include media(tablet) {
+					padding: 0 #{2 * $size__vertical-spacing-unit} 0 0;
+				}
+			}
+
+			&.has-media-on-the-right .wp-block-media-text__content {
+				@include media(tablet) {
+					padding: 0 0 0 #{2 * $size__vertical-spacing-unit};
+				}
 			}
 		}
 

+ 8 - 2
modern-business/style-rtl.css

@@ -3585,12 +3585,18 @@ body.page .main-navigation {
 }
 
 .entry .entry-content .wp-block-media-text.alignfull .wp-block-media-text__content {
-  padding: 0 1rem;
+  padding: 8% 1rem;
 }
 
 @media only screen and (min-width: 768px) {
   .entry .entry-content .wp-block-media-text.alignfull .wp-block-media-text__content {
-    padding: 8%;
+    padding: 0 0 0 64px;
+  }
+}
+
+@media only screen and (min-width: 768px) {
+  .entry .entry-content .wp-block-media-text.alignfull.has-media-on-the-right .wp-block-media-text__content {
+    padding: 0 64px 0 0;
   }
 }
 

+ 7 - 1
modern-business/style.css

@@ -3602,7 +3602,13 @@ body.page .main-navigation {
 
 @media only screen and (min-width: 768px) {
   .entry .entry-content .wp-block-media-text.alignfull .wp-block-media-text__content {
-    padding: 8%;
+    padding: 0 64px 0 0;
+  }
+}
+
+@media only screen and (min-width: 768px) {
+  .entry .entry-content .wp-block-media-text.alignfull.has-media-on-the-right .wp-block-media-text__content {
+    padding: 0 0 0 64px;
   }
 }