Changeset 30564 for trunk/src/wp-content/themes/twentyfifteen/inc/custom-header.php

Timestamp:

11/25/2014 02:46:13 PM (11 years ago)

Author:

iandstewart

Message:

Twenty Fifteen: a shorter header on small screens when there is no header text or header image looks more correct.

Props iamtakashi, fixes #30326.

File:

• trunk/src/wp-content/themes/twentyfifteen/inc/custom-header.php (modified) (1 diff)

trunk/src/wp-content/themes/twentyfifteen/inc/custom-header.php

@@ -90 +90 @@
     <style type="text/css" id="twentyfifteen-header-css">
     <?php
+        // Short header for when there is no Custom Header and Header Text is hidden.
+        if ( empty( $header_image ) && ! display_header_text() ) :
+    ?>
+        .site-header {
+            padding-top: 14px;
+            padding-bottom: 14px;
+        }
+
+        .site-branding {
+            min-height: 42px;
+        }
+
+        @media screen and (min-width: 46.25em) {
+            .site-header {
+                padding-top: 21px;
+                padding-bottom: 21px;
+            }
+            .site-branding {
+                min-height: 56px;
+            }
+        }
+        @media screen and (min-width: 55em) {
+            .site-header {
+                padding-top: 25px;
+                padding-bottom: 25px;
+            }
+            .site-branding {
+                min-height: 62px;
+            }
+        }
+        @media screen and (min-width: 59.6875em) {
+            .site-header {
+                padding-top: 0;
+                padding-bottom: 0;
+            }
+            .site-branding {
+                min-height: 0;
+            }
+        }
+    <?php
+        endif;
+
+        // Has a Custom Header been added?
         if ( ! empty( $header_image ) ) :
     ?>