From 13ff476cc1296fcfe5154fe211e03d6af3871a8d Mon Sep 17 00:00:00 2001
From: Dominik Schilling <dominikschilling+git@gmail.com>
Date: Mon, 5 Dec 2016 09:30:37 +0000
Subject: [PATCH] Twenty Seventeen: Fix CSS specificity problem with CSS
 feature query for `object-fit`

Previously, the theme's CSS feature query for `object-fit` overrode styles it shouldn't have on interior pages.

This moves the feature query farther down in the stylesheet so it takes precedence in the cascade in supported browsers, and applies the appropriate selector for the interior pages. In browsers that don't support feature queries or `object-fit`, the fallback styles are still applied. The problem was that the rules had the same specificity, so this way, the cascade takes over properly. The transforms and position changes for fallbacks are still needed in browsers that don't support `object-fit` and feature queries.

Merge of [39495] to the 4.7 branch.

Props peterwilsoncc, davidakennedy.
See #39073.
Built from https://develop.svn.wordpress.org/branches/4.7@39497


git-svn-id: http://core.svn.wordpress.org/branches/4.7@39437 1a063a9b-81f0-0310-95a4-ce76da25c4cd
---
 wp-content/themes/twentyseventeen/style.css | 37 +++++++++++----------
 wp-includes/version.php                     |  2 +-
 2 files changed, 20 insertions(+), 19 deletions(-)

diff --git a/wp-content/themes/twentyseventeen/style.css b/wp-content/themes/twentyseventeen/style.css
index f69f53ea33..2f67ddf637 100644
--- a/wp-content/themes/twentyseventeen/style.css
+++ b/wp-content/themes/twentyseventeen/style.css
@@ -1690,24 +1690,6 @@ body:not(.title-tagline-hidden) .site-branding-text {
 	transform: translateX(-50%) translateY(-50%);
 }
 
-/* For browsers that support 'object-fit' */
-@supports ( object-fit: cover ) {
-	.has-header-image .custom-header-media img,
-	.has-header-video .custom-header-media video,
-	.has-header-video .custom-header-media iframe {
-		height: 100%;
-		left: 0;
-		-o-object-fit: cover;
-		object-fit: cover;
-		top: 0;
-		-ms-transform: none;
-		-moz-transform: none;
-		-webkit-transform: none;
-		transform: none;
-		width: 100%;
-	}
-}
-
 .wp-custom-header .wp-custom-header-video-button { /* Specificity prevents .color-dark button overrides */
 	background-color: rgba(34, 34, 34, 0.5);
 	border: 1px solid rgba(255, 255, 255, 0.6);
@@ -1744,6 +1726,25 @@ body:not(.title-tagline-hidden) .site-branding-text {
 	transform: translateX(-50%) translateY(0);
 }
 
+/* For browsers that support 'object-fit' */
+@supports ( object-fit: cover ) {
+	.has-header-image .custom-header-media img,
+	.has-header-video .custom-header-media video,
+	.has-header-video .custom-header-media iframe,
+	.has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-media img {
+		height: 100%;
+		left: 0;
+		-o-object-fit: cover;
+		object-fit: cover;
+		top: 0;
+		-ms-transform: none;
+		-moz-transform: none;
+		-webkit-transform: none;
+		transform: none;
+		width: 100%;
+	}
+}
+
 /* Hides div in Customizer preview when header images or videos change. */
 
 body:not(.has-header-image):not(.has-header-video) .custom-header-media {
diff --git a/wp-includes/version.php b/wp-includes/version.php
index 154eac0c52..39fc5c9138 100644
--- a/wp-includes/version.php
+++ b/wp-includes/version.php
@@ -4,7 +4,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '4.7-RC2-39491';
+$wp_version = '4.7-RC2-39497';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.