Changeset 25758

Timestamp:

10/10/2013 03:35:27 PM (11 years ago)

Author:

lancewillett

Message:

Twenty Fourteen: improve display for elements in the featured content area by preventing titles from breaking and letting content overflow with an ellipsis. Props obenland, fixes #25053.

Location:

trunk/src/wp-content/themes/twentyfourteen

Files:

• inc/customizer.php (modified) (1 diff)
• rtl.css (modified) (2 diffs)
• style.css (modified) (5 diffs)

trunk/src/wp-content/themes/twentyfourteen/inc/customizer.php

@@ -204 +204 @@
         #secondary .current_page_item > a,
         #secondary .current-menu-item > a,
-        #featured-content .entry-meta a:hover,
-        #featured-content .entry-title a:hover,
-        #featured-content .more-link,
+        .featured-content a:hover,
+        .featured-content .more-link,
         .widget-area a:hover {
             color: ' . $accent_much_lighter . ';

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

@@ -447 +447 @@
     }
 
-    #featured-content .hentry {
+    .featured-content .hentry {
         float: right;
     }
@@ -629 +629 @@
     }
 
-    #featured-content {
+    .featured-content {
         padding-right: 222px;
         padding-left: 0;

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

@@ -1183 +1183 @@
 ----------------------------------------------- */
 
-#featured-content {
+.featured-content {
     background: #000;
     background-attachment: fixed;
@@ -1194 +1194 @@
     width: 100%;
 }
-#featured-content .hentry {
+.featured-content .hentry {
     color: #fff;
     margin: 0;
-    padding: 0;
-    position: relative;
     width: 100%;
 }
@@ -1209 +1207 @@
     opacity: 0.85;
 }
-#featured-content .entry-wrap {
+.featured-content .entry-wrap {
     background-color: #000;
     overflow: hidden;
     padding: 12px 10px;
 }
-#featured-content .entry-meta a,
-#featured-content .entry-title a {
+.featured-content a {
     color: #fff;
 }
-#featured-content .entry-meta a:hover,
-#featured-content .entry-title a:hover {
-    color: #5FF23D;
-}
-#featured-content .entry-meta {
+.featured-content a:hover {
+    color: #5FF23d;
+}
+.featured-content .entry-meta {
     font-size: 11px;
     font-weight: 700;
     line-height: 1.0909090909;
 }
-#featured-content .cat-links {
+.featured-content .cat-links {
     font-weight: 700;
 }
-#featured-content .entry-title {
+.featured-content .entry-title {
     font-size: 18px;
     font-weight: 300;
     line-height: 1.3333333333;
     margin-bottom: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
     text-transform: uppercase;
-}
-#featured-content .entry-summary {
+    white-space: nowrap;
+}
+.featured-content .entry-summary {
     background-color: transparent;
     color: rgba(255, 255, 255, 0.75);
-    padding-bottom: 12px;
-}
-#featured-content .entry-summary p {
     font-size: 11px;
     line-height: 1.6363636363;
-    margin-top: 9px;
-    margin-bottom: 0;
-}
-#featured-content .more-link {
-    color: #5FF23D;
+    padding: 9px 0 12px;
+}
+.featured-content .more-link {
+    color: #5FF23d;
     font-size: 11px;
 }
@@ -2345 +2340 @@
         padding: 48px 30px 0;
     }
-    #featured-content .hentry {
+    .featured-content .hentry {
         float: left;
         width: 50%;
     }
-    #featured-content .hentry:nth-child( 2n+1 ) {
+    .featured-content .hentry:nth-child( 2n+1 ) {
         clear: both;
     }
-    #featured-content .entry-wrap {
+    .featured-content .entry-wrap {
         height: 96px;
     }
@@ -2449 +2444 @@
         padding-top: 72px;
     }
-    #featured-content .hentry {
+    .featured-content .hentry {
         width: 33.3333333%;
     }
-    #featured-content .hentry:nth-child( 2n+1 ) {
+    .featured-content .hentry:nth-child( 2n+1 ) {
         clear: none;
     }
-    #featured-content .hentry:nth-child( 3n+1 ) {
+    .featured-content .hentry:nth-child( 3n+1 ) {
         clear: both;
     }