Changeset 7056

Timestamp:

04/06/2018 10:17:08 PM (7 years ago)

Author:

iandunn

Message:

WP15: Improve compatibility with IE11.

File:

• sites/trunk/wp15.wordpress.net/public_html/content/themes/twentyseventeen-wp15/style.css (modified) (6 diffs)

sites/trunk/wp15.wordpress.net/public_html/content/themes/twentyseventeen-wp15/style.css

@@ -140 +140 @@
  */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+    .custom-header {
+        min-height: 260px;
+    }
+
+    .site-branding {
+        padding: 1em 0;
+    }
+
     .custom-logo-link img {
         max-width: 150px;
@@ -147 +155 @@
 
 @media screen and ( min-width: 475px ) {
-    .custom-logo-link img {
-        max-width: 300px;
-        max-height: 218px;
+    @supports not (-ms-high-constrast: active) {
+        .custom-logo-link img {
+            max-width: 300px;
+            max-height: 218px;
+        }
     }
 }
@@ -225 +235 @@
 }
 
+.menu-top-menu-container {
+    text-align: center;
+}
+
 .main-navigation.toggled-on .menu-top-menu-container {
     position: absolute;
     width: 100vw;
+}
+
+@media screen and (min-width: 48em) {
+    #top-menu {
+        display: inline-block;
+    }
+}
+
+@supports ( display: grid ) {
+    .main-navigation.toggled-on #top-menu {
+        display: block;
+    }
+}
+
+.wp15-locale-switcher-container {
+    text-align: center;
+    padding-bottom: 1em;
 }
 
@@ -235 +266 @@
         grid-row: 1;
         display: grid;
+        text-align: left;
+        padding-bottom: 0;
     }
 
@@ -305 +338 @@
 }
 
+/*
+ * IE <= 11 doesn't show SVG markers on the map, so treat it like a progressive enhancement.
+ */
+@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+    #wp15-events-map {
+        display: none;
+    }
+}
+
 @media screen and ( max-width: 48em ) {
     #wp15-events-map {
@@ -327 +369 @@
 .wp15-events-list {
     display: grid;
-    grid-template-columns: repeat( auto-fill, minmax( 300px, 1fr ) );
+    grid-template-columns: repeat( auto-fill, minmax( 250px, 1fr ) );
     grid-gap: 2em;
     width: 80vw;