Changeset 27865 for trunk/src/wp-includes/js/mediaelement/wp-mediaelement.css

Timestamp:

03/30/2014 10:11:46 PM (12 years ago)

Author:

wonderboymusic

Message:

Using percentages for playlist font-sizing was ambitious, but fell prey to editor-style.css in the admin. We have switched to using pixels. The editor styles were also forcing MediaElement players to inherit font-family, which was undesirable. And while we're at it, remove the top and bottom border from the playlist's list of tracks, which adds a dash of lovely to the playlist's default styles.

Props nacin for the addition of — in the playlist track list.
Fixes #27600.

File:

• trunk/src/wp-includes/js/mediaelement/wp-mediaelement.css (modified) (7 diffs)

trunk/src/wp-includes/js/mediaelement/wp-mediaelement.css

@@ +1 @@
+.mejs-container * {
+    font-family: Helvetica, Arial;
+}
+
 .mejs-container, .mejs-embed, .mejs-embed body {
     background: #000;
@@ -60 +64 @@
     padding: 10px;
     margin: 12px 0 18px;
-    font-size: 85%;
-    line-height: 160%;
+    font-size: 14px;
+    line-height: 1.5;
 }
 
@@ -93 +97 @@
 
 .wp-playlist-caption {
-    max-width: 85%;
+    max-width: 90%;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    font-size: 14px;
+    line-height: 1.5;
 }
 
-.wp-caption-meta {
+.wp-playlist-item-meta {
     display: block;
+    font-size: 14px;
+    line-height: 1.5;
 }
 
-.wp-caption-title {
-    font-size: 100%;
+.wp-playlist-item-title {
+    font-size: 14px;
+    line-height: 1.5;
 }
 
-.wp-caption-album {
+.wp-playlist-item-album {
     font-style: italic;
     overflow: hidden;
@@ -114 +123 @@
 }
 
-.wp-caption-artist {
-    font-size: 85%;
+.wp-playlist-item-artist {
+    font-size: 12px;
     text-transform: uppercase;
-}
-
-.wp-caption-by {
-    font-size: 65%;
-    font-weight: bold;
 }
 
@@ -128 +132 @@
     right: 3px;
     top: 0;
+    font-size: 14px;
+    line-height: 1.5;
 }
 
 .wp-playlist-tracks {
     margin-top: 10px;
-    border-top: 1px solid #ccc;
 }
 
@@ -140 +145 @@
     padding: 0 3px;
     border-bottom: 1px solid #ccc;
+}
+
+.wp-playlist-item:last-child {
+    border-bottom: 0;
 }
 
@@ -176 +185 @@
     height: auto;
     margin-right: 10px;
+    padding: 0;
+    border: 0;
 }
 
-.wp-playlist-current-item .wp-caption-title,
-.wp-playlist-current-item .wp-caption-artist {
+.wp-playlist-current-item .wp-playlist-item-title,
+.wp-playlist-current-item .wp-playlist-item-artist {
     overflow: hidden;
     text-overflow: ellipsis;