Changeset 25854

Timestamp:

10/21/2013 04:32:10 PM (10 years ago)

Author:

lancewillett

Message:

Twenty Fourteen: improved responsive styles for featured content and minor layout fixes. Props iamtakashi, see #25592.

File:

• trunk/src/wp-content/themes/twentyfourteen/style.css (modified) (19 diffs)

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

@@ -2452 +2452 @@
 
 /* Ephemera widget*/
+
 .content-sidebar .widget_twentyfourteen_ephemera .widget-title {
     line-height: 1.2857142857;
@@ -2549 +2550 @@
     box-sizing:         border-box;
     float: left;
-    padding: 0 27px;
+    padding: 0 30px;
     width: 315px;
 }
@@ -2607 +2608 @@
 .featured-content .entry-wrap {
     background-color: #000;
-    border: 12px solid #000;
+    border-color: #000;
+    border-style: solid;
+    border-width: 12px 10px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing:    border-box;
+    box-sizing:         border-box;
+    min-height: 96px;
     overflow: hidden;
 }
@@ -2900 +2907 @@
     }
 
-    .attachment-featured-featured {
-        height: 240px;
-    }
-
     .featured-content .hentry {
         float: left;
@@ -2916 +2919 @@
         height: 96px;
     }
+
+    .attachment-featured-featured {
+        height: 186px;
+    }
 }
 
@@ -2925 +2932 @@
     .primary-navigation {
         display: block;
+    }
+
+    .attachment-featured-featured {
+        height: 213px;
     }
 }
@@ -2969 +2980 @@
         float: left;
     }
+
+    .attachment-featured-featured {
+        height: 224px;
+    }
 }
 
@@ -3019 +3034 @@
 
     .attachment-featured-featured {
-        height: 192px;
-    }
-
-    .featured-content .hentry {
-        width: 33.3333333%;
-    }
-
-    .featured-content .hentry:nth-child( 2n+1 ) {
-        clear: none;
-    }
-
-    .featured-content .hentry:nth-child( 3n+1 ) {
-        clear: both;
+        height: 241px;
     }
 }
@@ -3037 +3040 @@
 @media screen and (min-width: 1008px) {
     .header-main {
-        padding-left: 27px;
+        padding-left: 30px;
     }
 
@@ -3084 +3087 @@
         margin: 0 0 0 -100%;
         min-height: 100vh;
-        padding: 0 27px;
-        width: 128px;
+        width: 122px;
     }
 
@@ -3091 +3093 @@
         padding-top: 0;
     }
+
     .footer-sidebar .widget_archive li,
     .footer-sidebar .widget_categories li,
@@ -3142 +3145 @@
         position: absolute;
         top: -1px;
-        left: 128px;
-        width: 128px;
+        left: 122px;
+        width: 122px;
         z-index: 9999;
     }
@@ -3170 +3173 @@
 
     .site-info {
-        padding-left: 27px;
+        padding: 15px 30px;
     }
 
@@ -3179 +3182 @@
     .featured-content {
         padding-left: 182px;
+    }
+
+    .featured-content .hentry {
+        width: 33.3333333%;
+    }
+
+    .featured-content .hentry:nth-child( 2n+1 ) {
+        clear: none;
+    }
+
+    .featured-content .hentry:nth-child( 3n+1 ) {
+        clear: both;
+    }
+
+    .featured-content .entry-wrap {
+        height: 120px;
+    }
+
+    .attachment-featured-featured {
+        height: 152px;
     }
 }
@@ -3219 +3242 @@
         padding-left: 30px;
     }
+
+    .attachment-featured-featured {
+        height: 158px;
+    }
 }
 
@@ -3237 +3264 @@
     #secondary,
     .secondary-navigation ul ul {
-        width: 168px;
-    }
+        width: 162px;
+    }
+
     .secondary-navigation ul ul {
-        left: 168px;
+        left: 162px;
     }
 }
@@ -3258 +3286 @@
         padding-left: 30px;
     }
+
+    .attachment-featured-featured {
+        height: 164px;
+    }
 }
 
@@ -3286 +3318 @@
         margin-right: auto;
     }
+
+    .attachment-featured-featured {
+        height: 184px;
+    }
 }
 
@@ -3294 +3330 @@
         width:         calc(50% + 18px);
     }
+
     .site-content blockquote.alignleft {
         margin-left: -18%;
     }
+
     .site-content blockquote.alignright {
         margin-right: -18%;
     }
-}
+
+    .attachment-featured-featured {
+        height: 192px;
+    }
+}