Pārlūkot izejas kodu

Elegant Business: Fix margins between columns block

Allan Cole 6 gadi atpakaļ
vecāks
revīzija
58d60c502e

+ 9 - 8
elegant-business/sass/blocks/_blocks.scss

@@ -815,27 +815,28 @@
 		}
 		}
 
 
 		@include media(tablet) {
 		@include media(tablet) {
-			.wp-block-column > * {
+
+			.wp-block-column {
+				margin-left: #{0.5 * $size__spacing-unit};
+				margin-right: #{0.5 * $size__spacing-unit};
 
 
 				&:first-child {
 				&:first-child {
-					margin-top: 0;
+					margin-left: 0;
 				}
 				}
 
 
 				&:last-child {
 				&:last-child {
-					margin-bottom: 0;
+					margin-right: 0;
 				}
 				}
 			}
 			}
 
 
-			&[class*='has-'] > * {
-				margin-left: $size__spacing-unit;
-				margin-right: $size__spacing-unit;
+			.wp-block-column > * {
 
 
 				&:first-child {
 				&:first-child {
-					margin-left: 0;
+					margin-top: 0;
 				}
 				}
 
 
 				&:last-child {
 				&:last-child {
-					margin-right: 0;
+					margin-bottom: 0;
 				}
 				}
 			}
 			}
 
 

+ 1 - 3
elegant-business/style-jetpack.css

@@ -89,12 +89,10 @@ div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedp
 /**
 /**
  * Content Options
  * Content Options
  */
  */
-
 /**
 /**
  * Blocks
  * Blocks
  */
  */
-
-/* Contact Form */
+/* Content Form */
 .contact-form label span {
 .contact-form label span {
   color: #767676;
   color: #767676;
 }
 }

+ 10 - 10
elegant-business/style-rtl.css

@@ -4211,22 +4211,22 @@ body.page .main-navigation {
 }
 }
 
 
 @media only screen and (min-width: 768px) {
 @media only screen and (min-width: 768px) {
+  .entry .entry-content .wp-block-columns .wp-block-column {
+    margin-right: 0.5rem;
+    margin-left: 0.5rem;
+  }
+  .entry .entry-content .wp-block-columns .wp-block-column:first-child {
+    margin-right: 0;
+  }
+  .entry .entry-content .wp-block-columns .wp-block-column:last-child {
+    margin-left: 0;
+  }
   .entry .entry-content .wp-block-columns .wp-block-column > *:first-child {
   .entry .entry-content .wp-block-columns .wp-block-column > *:first-child {
     margin-top: 0;
     margin-top: 0;
   }
   }
   .entry .entry-content .wp-block-columns .wp-block-column > *:last-child {
   .entry .entry-content .wp-block-columns .wp-block-column > *:last-child {
     margin-bottom: 0;
     margin-bottom: 0;
   }
   }
-  .entry .entry-content .wp-block-columns[class*='has-'] > * {
-    margin-right: 1rem;
-    margin-left: 1rem;
-  }
-  .entry .entry-content .wp-block-columns[class*='has-'] > *:first-child {
-    margin-right: 0;
-  }
-  .entry .entry-content .wp-block-columns[class*='has-'] > *:last-child {
-    margin-left: 0;
-  }
   .entry .entry-content .wp-block-columns.alignfull {
   .entry .entry-content .wp-block-columns.alignfull {
     padding-right: calc(2 * 1rem);
     padding-right: calc(2 * 1rem);
     padding-left: calc(2 * 1rem);
     padding-left: calc(2 * 1rem);

+ 10 - 10
elegant-business/style.css

@@ -4223,22 +4223,22 @@ body.page .main-navigation {
 }
 }
 
 
 @media only screen and (min-width: 768px) {
 @media only screen and (min-width: 768px) {
+  .entry .entry-content .wp-block-columns .wp-block-column {
+    margin-left: 0.5rem;
+    margin-right: 0.5rem;
+  }
+  .entry .entry-content .wp-block-columns .wp-block-column:first-child {
+    margin-left: 0;
+  }
+  .entry .entry-content .wp-block-columns .wp-block-column:last-child {
+    margin-right: 0;
+  }
   .entry .entry-content .wp-block-columns .wp-block-column > *:first-child {
   .entry .entry-content .wp-block-columns .wp-block-column > *:first-child {
     margin-top: 0;
     margin-top: 0;
   }
   }
   .entry .entry-content .wp-block-columns .wp-block-column > *:last-child {
   .entry .entry-content .wp-block-columns .wp-block-column > *:last-child {
     margin-bottom: 0;
     margin-bottom: 0;
   }
   }
-  .entry .entry-content .wp-block-columns[class*='has-'] > * {
-    margin-left: 1rem;
-    margin-right: 1rem;
-  }
-  .entry .entry-content .wp-block-columns[class*='has-'] > *:first-child {
-    margin-left: 0;
-  }
-  .entry .entry-content .wp-block-columns[class*='has-'] > *:last-child {
-    margin-right: 0;
-  }
   .entry .entry-content .wp-block-columns.alignfull {
   .entry .entry-content .wp-block-columns.alignfull {
     padding-left: calc(2 * 1rem);
     padding-left: calc(2 * 1rem);
     padding-right: calc(2 * 1rem);
     padding-right: calc(2 * 1rem);