Browse Source

Skatepark: Add cover block scss with positioning values

Sarah Norris 3 years ago
parent
commit
8a37729952
3 changed files with 38 additions and 0 deletions
  1. 18 0
      skatepark/assets/theme.css
  2. 19 0
      skatepark/sass/blocks/_cover.scss
  3. 1 0
      skatepark/sass/theme.scss

+ 18 - 0
skatepark/assets/theme.css

@@ -139,6 +139,24 @@ p {
 	letter-spacing: 0.1em;
 }
 
+.wp-block-cover {
+	padding: 11.5%;
+}
+
+.wp-block-cover .wp-block-cover__inner-container {
+	width: auto;
+}
+
+.wp-block-cover.has-custom-content-position.is-position-top-left, .wp-block-cover.has-custom-content-position.is-position-top-center, .wp-block-cover.has-custom-content-position.is-position-top-right {
+	padding-top: 5.75%;
+	padding-bottom: 17.25%;
+}
+
+.wp-block-cover.has-custom-content-position.is-position-bottom-left, .wp-block-cover.has-custom-content-position.is-position-bottom-center, .wp-block-cover.has-custom-content-position.is-position-bottom-right {
+	padding-top: 17.25%;
+	padding-bottom: 5.75%;
+}
+
 .wp-block-post-comments .reply a {
 	--wp--custom--button--typography--font-size: var(--wp--preset--font-size--normal);
 	border-style: var(--wp--custom--button--border--style);

+ 19 - 0
skatepark/sass/blocks/_cover.scss

@@ -0,0 +1,19 @@
+.wp-block-cover {
+	padding: 11.5%;
+
+	.wp-block-cover__inner-container {
+		width: auto;
+	}
+
+	&.has-custom-content-position {
+		&.is-position-top-left, &.is-position-top-center, &.is-position-top-right {
+			padding-top: 5.75%;
+			padding-bottom: 17.25%;
+		}
+
+		&.is-position-bottom-left, &.is-position-bottom-center, &.is-position-bottom-right {
+			padding-top: 17.25%;
+			padding-bottom: 5.75%;
+		}
+	}
+}

+ 1 - 0
skatepark/sass/theme.scss

@@ -5,6 +5,7 @@
 @import "blocks/author";
 @import "../../blockbase/sass/blocks/_buttons-outline-style";
 @import "blocks/buttons";
+@import "blocks/cover";
 @import "blocks/post-comments";
 @import "blocks/post-title";
 @import "blocks/query";