Browse Source

Remove unnecessary block alignment selectors from Seedlet and Seedlet blocks.

Jeffrey Ong 5 years ago
parent
commit
838317130b

+ 0 - 28
seedlet-blocks/style.css

@@ -46,32 +46,4 @@ GNU General Public License for more details.
 	--global--color-primary: var(--wp--preset--color--primary);
 	--global--color-secondary: var(--wp--preset--color--secondary);
 	--global--color-tertiary: var(--wp--preset--color--tertiary);
-}
-
-/* Set up alignments */
-.wp-block-group .wp-block-group__inner-container > * {
-	max-width: var(--responsive--aligndefault-width);
-	margin-left: auto;
-	margin-right: auto;
-}
-
-.wp-block-group .wp-block-group__inner-container > .alignwide {
-	max-width: var(--responsive--alignwide-width);
-	margin-left: auto;
-	margin-right: auto;
-}
-
-.wp-block-group .wp-block-group__inner-container > .alignfull {
-	max-width: calc(100% + (2 * var(--global--spacing-horizontal)));
-	width: calc(100% + (2 * var(--global--spacing-horizontal)));
-	margin-left: calc(-1 * var(--global--spacing-horizontal));
-	margin-right: auto;
-}
-
-/* Make sure full-width items in entry content show up as full-width. */
-.wp-block-group.site-content .wp-block-group__inner-container .entry-content {
-	max-width: calc(100% + (2 * var(--global--spacing-horizontal)));
-	width: calc(100% + (2 * var(--global--spacing-horizontal)));
-	margin-left: calc(-1 * var(--global--spacing-horizontal));
-	margin-right: auto;
 }

+ 60 - 338
seedlet/assets/css/ie.css

@@ -215,6 +215,66 @@ hr.wp-block-separator.is-style-wide {
 	max-width: 602px;
 	}
 }
