Ticket #28237: 28237.6.diff

src/wp-content/themes/twentyfourteen/style.css

@@ -861 +861 @@
         float: left;
         font-size: 18px;
         font-weight: 700;
-        line-height: 48px;
+        line-height: 24px;
+        padding: 12px 96px 12px 0;
         margin: 0;
         overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
 }
 
 .site-title,
@@ -874 +873 @@
         color: #fff;
 }
 
+.site-title a {
+        display: block;
+}
+
 /* Search in the header */
 
 .search-toggle {
@@ -880 +883 @@
         background-color: #24890d;
         cursor: pointer;
         float: right;
-        height: 48px;
-        margin-right: 38px;
+        height: 100%;
+        margin-right: 0;
         text-align: center;
         width: 48px;
+        position: absolute;
+        top: 0;
+        right: 0;
 }
 
 .search-toggle:hover,
@@ -895 +901 @@
         color: #fff;
         content: "\f400";
         font-size: 20px;
-        margin-top: 14px;
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        margin-top: -10px;
+        margin-left: -9px;
 }
 
 .search-toggle .screen-reader-text {
@@ -975 +985 @@
 }
 
 .primary-navigation.toggled-on {
-        padding: 72px 0 36px;
+        padding: 24px 0 36px;
+        clear: both;
 }
 
 .primary-navigation .nav-menu {
@@ -1013 +1024 @@
         padding: 0;
         position: absolute;
         top: 0;
-        right: 0;
+        right: 48px;
         text-align: center;
         width: 48px;
 }
@@ -3080 +3091 @@
 }
 
 @media screen and (max-width: 400px) {
-        .site-title {
-                max-width: 71%;
-        }
-
         .list-view .site-content .post-thumbnail {
                 background: none;
                 width: auto;
@@ -3158 +3165 @@
 }
 
 @media screen and (min-width: 401px) {
-        .site-title {
-                max-width: 77%;
-        }
-
         a.post-thumbnail:hover img {
                 opacity: 0.85;
         }
@@ -3291 +3294 @@
 
 @media screen and (min-width: 594px) {
         .site-title {
-                max-width: 85%;
+                line-height: 48px;
+                padding: 0;
         }
-
+        
         .site-content .entry-header {
                 padding-right: 30px;
                 padding-left: 30px;
@@ -3309 +3313 @@
                 padding: 0 30px;
         }
 
-        .site-title {
-                max-width: 89%;
-        }
-
-        .search-toggle {
-                margin-right: 18px;
-        }
-
         .search-box .search-field {
                 width: 50%;
         }
@@ -3447 +3443 @@
         .header-main {
                 padding-right: 0;
         }
-
-        .site-title {
-                max-width: 93%;
-        }
-
+        
         .search-toggle {
+                position: relative;
+                right: 0;
                 margin-right: 0;
         }