瀏覽代碼

defaults for featured image

Maggie 4 年之前
父節點
當前提交
5fa22e69d2
共有 2 個文件被更改,包括 44 次插入0 次删除
  1. 26 0
      quadrat/assets/theme.css
  2. 18 0
      quadrat/sass/block-styles/_query.scss

+ 26 - 0
quadrat/assets/theme.css

@@ -85,6 +85,28 @@
 	flex-basis: auto;
 	flex-basis: auto;
 }
 }
 
 
+.is-style-quadrat-diamond-posts .wp-block-column:last-child {
+	max-width: 400px;
+	flex-shrink: 0;
+}
+
+.is-style-quadrat-diamond-posts .wp-block-post-featured-image {
+	width: 400px;
+}
+
+@media (max-width: 599px) {
+	.is-style-quadrat-diamond-posts .wp-block-post-featured-image {
+		width: 100%;
+	}
+}
+
+.is-style-quadrat-diamond-posts .wp-block-post-featured-image img {
+	-o-object-fit: cover;
+	   object-fit: cover;
+	width: 100%;
+	height: 400px;
+}
+
 .is-style-quadrat-diamond-posts .wp-block-post-template li {
 .is-style-quadrat-diamond-posts .wp-block-post-template li {
 	display: flex;
 	display: flex;
 	align-items: center;
 	align-items: center;
@@ -92,6 +114,10 @@
 	position: relative;
 	position: relative;
 }
 }
 
 
+.is-style-quadrat-diamond-posts .wp-block-post-template li > * {
+	flex-basis: 100%;
+}
+
 .is-style-quadrat-diamond-posts .wp-block-post-template li:before {
 .is-style-quadrat-diamond-posts .wp-block-post-template li:before {
 	content: "";
 	content: "";
 	background: var(--wp--preset--color--secondary);
 	background: var(--wp--preset--color--secondary);

+ 18 - 0
quadrat/sass/block-styles/_query.scss

@@ -1,6 +1,21 @@
 .is-style-quadrat-diamond-posts {
 .is-style-quadrat-diamond-posts {
 	.wp-block-column {
 	.wp-block-column {
 		flex-basis: auto;
 		flex-basis: auto;
+		&:last-child {
+			max-width: 400px;
+			flex-shrink: 0;
+		}
+	}
+	.wp-block-post-featured-image {
+		width: 400px;
+		@media (max-width: #{ ($break-small - 1) }) {
+			width: 100%;
+		}
+		img {
+			object-fit: cover;
+			width: 100%;
+			height: 400px;
+		}
 	}
 	}
 	.wp-block-post-template {
 	.wp-block-post-template {
 		li {
 		li {
@@ -8,6 +23,9 @@
 			align-items: center;
 			align-items: center;
 			min-height: 400px;
 			min-height: 400px;
 			position: relative;
 			position: relative;
+			& > * {
+				flex-basis: 100%;
+			}
 			&:before {
 			&:before {
 				content: "";
 				content: "";
 				background: var(--wp--preset--color--secondary);
 				background: var(--wp--preset--color--secondary);