WordPress.org
Get WordPress

Make WordPress Core

Changeset 28694


Ignore:
Timestamp:
06/06/2014 06:56:18 PM (11 years ago)
Author:
lancewillett
Message:

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

Location:
trunk/src/wp-content/themes/twentyfourteen
Files:
3 edited

Legend:

Unmodified
Added
Removed

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

    r27763 r28694  
    618618}
    619619
     620.mejs-overlay-button {
     621    background-color: #fff;
     622    background-image: none;
     623    border-radius: 10px;
     624    box-shadow: 1px 1px 1px rgba(0,0,0,.8);
     625    color: #000;
     626    height: 48px;
     627    margin: -24px 0 0 -32px;
     628    width: 64px;
     629}
     630
     631.mejs-overlay-button:before {
     632    -webkit-font-smoothing: antialiased;
     633    content: '\f452';
     634    display: inline-block;
     635    font: normal 48px/1 Genericons;
     636    position: absolute;
     637    top: 0;
     638    left: 10px;
     639}
     640
     641.mejs-controls .mejs-button button:focus {
     642    outline: none;
     643}
     644
     645.mejs-controls .mejs-button button {
     646    -webkit-font-smoothing: antialiased;
     647    background: none;
     648    color: #fff;
     649    display: inline-block;
     650    font: normal 16px/1 Genericons;
     651}
     652
     653.mejs-playpause-button.mejs-play button:before {
     654    content: '\f452';
     655}
     656
     657.mejs-playpause-button.mejs-pause button:before {
     658    content: '\f448';
     659}
     660
     661.mejs-volume-button.mejs-mute button:before {
     662    content: '\f109';
     663    font-size: 20px;
     664    position: absolute;
     665    top: -2px;
     666    left: 0;
     667}
     668
     669.mejs-volume-button.mejs-unmute button:before {
     670    content: '\f109';
     671    left: 0;
     672    position: absolute;
     673    top: 0;
     674}
     675
     676.mejs-fullscreen-button button:before {
     677    content: '\f474';
     678}
     679
     680.mejs-fullscreen-button.mejs-unfullscreen button:before {
     681    content: '\f406';
     682}
     683
     684.mejs-overlay:hover .mejs-overlay-button {
     685    background-color: #24890d;
     686    color: #fff;
     687}
     688
     689.mejs-controls .mejs-button button:hover {
     690    color: #41a62a;
     691}
     692
    620693
    621694/**

  • trunk/src/wp-content/themes/twentyfourteen/functions.php

    r28692 r28694  
    6969
    7070    // This theme styles the visual editor to resemble the theme style.
    71     add_editor_style( array( 'css/editor-style.css', twentyfourteen_font_url() ) );
     71    add_editor_style( array( 'css/editor-style.css', twentyfourteen_font_url(), 'genericons/genericons.css' ) );
    7272
    7373    // Add RSS feed links to <head> for posts and comments.

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

    r28691 r28694  
    13741374}
    13751375
     1376.hentry .mejs-overlay-button {
     1377    background-color: #fff;
     1378    background-image: none;
     1379    border-radius: 10px;
     1380    box-shadow: 1px 1px 1px rgba(0,0,0,.8);
     1381    color: #000;
     1382    height: 48px;
     1383    margin: -24px 0 0 -32px;
     1384    width: 64px;
     1385}
     1386
     1387.hentry .mejs-overlay-button:before {
     1388    -webkit-font-smoothing: antialiased;
     1389    content: '\f452';
     1390    display: inline-block;
     1391    font: normal 48px/1 Genericons;
     1392    position: absolute;
     1393    top: 0;
     1394    left: 10px;
     1395}
     1396
     1397.hentry .mejs-controls .mejs-button button:focus {
     1398    outline: none;
     1399}
     1400
     1401.hentry .mejs-controls .mejs-button button {
     1402    -webkit-font-smoothing: antialiased;
     1403    background: none;
     1404    color: #fff;
     1405    display: inline-block;
     1406    font: normal 16px/1 Genericons;
     1407}
     1408
     1409.hentry .mejs-playpause-button.mejs-play button:before {
     1410    content: '\f452';
     1411}
     1412
     1413.hentry .mejs-playpause-button.mejs-pause button:before {
     1414    content: '\f448';
     1415}
     1416
     1417.hentry .mejs-volume-button.mejs-mute button:before {
     1418    content: '\f109';
     1419    font-size: 20px;
     1420    position: absolute;
     1421    top: -2px;
     1422    left: 0;
     1423}
     1424
     1425.hentry .mejs-volume-button.mejs-unmute button:before {
     1426    content: '\f109';
     1427    left: 0;
     1428    position: absolute;
     1429    top: 0;
     1430}
     1431
     1432.hentry .mejs-fullscreen-button button:before {
     1433    content: '\f474';
     1434}
     1435
     1436.hentry .mejs-fullscreen-button.mejs-unfullscreen button:before {
     1437    content: '\f406';
     1438}
     1439
     1440.hentry .mejs-overlay:hover .mejs-overlay-button {
     1441    background-color: #24890d;
     1442    color: #fff;
     1443}
     1444
     1445.hentry .mejs-controls .mejs-button button:hover {
     1446    color: #41a62a;
     1447}
     1448
    13761449.content-sidebar .wp-playlist-item .wp-playlist-caption {
    13771450    color: #000;
Note: See TracChangeset for help on using the changeset viewer.