Browse Source

post header version with featured image

Maggie Cabrera 4 years ago
parent
commit
e1666b00c9
2 changed files with 33 additions and 9 deletions
  1. 13 3
      quadrat/assets/theme.css
  2. 20 6
      quadrat/sass/_post-header.scss

+ 13 - 3
quadrat/assets/theme.css

@@ -694,12 +694,22 @@ textarea:focus {
 	.post-header .wp-block-spacer {
 		display: none;
 	}
-}
-
-@media (max-width: 479px) {
+	.post-header .wp-block-post-featured-image {
+		order: -1;
+		height: 100vh;
+	}
+	.post-header .wp-block-post-featured-image img {
+		-o-object-fit: cover;
+		   object-fit: cover;
+		height: 100%;
+		width: 100%;
+	}
 	.single.admin-bar .post-header {
 		min-height: calc( 100vh - 46px);
 	}
+	.single.admin-bar .wp-block-post-featured-image {
+		height: calc( 100vh - 46px);
+	}
 	.single.admin-bar .site-header {
 		top: 46px;
 	}

+ 20 - 6
quadrat/sass/_post-header.scss

@@ -1,5 +1,7 @@
-.post-header {
-	@include break-mobile-only() {
+$admin-bar: 46px;
+
+@include break-mobile-only() {
+	.post-header {
 		min-height: 100vh;
 		display: flex;
 		flex-direction: column;
@@ -21,17 +23,29 @@
 		.wp-block-spacer {
 			display: none;
 		}
+		
+		.wp-block-post-featured-image {
+			order: -1;
+			height: 100vh;
+			img {
+				object-fit: cover;
+				height: 100%;
+				width: 100%;
+			}
+		}
+
 	}
-}
 
-@include break-mobile-only() {
 	.single {
 		&.admin-bar {
 			.post-header {
-				min-height: calc( 100vh - 46px );
+				min-height: calc( 100vh - #{$admin-bar} );
+			}
+			.wp-block-post-featured-image {
+				height: calc( 100vh - #{$admin-bar} );
 			}
 			.site-header{
-				top: 46px;
+				top: $admin-bar;
 			}
 		}