Twenty Fourteen: first pass at better Audio/Video player styling with genericons. Props celloexpressions, see #26469.

Built from https://develop.svn.wordpress.org/trunk@28694


git-svn-id: http://core.svn.wordpress.org/trunk@28512 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Lance Willett 2014-06-06 18:57:14 +00:00
parent cd72dc041b
commit c54618ab9c
3 changed files with 147 additions and 1 deletions

View File

@ -617,6 +617,79 @@ img {
background: transparent;
}
.mejs-overlay-button {
background-color: #fff;
background-image: none;
border-radius: 10px;
box-shadow: 1px 1px 1px rgba(0,0,0,.8);
color: #000;
height: 48px;
margin: -24px 0 0 -32px;
width: 64px;
}
.mejs-overlay-button:before {
-webkit-font-smoothing: antialiased;
content: '\f452';
display: inline-block;
font: normal 48px/1 Genericons;
position: absolute;
top: 0;
left: 10px;
}
.mejs-controls .mejs-button button:focus {
outline: none;
}
.mejs-controls .mejs-button button {
-webkit-font-smoothing: antialiased;
background: none;
color: #fff;
display: inline-block;
font: normal 16px/1 Genericons;
}
.mejs-playpause-button.mejs-play button:before {
content: '\f452';
}
.mejs-playpause-button.mejs-pause button:before {
content: '\f448';
}
.mejs-volume-button.mejs-mute button:before {
content: '\f109';
font-size: 20px;
position: absolute;
top: -2px;
left: 0;
}
.mejs-volume-button.mejs-unmute button:before {
content: '\f109';
left: 0;
position: absolute;
top: 0;
}
.mejs-fullscreen-button button:before {
content: '\f474';
}
.mejs-fullscreen-button.mejs-unfullscreen button:before {
content: '\f406';
}
.mejs-overlay:hover .mejs-overlay-button {
background-color: #24890d;
color: #fff;
}
.mejs-controls .mejs-button button:hover {
color: #41a62a;
}
/**
* 10.0 RTL

View File

@ -68,7 +68,7 @@ function twentyfourteen_setup() {
load_theme_textdomain( 'twentyfourteen', get_template_directory() . '/languages' );
// This theme styles the visual editor to resemble the theme style.
add_editor_style( array( 'css/editor-style.css', twentyfourteen_font_url() ) );
add_editor_style( array( 'css/editor-style.css', twentyfourteen_font_url(), 'genericons/genericons.css' ) );
// Add RSS feed links to <head> for posts and comments.
add_theme_support( 'automatic-feed-links' );

View File

@ -1373,6 +1373,79 @@ a.post-thumbnail:hover {
background: transparent;
}
.hentry .mejs-overlay-button {
background-color: #fff;
background-image: none;
border-radius: 10px;
box-shadow: 1px 1px 1px rgba(0,0,0,.8);
color: #000;
height: 48px;
margin: -24px 0 0 -32px;
width: 64px;
}
.hentry .mejs-overlay-button:before {
-webkit-font-smoothing: antialiased;
content: '\f452';
display: inline-block;
font: normal 48px/1 Genericons;
position: absolute;
top: 0;
left: 10px;
}
.hentry .mejs-controls .mejs-button button:focus {
outline: none;
}
.hentry .mejs-controls .mejs-button button {
-webkit-font-smoothing: antialiased;
background: none;
color: #fff;
display: inline-block;
font: normal 16px/1 Genericons;
}
.hentry .mejs-playpause-button.mejs-play button:before {
content: '\f452';
}
.hentry .mejs-playpause-button.mejs-pause button:before {
content: '\f448';
}
.hentry .mejs-volume-button.mejs-mute button:before {
content: '\f109';
font-size: 20px;
position: absolute;
top: -2px;
left: 0;
}
.hentry .mejs-volume-button.mejs-unmute button:before {
content: '\f109';
left: 0;
position: absolute;
top: 0;
}
.hentry .mejs-fullscreen-button button:before {
content: '\f474';
}
.hentry .mejs-fullscreen-button.mejs-unfullscreen button:before {
content: '\f406';
}
.hentry .mejs-overlay:hover .mejs-overlay-button {
background-color: #24890d;
color: #fff;
}
.hentry .mejs-controls .mejs-button button:hover {
color: #41a62a;
}
.content-sidebar .wp-playlist-item .wp-playlist-caption {
color: #000;
}