Twenty Thirteen: style up the new `mediaelement` audio and video players. Props obenland, fixes #23821.

git-svn-id: http://core.svn.wordpress.org/trunk@23781 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Lance Willett 2013-03-22 17:20:55 +00:00
parent 9f005d14fb
commit 0352ffb565
2 changed files with 41 additions and 15 deletions

View File

@ -342,14 +342,13 @@ div.nav-menu > ul {
}
.format-audio .entry-content:before {
float: none;
content: normal;
font-size: inherit;
}
.format-audio .entry-content:after {
content: "\f109";
font-size: 64px;
-ms-filter: "FlipH";
filter: FlipH;
float: right;
-webkit-transform: scaleX(-1);
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
}
.format-audio .audio-content {

View File

@ -1241,6 +1241,31 @@ footer.entry-meta {
padding: 0;
}
/* Mediaelements */
.entry-content .mejs-container .mejs-controls {
background: #220e10;
}
.entry-content .mejs-controls .mejs-time-rail .mejs-time-loaded,
.entry-content .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
background: #fff;
}
.entry-content .mejs-controls .mejs-time-rail .mejs-time-current {
background: #ea9629;
}
.entry-content .mejs-controls .mejs-time-rail .mejs-time-total,
.entry-content .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
background: #595959;
}
.entry-content .mejs-controls .mejs-time-rail span,
.entry-content .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.entry-content .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
border-radius: 0;
}
/**
* 5.4 Galleries
@ -1441,14 +1466,11 @@ footer.entry-meta {
}
.format-audio .entry-content:before {
float: left;
content: "\f109";
float: left;
font-size: 64px;
}
.format-audio .entry-content:before,
.format-audio .entry-content:after {
display: inline-block;
position: relative;
top: 4px;
}
.format-audio .entry-content a,
@ -1469,13 +1491,18 @@ footer.entry-meta {
background: url(images/dotted-line.png) repeat-y left top;
background-size: 4px 4px;
float: right;
margin: 0 0 24px;
padding-left: 35px;
width: 80%;
width: -webkit-calc(100% - 115px);
width: calc(100% - 115px);
}
.format-audio .wp-audio-shortcode {
height: 30px !important; /* Override mediaelement.js style */
margin: 20px 0;
max-width: 400px !important; /* Override mediaelement.js style */
}
.format-audio audio {
max-width: 100% !important; /* Avoid player width overflow. */
}