WordPress.org

Make WordPress Core

Ticket #18141: 18141.2.diff

File 18141.2.diff, 12.7 KB (added by helenyhou, 6 years ago)

Focus outline, split button border

  • wp-includes/css/editor-buttons.dev.css

     
    147147        margin: 0 6px 2px;
    148148}
    149149
     150.wp_themeSkin table.mceToolbar:focus,
     151.wp_themeSkin span.mceSeparator:focus {
     152        outline: none;
     153}
     154
    150155.wp_themeSkin #content_toolbar1 {
    151156        margin-top: 2px;
    152157}
     
    176181        margin: 1px;
    177182        -webkit-border-radius: 2px;
    178183        border-radius: 2px;
    179         -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    180         -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    181         box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    182184}
    183185
    184186.wp_themeSkin a.mceButtonEnabled:hover {
     
    189191        margin: 0 0 0 1px;
    190192}
    191193
    192 
    193 .wp_themeSkin a.mceButton:active,
    194 .wp_themeSkin a.mceButtonActive,
    195 .wp_themeSkin a.mceButtonActive:hover,
    196 .wp_themeSkin a.mceButtonSelected {
    197         -webkit-box-shadow:      0 1px 1px rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    198         -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    199         box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    200 }
    201 
    202194.wp_themeSkin .mceButtonDisabled .mceIcon {
    203         opacity: 0.5;
    204         filter: alpha(opacity=50);
     195        opacity: 0.4;
     196        filter: alpha(opacity=40);
    205197}
    206198
    207199/* Separator */
     
    229221        -webkit-border-top-left-radius: 2px;
    230222        border-bottom-left-radius: 2px;
    231223        border-top-left-radius: 2px;
    232         -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    233         -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    234         box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    235224        font-family: Arial, "Bitstream Vera Sans", Helvetica, Verdana, sans-serif;
    236225        font-size: 12px;
    237226        height: 20px;
     
    253242        -webkit-border-top-left-radius: 0;
    254243        border-bottom-left-radius: 0;
    255244        border-top-left-radius: 0;
    256         -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    257         -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    258         box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    259245}
    260246
    261247.wp_themeSkin .mceListBox .mceOpen span {
     
    315301        border-radius: 2px;
    316302}
    317303
    318 .wp_themeSkin table.mceSplitButton td a {
    319         -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    320         -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    321         box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 0 2px 1px #fff;
    322 }
    323 
    324304.wp_themeSkin table.mceSplitButton:hover td {
    325305        background-image: inherit 0 -10px;
    326306}
     
    414394/* ColorSplitButton */
    415395.wp_themeSkin div.mceColorSplitMenu table {
    416396        background-color: #ebebeb;
    417         border-color: #B2B2B2;
     397        border-color: #bbb;
    418398}
    419399
    420400.wp_themeSkin .mceColorSplitMenu td {
     
    426406        width: 9px;
    427407        height: 9px;
    428408        overflow: hidden;
    429         border-color: #B2B2B2;
     409        border-color: #bbb;
    430410}
    431411
    432412.wp_themeSkin .mceColorSplitMenu td.mceMoreColors {
     
    857837.wp_themeSkin .mceButton,
    858838.wp_themeSkin .mceListBox .mceText,
    859839.wp_themeSkin .mceListBox .mceOpen {
    860         border-color: #ccc;
    861         background-color: #eee; /* Fallback */
    862         background-image: -ms-linear-gradient(bottom, #ddd, #fff); /* IE10 */
    863         background-image: -moz-linear-gradient(bottom, #ddd, #fff); /* Firefox */
    864         background-image: -o-linear-gradient(bottom, #ddd, #fff); /* Opera */
    865         background-image: -webkit-gradient(linear, left bottom, left top, from(#ddd), to(#fff)); /* old Webkit */
    866         background-image: -webkit-linear-gradient(bottom, #ddd, #fff); /* new Webkit */
    867         background-image: linear-gradient(bottom, #ddd, #fff); /* proposed W3C Markup */
     840        border-color: transparent;
    868841}
    869842
    870843.wp_themeSkin a.mceButtonEnabled:hover {
    871         border-color: #a0a0a0;
     844        border-color: #bbb;
    872845        background: #ddd; /* Fallback */
    873846        background-image: -ms-linear-gradient(bottom, #ccc, #fff); /* IE10 */
    874847        background-image: -moz-linear-gradient(bottom, #ccc, #fff); /* Firefox */
     
    885858.wp_themeSkin a.mceButtonActive:active,
    886859.wp_themeSkin a.mceButtonActive:hover {
    887860        background-color: #ddd; /* Fallback */
    888         background-image: -ms-linear-gradient(bottom, #eee, #bbb); /* IE10 */
    889         background-image: -moz-linear-gradient(bottom, #eee, #bbb); /* Firefox */
    890         background-image: -o-linear-gradient(bottom, #eee, #bbb); /* Opera */
    891         background-image: -webkit-gradient(linear, left bottom, left top, from(#eee), to(#bbb)); /* old Webkit */
    892         background-image: -webkit-linear-gradient(bottom, #eee, #bbb); /* new Webkit */
    893         background-image: linear-gradient(bottom, #eee, #bbb); /* proposed W3C Markup */
    894         border-color: #909090;
     861        background-image: -ms-linear-gradient(bottom, #fff, #ccc); /* IE10 */
     862        background-image: -moz-linear-gradient(bottom, #fff, #ccc); /* Firefox */
     863        background-image: -o-linear-gradient(bottom, #fff, #ccc); /* Opera */
     864        background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#ccc)); /* old Webkit */
     865        background-image: -webkit-linear-gradient(bottom, #fff, #ccc); /* new Webkit */
     866        background-image: linear-gradient(bottom, #fff, #ccc); /* proposed W3C Markup */
     867        border-color: #bbb;
    895868}
    896869
    897870.wp_themeSkin .mceButtonDisabled {
    898         border-color: #ccc !important;
     871        border-color: transparent !important;
    899872}
    900873
    901874.wp_themeSkin .mceListBox .mceOpen {
     
    909882.wp_themeSkin .mceListBoxSelected .mceText,
    910883.wp_themeSkin table.mceListBoxEnabled:active .mceText {
    911884        background: #ccc;
    912         border-color: #999;
     885        border-color: #bbb;
    913886}
    914887
    915888.wp_themeSkin table.mceListBoxEnabled:hover .mceText,
    916889.wp_themeSkin .mceListBoxHover .mceText,
    917890.wp_themeSkin table.mceListBoxEnabled:hover .mceOpen,
    918891.wp_themeSkin .mceListBoxHover .mceOpen {
    919         border-color: #909090;
     892        border-color: #bbb;
    920893        background-color: #eee; /* Fallback */
    921894        background-image: -ms-linear-gradient(bottom, #ccc, #fff); /* IE10 */
    922895        background-image: -moz-linear-gradient(bottom, #ccc, #fff); /* Firefox */
     
    929902/* SplitButton */
    930903.wp_themeSkin .mceSplitButton a.mceAction,
    931904.wp_themeSkin .mceSplitButton a.mceOpen {
    932         border-color: #ccc;
     905        border-color: transparent;
    933906}
    934907
    935908.wp_themeSkin .mceSplitButton a.mceOpen:hover,
    936909.wp_themeSkin .mceSplitButtonSelected a.mceOpen,
    937910.wp_themeSkin table.mceSplitButtonEnabled:hover a.mceAction,
    938911.wp_themeSkin .mceSplitButton a.mceAction:hover {
    939         border-color: #909090;
     912        border-color: #bbb;
    940913}
    941 
    942 
    943 .wp_themeSkin table.mceSplitButton td {
    944         background-color: #eee; /* Fallback */
    945         background-image: -ms-linear-gradient(bottom, #ddd, #fff); /* IE10 */
    946         background-image: -moz-linear-gradient(bottom, #ddd, #fff); /* Firefox */
    947         background-image: -o-linear-gradient(bottom, #ddd, #fff); /* Opera */
    948         background-image: -webkit-gradient(linear, left bottom, left top, from(#ddd), to(#fff)); /* old Webkit */
    949         background-image: -webkit-linear-gradient(bottom, #ddd, #fff); /* new Webkit */
    950         background-image: linear-gradient(bottom, #ddd, #fff); /* proposed W3C Markup */
     914.wp_themeSkin .mceSplitButtonSelected a.mceOpen {
     915        background-color: #bbb;
    951916}
    952917
    953918.wp_themeSkin table.mceSplitButton:hover td {
  • wp-admin/css/colors-classic.dev.css

     
    879879}
    880880
    881881/* Containers */
     882.wp-editor-wrap .wp-editor-container,
    882883.wp-editor-wrap .wp_themeSkin table.mceLayout {
    883884        border-color: #bed1dd #bed1dd #d0dfe9;
    884885}
     
    900901}
    901902
    902903/* Button */
    903 .wp-editor-wrap .wp_themeSkin .mceButton {
    904         border-color: #B0C8D7;
    905         background-color: #cfdfe9; /* Fallback */
     904.wp-editor-wrap .wp_themeSkin a.mceButtonEnabled:hover {
     905        border-color: #B0C8D7 !important;
     906        background-color: #c7d8e2; /* Fallback */
    906907        background-image: -ms-linear-gradient(bottom, #cfdfe9, #fff); /* IE10 */
    907908        background-image: -moz-linear-gradient(bottom, #cfdfe9, #fff); /* Firefox */
    908909        background-image: -o-linear-gradient(bottom, #cfdfe9, #fff); /* Opera */
     
    911912        background-image: linear-gradient(bottom, #cfdfe9, #fff); /* proposed W3C Markup */
    912913}
    913914
    914 .wp-editor-wrap .wp_themeSkin a.mceButtonEnabled:hover {
    915         border-color: #5589AA !important;
    916         background-color: #c9c9c9; /* Fallback */
    917         background-image: -ms-linear-gradient(bottom, #bdccd5, #fff); /* IE10 */
    918         background-image: -moz-linear-gradient(bottom, #bdccd5, #fff); /* Firefox */
    919         background-image: -o-linear-gradient(bottom, #bdccd5, #fff); /* Opera */
    920         background-image: -webkit-gradient(linear, left bottom, left top, from(#bdccd5), to(#fff)); /* old Webkit        */
    921         background-image: -webkit-linear-gradient(bottom, #bdccd5, #fff) !important; /* new Webkit */
    922         background-image: linear-gradient(bottom, #bdccd5, #fff); /* proposed W3C Markup */
    923 }
    924 
    925915.wp-editor-wrap .wp_themeSkin a.mceButton:active,
    926916.wp-editor-wrap .wp_themeSkin a.mceButtonEnabled:active,
    927917.wp-editor-wrap .wp_themeSkin a.mceButtonSelected:active,
    928918.wp-editor-wrap .wp_themeSkin a.mceButtonActive,
    929919.wp-editor-wrap .wp_themeSkin a.mceButtonActive:active,
    930920.wp-editor-wrap .wp_themeSkin a.mceButtonActive:hover {
    931         background: #B0C8D7 !important;
     921        background: #c7d8e2; /* Fallback */
    932922        background-image: -ms-linear-gradient(bottom, #fff, #cfdfe9); /* IE10 */
    933923        background-image: -moz-linear-gradient(bottom, #fff, #cfdfe9); /* Firefox */
    934924        background-image: -o-linear-gradient(bottom, #fff, #cfdfe9); /* Opera */
    935925        background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#cfdfe9)); /* old Webkit        */
    936926        background-image: -webkit-linear-gradient(bottom, #fff, #cfdfe9) !important; /* new Webkit */
    937927        background-image: linear-gradient(bottom, #fff, #cfdfe9); /* proposed W3C Markup */
    938         border-color: #5589AA !important;
    939 }
    940 
    941 .wp-editor-wrap .wp_themeSkin .mceButtonDisabled {
    942928        border-color: #B0C8D7 !important;
    943929}
    944930
    945931/* ListBox */
    946 .wp-editor-wrap .wp_themeSkin .mceListBox .mceText,
    947 .wp-editor-wrap .wp_themeSkin .mceListBox .mceOpen      {
    948         border-color: #B0C8D7;
    949         background-color: #cfdfe9; /* Fallback */
    950         background-image: -ms-linear-gradient(bottom, #cfdfe9, #fff); /* IE10 */
    951         background-image: -moz-linear-gradient(bottom, #cfdfe9, #fff); /* Firefox */
    952         background-image: -o-linear-gradient(bottom, #cfdfe9, #fff); /* Opera */
    953         background-image: -webkit-gradient(linear, left bottom, left top, from(#cfdfe9), to(#fff)); /* old Webkit       */
    954         background-image: -webkit-linear-gradient(bottom, #cfdfe9, #fff) !important; /* new Webkit */
    955         background-image: linear-gradient(bottom, #cfdfe9, #fff); /* proposed W3C Markup */
    956 }
    957 
    958932.wp-editor-wrap .wp_themeSkin .mceListBox .mceOpen {
    959933        border-left: 0px !important;
    960934}
     
    965939.wp-editor-wrap .wp_themeSkin .mceListBoxSelected .mceOpen,
    966940.wp-editor-wrap .wp_themeSkin .mceListBoxSelected .mceText,
    967941.wp-editor-wrap .wp_themeSkin table.mceListBoxEnabled:active .mceText {
    968         background: #B0C8D7;
    969         border-color: #5589AA !important;
     942        background: #c7d8e2;
     943        border-color: #B0C8D7 !important;
    970944}
    971945
    972946/* List Box Hover */
     
    974948.wp-editor-wrap .wp_themeSkin .mceListBoxHover .mceText,
    975949.wp-editor-wrap .wp_themeSkin table.mceListBoxEnabled:hover .mceOpen,
    976950.wp-editor-wrap .wp_themeSkin .mceListBoxHover .mceOpen {
    977         border-color: #5589AA !important;
    978         background-color: #c9c9c9; /* Fallback */
     951        border-color: #B0C8D7 !important;
     952        background-color: #c7d8e2; /* Fallback */
    979953        background-image: -ms-linear-gradient(bottom, #cfdfe9, #fff); /* IE10 */
    980954        background-image: -moz-linear-gradient(bottom, #cfdfe9, #fff); /* Firefox */
    981955        background-image: -o-linear-gradient(bottom, #cfdfe9, #fff); /* Opera */
     
    990964}
    991965
    992966/* SplitButton */
    993 .wp-editor-wrap .wp_themeSkin .mceSplitButton a.mceAction,
    994 .wp-editor-wrap .wp_themeSkin .mceSplitButton a.mceOpen {
    995         border-color: #B0C8D7;
    996 }
    997 
    998967.wp-editor-wrap .wp_themeSkin .mceSplitButton a.mceOpen:hover,
    999968.wp-editor-wrap .wp_themeSkin .mceSplitButtonSelected a.mceOpen,
    1000969.wp-editor-wrap .wp_themeSkin table.mceSplitButtonEnabled:hover a.mceAction,
    1001970.wp-editor-wrap .wp_themeSkin .mceSplitButton a.mceAction:hover {
    1002         border-color: #5589AA !important;
     971        border-color: #B0C8D7 !important;
    1003972}
    1004973
    1005 
    1006 .wp-editor-wrap .wp_themeSkin table.mceSplitButton td {
    1007         background-color: #cfdfe9; /* Fallback */
    1008         background-image: -ms-linear-gradient(bottom, #cfdfe9, #fff); /* IE10 */
    1009         background-image: -moz-linear-gradient(bottom, #cfdfe9, #fff); /* Firefox */
    1010         background-image: -o-linear-gradient(bottom, #cfdfe9, #fff); /* Opera */
    1011         background-image: -webkit-gradient(linear, left bottom, left top, from(#cfdfe9), to(#fff)); /* old Webkit       */
    1012         background-image: -webkit-linear-gradient(bottom, #cfdfe9, #fff) !important; /* new Webkit */
    1013         background-image: linear-gradient(bottom, #cfdfe9, #fff); /* proposed W3C Markup */
    1014 }
    1015 
    1016974.wp-editor-wrap .wp_themeSkin table.mceSplitButton:hover td {
    1017975        background-image: -ms-linear-gradient(bottom, #cfdfe9, #fff); /* IE10 */
    1018976        background-image: -moz-linear-gradient(bottom, #cfdfe9, #fff); /* Firefox */