瀏覽代碼

Rockfield: Add block styles, Adjust Site Main margin bottom/top

Thomas Guillot 6 年之前
父節點
當前提交
b422b1922f

+ 2 - 2
rockfield/sass/_config-child-theme-deep.scss

@@ -256,7 +256,7 @@ $config-pullquote: (
 	),
 	// Border
 	"border": (
-		"width": #{0.25 * $baseline-unit},
+		"width": 2px,
 	),
 );
 
@@ -275,7 +275,7 @@ $config-quote: (
  */
 
 $config-separator: (
-	"height": #{0.25 * $baseline-unit},
+	"height": 2px,
 );
 
 /**

+ 79 - 0
rockfield/sass/_extra-child-theme.scss

@@ -188,6 +188,16 @@ a {
 /**
  * Content Area
  */
+.site-main > * {
+	margin-bottom: #{map-deep-get($config-global, "spacing", "vertical")};
+	margin-top: #{map-deep-get($config-global, "spacing", "vertical")};
+
+	@include media(mobile) {
+		margin-bottom: #{2 * map-deep-get($config-global, "spacing", "vertical")};
+		margin-top: #{2 * map-deep-get($config-global, "spacing", "vertical")};
+	}
+}
+
 @include media(mobile) {
 	#main {
 		padding-top: #{2 * map-deep-get($config-global, "spacing", "vertical")};
@@ -239,6 +249,68 @@ a {
 	text-transform: uppercase;
 }
 
+/**
+ * Blocks
+ */
+// Cover & Hero block
+.wp-block-cover .wp-block-cover__inner-container,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box {
+	& > * {
+		margin-top: #{ 0.666 * map-deep-get($config-global, "spacing", "vertical") };
+		margin-bottom: #{ 0.666 * map-deep-get($config-global, "spacing", "vertical") };
+
+		@include media(mobile) {
+			margin-top: map-deep-get($config-global, "spacing", "vertical");
+			margin-bottom: map-deep-get($config-global, "spacing", "vertical");
+		}
+
+		&:first-child {
+			margin-top: 0;
+		}
+
+		&:last-child {
+			margin-bottom: 0;
+		}
+	}
+}
+
+// Pullquote
+.wp-block-pullquote {
+	border-bottom-width: 1px;
+
+	blockquote {
+		padding: 0;
+	}
+}
+
+// Table block
+table,
+.wp-block-table {
+	td,
+	th {
+		border-color: #{map-deep-get($config-global, "color", "border", "default")};
+	}
+}
+
+// Blog Posts Listing
+.a8c-posts-list__item {
+	margin-bottom: #{map-deep-get($config-global, "spacing", "vertical")};
+	margin-top: #{map-deep-get($config-global, "spacing", "vertical")};
+
+	@include media(mobile) {
+		margin-bottom: #{2 * map-deep-get($config-global, "spacing", "vertical")};
+		margin-top: #{2 * map-deep-get($config-global, "spacing", "vertical")};
+	}
+}
+
+.a8c-posts-list__listing:not(:last-child) {
+	margin-bottom: #{map-deep-get($config-global, "spacing", "vertical")};
+
+	@include media(mobile) {
+		margin-bottom: #{2 * map-deep-get($config-global, "spacing", "vertical")};
+	}
+}
+
 /**
  * Comments
  */
@@ -274,6 +346,13 @@ a {
 	display: flex;
 }
 
+.comment-respond {
+	.form-submit {
+		display: flex;
+		justify-content: flex-end;
+	}
+}
+
 @include media(tablet) {
 	.comment-meta {
 		border-right: 1px solid #{map-deep-get($config-global, "color", "border", "default")};

+ 2 - 2
rockfield/sass/style-child-theme-editor.scss

@@ -35,8 +35,8 @@
 /**
  * Extras
  */
-.editor-post-title__input {
-	text-align: center;
+.wp-block-pullquote {
+	border-bottom-width: 1px;
 }
 
 .wp-block-button__link {

+ 2 - 2
rockfield/style-editor.css

@@ -853,8 +853,8 @@ table th,
 /**
  * Extras
  */
-.editor-post-title__input {
-	text-align: center;
+.wp-block-pullquote {
+	border-bottom-width: 1px;
 }
 
 .wp-block-button__link {

+ 81 - 0
rockfield/style-rtl.css

@@ -3555,6 +3555,18 @@ p:not(.site-title) a:hover {
 /**
  * Content Area
  */
+.site-main > * {
+	margin-bottom: 32px;
+	margin-top: 32px;
+}
+
+@media only screen and (min-width: 560px) {
+	.site-main > * {
+		margin-bottom: 64px;
+		margin-top: 64px;
+	}
+}
+
 @media only screen and (min-width: 560px) {
 	#main {
 		padding-top: 64px;
@@ -3602,6 +3614,70 @@ p:not(.site-title) a:hover {
 	text-transform: uppercase;
 }
 
+/**
+ * Blocks
+ */
+.wp-block-cover .wp-block-cover__inner-container > *,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box > * {
+	margin-top: 21.312px;
+	margin-bottom: 21.312px;
+}
+
+@media only screen and (min-width: 560px) {
+	.wp-block-cover .wp-block-cover__inner-container > *,
+	.wp-block-coblocks-hero .wp-block-coblocks-hero__box > * {
+		margin-top: 32px;
+		margin-bottom: 32px;
+	}
+}
+
+.wp-block-cover .wp-block-cover__inner-container > *:first-child,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-cover .wp-block-cover__inner-container > *:last-child,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box > *:last-child {
+	margin-bottom: 0;
+}
+
+.wp-block-pullquote {
+	border-bottom-width: 1px;
+}
+
+.wp-block-pullquote blockquote {
+	padding: 0;
+}
+
+table td,
+table th,
+.wp-block-table td,
+.wp-block-table th {
+	border-color: #E8E9EA;
+}
+
+.a8c-posts-list__item {
+	margin-bottom: 32px;
+	margin-top: 32px;
+}
+
+@media only screen and (min-width: 560px) {
+	.a8c-posts-list__item {
+		margin-bottom: 64px;
+		margin-top: 64px;
+	}
+}
+
+.a8c-posts-list__listing:not(:last-child) {
+	margin-bottom: 32px;
+}
+
+@media only screen and (min-width: 560px) {
+	.a8c-posts-list__listing:not(:last-child) {
+		margin-bottom: 64px;
+	}
+}
+
 /**
  * Comments
  */
@@ -3635,6 +3711,11 @@ p:not(.site-title) a:hover {
 	display: flex;
 }
 
+.comment-respond .form-submit {
+	display: flex;
+	justify-content: flex-end;
+}
+
 @media only screen and (min-width: 640px) {
 	.comment-meta {
 		border-left: 1px solid #E8E9EA;

+ 81 - 0
rockfield/style.css

@@ -3560,6 +3560,18 @@ p:not(.site-title) a:hover {
 /**
  * Content Area
  */
+.site-main > * {
+	margin-bottom: 32px;
+	margin-top: 32px;
+}
+
+@media only screen and (min-width: 560px) {
+	.site-main > * {
+		margin-bottom: 64px;
+		margin-top: 64px;
+	}
+}
+
 @media only screen and (min-width: 560px) {
 	#main {
 		padding-top: 64px;
@@ -3607,6 +3619,70 @@ p:not(.site-title) a:hover {
 	text-transform: uppercase;
 }
 
+/**
+ * Blocks
+ */
+.wp-block-cover .wp-block-cover__inner-container > *,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box > * {
+	margin-top: 21.312px;
+	margin-bottom: 21.312px;
+}
+
+@media only screen and (min-width: 560px) {
+	.wp-block-cover .wp-block-cover__inner-container > *,
+	.wp-block-coblocks-hero .wp-block-coblocks-hero__box > * {
+		margin-top: 32px;
+		margin-bottom: 32px;
+	}
+}
+
+.wp-block-cover .wp-block-cover__inner-container > *:first-child,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-cover .wp-block-cover__inner-container > *:last-child,
+.wp-block-coblocks-hero .wp-block-coblocks-hero__box > *:last-child {
+	margin-bottom: 0;
+}
+
+.wp-block-pullquote {
+	border-bottom-width: 1px;
+}
+
+.wp-block-pullquote blockquote {
+	padding: 0;
+}
+
+table td,
+table th,
+.wp-block-table td,
+.wp-block-table th {
+	border-color: #E8E9EA;
+}
+
+.a8c-posts-list__item {
+	margin-bottom: 32px;
+	margin-top: 32px;
+}
+
+@media only screen and (min-width: 560px) {
+	.a8c-posts-list__item {
+		margin-bottom: 64px;
+		margin-top: 64px;
+	}
+}
+
+.a8c-posts-list__listing:not(:last-child) {
+	margin-bottom: 32px;
+}
+
+@media only screen and (min-width: 560px) {
+	.a8c-posts-list__listing:not(:last-child) {
+		margin-bottom: 64px;
+	}
+}
+
 /**
  * Comments
  */
@@ -3640,6 +3716,11 @@ p:not(.site-title) a:hover {
 	display: flex;
 }
 
+.comment-respond .form-submit {
+	display: flex;
+	justify-content: flex-end;
+}
+
 @media only screen and (min-width: 640px) {
 	.comment-meta {
 		border-right: 1px solid #E8E9EA;