WordPress.org

Make WordPress Core

Ticket #18141: 18141.2.diff

File 18141.2.diff, 12.7 KB (added by helenyhou, 4 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 */