WordPress.org

Make WordPress Core

Ticket #31459: update-admin-buttons-review-3.diff

File update-admin-buttons-review-3.diff, 7.7 KB (added by hugobaeta, 5 years ago)

Fixes text-shadow on Press This split button

  • src/wp-admin/css/colors/_mixins.scss

     
    44 */
    55@mixin button( $button-color, $text-color: white ) {
    66        background: $button-color;
    7         border-color: darken( $button-color, 10% );
     7        border-color: darken( $button-color, 8% ) darken( $button-color, 10% ) darken( $button-color, 10% );
    88        color: $text-color;
    9         box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
     9        box-shadow: 0 1px 0 darken( $button-color, 10% );
     10        text-shadow: 0 -1px 1px darken( $button-color, 12% ),
     11                1px 0 1px darken( $button-color, 12% ),
     12                0 1px 1px darken( $button-color, 12% ),
     13                -1px 0 1px darken( $button-color, 12% );
    1014
    1115        &:hover,
    1216        &:focus {
    13                 background: darken( $button-color, 5% );
     17                background: lighten( $button-color, 3% );
    1418                border-color: darken( $button-color, 15% );
    1519                color: $text-color;
    16                 box-shadow: inset 0 1px 0 lighten( $button-color, 10% );
     20                box-shadow: 0 1px 0 darken( $button-color, 15% );
    1721        }
    1822
    1923        &:focus {
    20                 box-shadow: inset 0 1px 0 lighten( $button-color, 10% ),
    21                             0 0 0 1px #5b9dd9,
    22                             0 0 2px 1px rgba( 30, 140, 190, .8 );
     24                box-shadow: inset 0 1px 0 darken( $button-color, 10% ),
     25                                        0 0 2px 1px #33b3db;
    2326        }
    2427
    2528        &:active {
    2629                background: darken( $button-color, 10% );
    2730                border-color: darken( $button-color, 15% );
    28                 color: $text-color;
    29                 box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ),
    30                             0 0 0 1px #5b9dd9,
    31                             0 0 2px 1px rgba( 30, 140, 190, .8 );
     31                color: hsl( hue( $button-color ), 50%, 80% );
     32                box-shadow: inset 0 2px 0 darken( $button-color, 15% );
    3233        }
    3334
    3435        &[disabled],
  • src/wp-admin/css/press-this.css

     
    462462        -webkit-appearance: none;
    463463        line-height: 2;
    464464        padding: 0 10px 1px;
    465         background: #00a0d2;
    466         border-color: #0073aa;
     465        background: #0085ba;
     466        border-color: #0085ba #0073aa #0073aa;
    467467        border-width: 1px;
    468468        border-style: solid;
    469         -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5), 0 1px 0 rgba( 0, 0, 0, 0.15 );
    470         box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5 ), 0 1px 0 rgba( 0, 0, 0, 0.15 );
     469        -webkit-box-shadow: 0 1px 0 #0073aa;
     470        box-shadow: 0 1px 0 #0073aa;
    471471        color: #fff;
     472        text-shadow: 0 -1px 1px #006799,
     473                1px 0 1px #006799,
     474                0 1px 1px #006799,
     475                -1px 0 1px #006799;
    472476}
    473477
    474478.split-button-primary {
     
    486490        border-top-right-radius: 3px;
    487491        -webkit-border-bottom-right-radius: 3px;
    488492        border-bottom-right-radius: 3px;
    489         border-left: 0 none;
     493        border-left: 1px solid #006799;
    490494        float: right;
    491495}
    492496
    493497.split-button-toggle i {
    494498        margin: 4px 20px 3px 0;
    495499        padding: 0 10px;
    496         border-left: 1px solid #fff;
    497500}
    498501
    499502.split-button-primary:hover,
    500503.split-button-toggle:hover {
    501504        outline: none;
    502         background: #0091cd;
    503         border-color: #0073aa;
     505        background: #008ec2;
     506        border-color: #006799;
    504507}
    505508
    506509.split-button-primary:focus,
    507510.split-button-toggle:focus {
    508511        outline: none;
    509         border-color: #0e3950;
    510         -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 ),
    511                 0 0 0 1px #5b9dd9,
    512                 0 0 2px 1px rgba(30, 140, 190, .8);
    513         box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 ),
    514                 0 0 0 1px #5b9dd9,
    515                 0 0 2px 1px rgba(30, 140, 190, .8);
     512        -webkit-box-shadow: 0 1px 0 #0073aa,
     513                0 0 2px 1px #33b3db;
     514        box-shadow: 0 1px 0 #0073aa,
     515                0 0 2px 1px #33b3db;
    516516}
    517517
    518518.split-button-primary:active,
    519519.split-button-toggle:active {
    520520        background: #0073aa;
    521         border-color: #005082;
     521        border-color: #006799;
    522522        color: rgba( 255, 255, 255, 0.95 );
    523         -webkit-box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 );
    524         box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 );
     523        -webkit-box-shadow: inset 0 2px 0 #006799;
     524        box-shadow: inset 0 2px 0 #006799;
     525        transform: translateY(1px);
    525526}
    526527
    527528/**
     
    14381439
    14391440.scan-submit:hover,
    14401441.scan-submit:focus {
    1441         background: #2991b7;
    1442         border-color: #20708e;
     1442        background: #008ec2;
     1443        border-color: #006799;
    14431444        color: #fff;
    14441445        outline: 0;
    14451446}
    14461447
    14471448.scan-submit:active {
    1448         background: #2581a2;
    1449         border-color: #20708e;
     1449        background: #0073aa;
     1450        border-color: #006799;
    14501451        color: #fff;
    14511452}
    14521453
  • src/wp-includes/css/buttons.css

     
    131131        color: #555;
    132132        border-color: #cccccc;
    133133        background: #f7f7f7;
    134         -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
    135         box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
     134        -webkit-box-shadow: 0 1px 0 #cccccc;
     135        box-shadow: 0 1px 0 #cccccc;
    136136        vertical-align: top;
    137137}
    138138
     
    164164.wp-core-ui .button-link:focus {
    165165        -webkit-box-shadow:
    166166                0 0 0 1px #5b9dd9,
    167                 0 0 2px 1px rgba(30, 140, 190, .8);
     167                0 0 2px 1px rgba(0, 115, 170, .8);
    168168        box-shadow:
    169169                0 0 0 1px #5b9dd9,
    170                 0 0 2px 1px rgba(30, 140, 190, .8);
     170                0 0 2px 1px rgba(0, 115, 170, .8);
    171171}
    172172
    173173.wp-core-ui .button.active,
     
    179179        color: #32373c;
    180180        -webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
    181181        box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
     182        transform: translateY(1px);
    182183}
    183184
    184185.wp-core-ui .button.active:focus {
    185186        -webkit-box-shadow:
    186187                inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ),
    187188                0 0 0 1px #5b9dd9,
    188                 0 0 2px 1px rgba(30, 140, 190, .8);
     189                0 0 2px 1px rgba(0, 115, 170, .8);
    189190        box-shadow:
    190191                inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ),
    191192                0 0 0 1px #5b9dd9,
    192                 0 0 2px 1px rgba(30, 140, 190, .8);
     193                0 0 2px 1px rgba(0, 115, 170, .8);
    193194}
    194195
    195196.wp-core-ui .button[disabled],
     
    213214---------------------------------------------------------------------------- */
    214215
    215216.wp-core-ui .button-primary {
    216         background: #00a0d2;
    217         border-color: #0073aa;
    218         -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5), 0 1px 0 rgba( 0, 0, 0, 0.15 );
    219         box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5 ), 0 1px 0 rgba( 0, 0, 0, 0.15 );
     217        background: #0085ba;
     218        border-color: #0085ba #0073aa #0073aa;
     219        -webkit-box-shadow: 0 1px 0 #0073aa;
     220        box-shadow: 0 1px 0 #0073aa;
    220221        color: #fff;
    221222        text-decoration: none;
     223        text-shadow: 0 -1px 1px #006799,
     224                1px 0 1px #006799,
     225                0 1px 1px #006799,
     226                -1px 0 1px #006799;
    222227}
    223228
    224229.wp-core-ui .button-primary.hover,
    225230.wp-core-ui .button-primary:hover,
    226231.wp-core-ui .button-primary.focus,
    227232.wp-core-ui .button-primary:focus {
    228         background: #0091cd;
    229         border-color: #0073aa;
    230         -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 );
    231         box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 );
     233        background: #008ec2;
     234        border-color: #006799;
     235        -webkit-box-shadow: 0 1px 0 #006799;
     236        box-shadow: 0 1px 0 #006799;
    232237        color: #fff;
    233238}
    234239
    235240.wp-core-ui .button-primary.focus,
    236241.wp-core-ui .button-primary:focus {
    237         border-color: #0e3950;
    238         -webkit-box-shadow:
    239                 inset 0 1px 0 rgba( 120, 200, 230, 0.6 ),
    240                 0 0 0 1px #5b9dd9,
    241                 0 0 2px 1px rgba(30, 140, 190, .8);
    242         box-shadow:
    243                 inset 0 1px 0 rgba( 120, 200, 230, 0.6 ),
    244                 0 0 0 1px #5b9dd9,
    245                 0 0 2px 1px rgba(30, 140, 190, .8);
     242        -webkit-box-shadow: 0 1px 0 #0073aa,
     243                0 0 2px 1px #33b3db;
     244        box-shadow: 0 1px 0 #0073aa,
     245                0 0 2px 1px #33b3db;
    246246}
    247247
    248248.wp-core-ui .button-primary.active,
     
    250250.wp-core-ui .button-primary.active:focus,
    251251.wp-core-ui .button-primary:active {
    252252        background: #0073aa;
    253         border-color: #005082;
    254         color: rgba( 255, 255, 255, 0.95 );
    255         -webkit-box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 );
    256         box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 );
     253        border-color: #006799;
     254        -webkit-box-shadow: inset 0 2px 0 #006799;
     255        box-shadow: inset 0 2px 0 #006799;
     256        color: rgba( 255, 255, 255, 0.95 );
    257257        vertical-align: top;
    258258}
    259259