+.entry-content > .alignleft {
+	max-width: 100%;
+	margin-left: auto;
+	margin-right: auto;
+}
+@media only screen and (min-width: 482px) {
+	.entry-content > .alignleft {
+	max-width: 432px;
+	}
+}
+@media only screen and (min-width: 592px) {
+	.entry-content > .alignleft {
+	max-width: 432px;
+	}
+}
+@media only screen and (min-width: 652px) {
+	.entry-content > .alignleft {
+	max-width: 542px;
+	}
+}
+@media only screen and (min-width: 822px) {
+	.entry-content > .alignleft {
+	max-width: 602px;
+	}
+}
+@media only screen and (min-width: 1024px) {
+	.entry-content > .alignleft {
+	max-width: 602px;
+	}
+}
+.entry-content > .alignright {
+	max-width: 100%;
+	margin-left: auto;
+	margin-right: auto;
+}
+@media only screen and (min-width: 482px) {
+	.entry-content > .alignright {
+	max-width: 432px;
+	}
+}
+@media only screen and (min-width: 592px) {
+	.entry-content > .alignright {
+	max-width: 432px;
+	}
+}
+@media only screen and (min-width: 652px) {
+	.entry-content > .alignright {
+	max-width: 542px;
+	}
+}
+@media only screen and (min-width: 822px) {
+	.entry-content > .alignright {
+	max-width: 602px;
+	}
+}
+@media only screen and (min-width: 1024px) {
+	.entry-content > .alignright {
+	max-width: 602px;
+	}
+}
 .entry-content .wp-audio-shortcode {
 	max-width: 100%;
 	margin-left: auto;
@@ -509,174 +569,6 @@ hr.wp-block-separator.is-style-wide {
 }
 
 @media only screen and (min-width: 482px) {
-	.entry-content .wp-block-file.alignleft {
-		/*rtl:ignore*/
-		margin-left: calc(50vw - 216px);
-		/*rtl:ignore*/
-		margin-right: 25px;
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-file.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	.entry-content .wp-block-pullquote.alignleft {
-		/*rtl:ignore*/
-		margin-left: calc(50vw - 216px);
-		/*rtl:ignore*/
-		margin-right: 25px;
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-pullquote.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	.entry-content .wp-block-video.alignleft {
-		/*rtl:ignore*/
-		margin-left: calc(50vw - 216px);
-		/*rtl:ignore*/
-		margin-right: 25px;
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-video.alignleft {
-		margin-left: calc(50vw - 301px);
-		}
-	}
 	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		margin-left: calc(50vw - 216px);
@@ -743,174 +635,6 @@ hr.wp-block-separator.is-style-wide {
 }
 
 @media only screen and (min-width: 482px) {
-	.entry-content .wp-block-file.alignright {
-		/*rtl:ignore*/
-		margin-left: 25px;
-		/*rtl:ignore*/
-		margin-right: calc(50vw - 216px);
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-file.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	.entry-content .wp-block-pullquote.alignright {
-		/*rtl:ignore*/
-		margin-left: 25px;
-		/*rtl:ignore*/
-		margin-right: calc(50vw - 216px);
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-pullquote.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	.entry-content .wp-block-video.alignright {
-		/*rtl:ignore*/
-		margin-left: 25px;
-		/*rtl:ignore*/
-		margin-right: calc(50vw - 216px);
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 482px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 592px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 216px);
-		}
-	}
-	@media only screen and (min-width: 652px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 271px);
-		}
-	}
-	@media only screen and (min-width: 822px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
-	@media only screen and (min-width: 1024px) {
-		.entry-content .wp-block-video.alignright {
-		margin-right: calc(50vw - 301px);
-		}
-	}
 	.entry-content > .alignright {
 		/*rtl:ignore*/
 		margin-left: 25px;
@@ -3401,8 +3125,6 @@ p.has-background {
 
 .wp-block-pullquote {
 	padding: 40px 0;
-	margin-left: 0;
-	margin-right: 0;
 	text-align: left;
 	border-top-color: transparent;
 	border-top-width: 0;

+ 0 - 8
seedlet/assets/sass/blocks/file/_style.scss

@@ -15,12 +15,4 @@
 		display: inline-block;
 		padding: calc(0.5 * var(--button--padding-vertical)) calc(0.5 * var(--button--padding-horizontal));
 	}
-
-	.entry-content &.alignleft {
-		@extend %responsive-alignleft;
-	}
-
-	.entry-content &.alignright {
-		@extend %responsive-alignright;
-	}
 }

+ 0 - 10
seedlet/assets/sass/blocks/pullquote/_style.scss

@@ -1,7 +1,5 @@
 .wp-block-pullquote {
 	padding: calc( 2 * var(--global--spacing-unit) ) 0;
-	margin-left: 0;
-	margin-right: 0;
 	text-align: left;
 	// Theme?
 	border-top-color: var(--pullquote--border-color);
@@ -72,12 +70,4 @@
 			color: currentColor;
 		}
 	}
-
-	.entry-content &.alignleft {
-		@extend %responsive-alignleft;
-	}
-
-	.entry-content &.alignright {
-		@extend %responsive-alignright;
-	}
 }

+ 2 - 0
seedlet/assets/sass/blocks/utilities/_style.scss

@@ -27,6 +27,7 @@
 .entry-content > .alignleft {
 	@extend %responsive-alignleft-mobile;
 	@extend %responsive-alignleft;
+	@extend %responsive-aligndefault-width;
 }
 
 /**
@@ -59,6 +60,7 @@
 .entry-content > .alignright {
 	@extend %responsive-alignright-mobile;
 	@extend %responsive-alignright;
+	@extend %responsive-aligndefault-width;
 }
 
 // Make sure siblings of floated elements are top-aligned when nested

+ 0 - 8
seedlet/assets/sass/blocks/video/_style.scss

@@ -7,14 +7,6 @@
 		margin-bottom: var(--global--spacing-unit);
 		text-align: center;
 	}
-
-	.entry-content &.alignleft {
-		@extend %responsive-alignleft;
-	}
-
-	.entry-content &.alignright {
-		@extend %responsive-alignright;
-	}
 }
 
 * > figure > video {

+ 3 - 5
seedlet/style-rtl.css

@@ -356,7 +356,7 @@ Included in theme screenshot.
  * Extends
  */
 .default-max-width, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
-.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-thumbnail, .navigation {
+.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content > .alignleft, .entry-content > .alignright, .entry-content .wp-audio-shortcode, .post-thumbnail, .navigation {
 	max-width: var(--responsive--aligndefault-width);
 	margin-right: auto;
 	margin-left: auto;
@@ -397,7 +397,7 @@ Included in theme screenshot.
 }
 
 @media only screen and (min-width: 482px) {
-	.entry-content .wp-block-file.alignleft, .entry-content .wp-block-pullquote.alignleft, .entry-content .wp-block-video.alignleft, .entry-content > .alignleft {
+	.entry-content > .alignleft {
 		margin-left: var(--responsive--alignleft-margin);
 		margin-right: var(--global--spacing-horizontal);
 	}
@@ -409,7 +409,7 @@ Included in theme screenshot.
 }
 
 @media only screen and (min-width: 482px) {
-	.entry-content .wp-block-file.alignright, .entry-content .wp-block-pullquote.alignright, .entry-content .wp-block-video.alignright, .entry-content > .alignright {
+	.entry-content > .alignright {
 		margin-left: var(--global--spacing-horizontal);
 		margin-right: var(--responsive--alignright-margin);
 	}
@@ -2031,8 +2031,6 @@ p.has-background {
 
 .wp-block-pullquote {
 	padding: calc( 2 * var(--global--spacing-unit)) 0;
-	margin-right: 0;
-	margin-left: 0;
 	text-align: right;
 	border-top-color: var(--pullquote--border-color);
 	border-top-width: var(--pullquote--border-width);

+ 3 - 5
seedlet/style.css

@@ -356,7 +356,7 @@ Included in theme screenshot.
  * Extends
  */
 .default-max-width, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
-.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-thumbnail, .navigation {
+.entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content > .alignleft, .entry-content > .alignright, .entry-content .wp-audio-shortcode, .post-thumbnail, .navigation {
 	max-width: var(--responsive--aligndefault-width);
 	margin-left: auto;
 	margin-right: auto;
@@ -399,7 +399,7 @@ Included in theme screenshot.
 }
 
 @media only screen and (min-width: 482px) {
-	.entry-content .wp-block-file.alignleft, .entry-content .wp-block-pullquote.alignleft, .entry-content .wp-block-video.alignleft, .entry-content > .alignleft {
+	.entry-content > .alignleft {
 		/*rtl:ignore*/
 		margin-left: var(--responsive--alignleft-margin);
 		/*rtl:ignore*/
@@ -415,7 +415,7 @@ Included in theme screenshot.
 }
 
 @media only screen and (min-width: 482px) {
-	.entry-content .wp-block-file.alignright, .entry-content .wp-block-pullquote.alignright, .entry-content .wp-block-video.alignright, .entry-content > .alignright {
+	.entry-content > .alignright {
 		/*rtl:ignore*/
 		margin-left: var(--global--spacing-horizontal);
 		/*rtl:ignore*/
@@ -2039,8 +2039,6 @@ p.has-background {
 
 .wp-block-pullquote {
 	padding: calc( 2 * var(--global--spacing-unit)) 0;
-	margin-left: 0;
-	margin-right: 0;
 	text-align: left;
 	border-top-color: var(--pullquote--border-color);
 	border-top-width: var(--pullquote--border-width);