Merge pull request #326 from Automattic/lodestar-add-gutenberg-support

Lodestar: Make sure wide and full alignments can't be applied to two-column panels

lodestar/assets/css/blocks.css

@@ -29,20 +29,23 @@ body:not(.has-sidebar) .site-content {
 }
 
 @media (min-width: 1140px) {
-	body:not(.has-sidebar) .alignwide {
+	body:not(.has-sidebar):not(.lodestar-front-page) .alignwide,
+	body.lodestar-front-page .lodestar-panel:not(.two-column) .alignwide {
 		margin-left: -25%;
 		margin-right: -25%;
 		max-width: 1000%;
 		width: auto;
 	}
 
-	body:not(.has-sidebar) .wp-block-embed.is-type-video.alignwide iframe {
+	body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-embed.is-type-video.alignwide iframe,
+	body.lodestar-front-page .lodestar-panel:not(.two-column) .wp-block-embed.is-type-video.alignwide iframe {
 		width: 100% !important;
 		height: 100% !important;
 	}
 }
 
-body:not(.has-sidebar) .alignfull {
+body:not(.has-sidebar):not(.lodestar-front-page) .alignfull,
+body:not(.has-sidebar).lodestar-front-page .lodestar-panel:not(.two-column) .alignfull {
 	margin-left: calc(50% - 50vw);
 	margin-right: calc(50% - 50vw);
 	max-width: 1000%;
@@ -50,21 +53,29 @@ body:not(.has-sidebar) .alignfull {
 }
 
 /* Make non image-based blocks a bit narrower, so they don't get cut off. */
-body:not(.has-sidebar) .wp-block-columns.alignfull,
-body:not(.has-sidebar) .wp-block-audio.alignfull,
-body:not(.has-sidebar) .wp-block-table.alignfull,
-body:not(.has-sidebar) .wp-block-latest-comments.alignfull,
-body:not(.has-sidebar) .wp-block-categories.alignfull,
-body:not(.has-sidebar) .wp-block-latest-posts.alignfull {
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-columns.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-columns.alignfull,
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-audio.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-audio.alignfull,
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-table.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-table.alignfull,
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-latest-comments.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-latest-comments.alignfull,
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-categories.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-categories.alignfull,
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-latest-posts.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-latest-posts.alignfull {
 	margin-left: calc(50% - 48vw);
 	margin-right: calc(50% - 48vw);
 }
 
-body:not(.has-sidebar) .wp-block-embed.is-type-video iframe {
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-embed.is-type-video iframe,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-embed.is-type-video iframe {
 	max-height: 100%;
 }
 
-body:not(.has-sidebar) .wp-block-embed.is-type-video.alignfull iframe {
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-embed.is-type-video.alignfull iframe,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-embed.is-type-video.alignfull iframe {
 	width: 100% !important;
 	height: 100% !important;
 }
@@ -221,12 +232,14 @@ p.has-drop-cap:not(:focus)::first-letter {
 }
 
 @media (min-width: 1130px) {
-	body:not(.has-sidebar) .wp-block-table.alignwide {
+	body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-table.alignwide,
+	body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-table.alignwide {
 		width: 1050px;
 	}
 }
 
-body:not(.has-sidebar) .wp-block-table.alignfull {
+body:not(.has-sidebar):not(.lodestar-front-page) .wp-block-table.alignfull,
+body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-block-table.alignfull {
 	width: 96vw;
 }