Ticket #34904: 34904.11.diff
File 34904.11.diff, 12.2 KB (added by , 5 years ago) |
---|
-
src/wp-admin/css/colors/_admin.scss
43 43 color: $link-focus; 44 44 } 45 45 46 input[type="text"]:focus, 47 input[type="password"]:focus, 48 input[type="color"]:focus, 49 input[type="date"]:focus, 50 input[type="datetime"]:focus, 51 input[type="datetime-local"]:focus, 52 input[type="email"]:focus, 53 input[type="month"]:focus, 54 input[type="number"]:focus, 55 input[type="search"]:focus, 56 input[type="tel"]:focus, 57 input[type="text"]:focus, 58 input[type="time"]:focus, 59 input[type="url"]:focus, 60 input[type="week"]:focus, 61 input[type="checkbox"]:focus, 62 input[type="radio"]:focus, 63 select:focus, 64 textarea:focus { 65 border-color: $highlight-color; 66 box-shadow: 0 0 0 1px $highlight-color; 67 } 46 68 69 47 70 /* Core UI */ 48 71 49 72 .wp-core-ui { 73 .button.focus, 74 .button:focus, 75 .button-secondary:focus { 76 border-color: $button-color; 77 color: darken( $button-color, 5% ); 78 box-shadow: 0 0 0 1px $button-color; 79 } 80 50 81 .button-primary { 51 82 @include button( $button-color ); 52 83 } -
src/wp-admin/css/colors/_mixins.scss
1 1 /* 2 * Button mixin- creates 3d-ishbutton effect with correct2 * Button mixin- creates a button effect with correct 3 3 * highlights/shadows, based on a base color. 4 4 */ 5 5 @mixin button( $button-color, $text-color: #fff ) { 6 6 background: $button-color; 7 border-color: darken( $button-color, 10% ) darken( $button-color, 15% ) darken( $button-color, 15% );7 border-color: $button-color; 8 8 color: $text-color; 9 box-shadow: 0 1px 0 darken( $button-color, 15% );10 text-shadow: 0 -1px 1px darken( $button-color, 15% ),11 1px 0 1px darken( $button-color, 15% ),12 0 1px 1px darken( $button-color, 15% ),13 -1px 0 1px darken( $button-color, 15% );14 9 15 10 &:hover, 16 11 &:focus { 17 12 background: lighten( $button-color, 3% ); 18 border-color: darken( $button-color, 15% );13 border-color: darken( $button-color, 3% ); 19 14 color: $text-color; 20 box-shadow: 0 1px 0 darken( $button-color, 15% );21 15 } 22 16 23 17 &:focus { 24 box-shadow: inset 0 1px 0 darken( $button-color, 10% ), 25 0 0 2px 1px #33b3db; 18 box-shadow: 0 0 0 1px #fff, 0 0 0 3px $button-color; 26 19 } 27 20 28 21 &:active, … … 29 22 &.active, 30 23 &.active:focus, 31 24 &.active:hover { 32 background: darken( $button-color, 10% ); 33 border-color: darken( $button-color, 15% ); 34 box-shadow: inset 0 2px 0 darken( $button-color, 15% ); 25 background: darken( $button-color, 5% ); 26 border-color: darken( $button-color, 5% ); 35 27 } 36 28 37 29 &[disabled], … … 39 31 &.button-primary-disabled, 40 32 &.disabled { 41 33 color: hsl( hue( $button-color ), 10%, 80% ) !important; 42 background: darken( $button-color, 8% ) !important;43 border-color: darken( $button-color, 15% ) !important;34 background: lighten( $button-color, 15% ) !important; 35 border-color: lighten( $button-color, 15% ) !important; 44 36 text-shadow: none !important; 45 37 } 46 47 &.button-hero {48 box-shadow: 0 2px 0 darken( $button-color, 15% ) !important;49 &:active {50 box-shadow: inset 0 3px 0 darken( $button-color, 15% ) !important;51 }52 }53 54 38 } -
src/wp-admin/css/common.css
272 272 a:focus .media-icon img, 273 273 .wp-person a:focus .gravatar { 274 274 color: #124964; 275 box-shadow: 276 0 0 0 1px #5b9dd9, 277 0 0 2px 1px rgba(30, 140, 190, 0.8); 278 /* Only visible in Windows High Contrast mode */ 279 outline: 1px solid transparent; 275 outline: 1px dotted #555d66; 280 276 } 281 277 282 278 .ie8 a:focus { … … 284 280 } 285 281 286 282 #adminmenu a:focus { 287 box-shadow: none; 288 /* Only visible in Windows High Contrast mode */ 289 outline: 1px solid transparent; 283 outline: 1px dotted #555d66; 290 284 outline-offset: -1px; 291 285 } 292 286 … … 623 617 position: relative; 624 618 top: -3px; 625 619 text-decoration: none; 626 border: none; 627 border: 1px solid #ccc; 620 border: 1px solid #7e8993; 628 621 border-radius: 2px; 629 background: #f7f7f7;630 622 text-shadow: none; 631 623 font-weight: 600; 632 624 font-size: 13px; 633 625 line-height: normal; /* IE8-IE11 need this for buttons */ 634 color: # 0073aa; /* some of these controls are button elements and don't inherit from links */626 color: #555; /* use the standard color used for buttons */ 635 627 cursor: pointer; 636 628 } 637 629 … … 641 633 642 634 .wrap .add-new-h2:hover, /* deprecated */ 643 635 .wrap .page-title-action:hover { 644 b order-color: #008EC2;645 b ackground: #00a0d2;646 color: # fff;636 background: #f3f5f6; 637 border-color: #7e8993; 638 color: #007cba; 647 639 } 648 640 649 641 /* lower specificity: color needs to be overridden by :hover and :active */ 650 642 .page-title-action:focus { 651 color: # 124964;643 color: #016087; 652 644 } 653 645 654 646 /* Dashicon for language options on General Settings and Profile screens */ … … 658 650 } 659 651 660 652 .wrap .page-title-action:focus { 661 border-color: # 5b9dd9;662 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);653 border-color: #007cba; 654 box-shadow: 0 0 0 1px #007cba; 663 655 /* Only visible in Windows High Contrast mode */ 664 656 outline: 2px solid transparent; 665 657 } … … 841 833 } 842 834 843 835 .tagchecklist .ntdelbutton:focus .remove-tag-icon:before { 844 box-shadow: 845 0 0 0 1px #5b9dd9, 846 0 0 2px 1px rgba(30, 140, 190, 0.8); 836 outline: 1px dotted #555d66; 847 837 } 848 838 849 839 .key-labels label { … … 1441 1431 } 1442 1432 1443 1433 .notice-dismiss:focus { 1444 outline: none; 1445 box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); 1434 outline: 1px dotted #555d66; 1446 1435 } 1447 1436 1448 1437 .ie8 .notice-dismiss:focus { … … 3070 3059 } 3071 3060 3072 3061 .js .postbox .handlediv:focus .toggle-indicator:before { 3073 box-shadow: 3074 0 0 0 1px #5b9dd9, 3075 0 0 2px 1px rgba(30, 140, 190, 0.8); 3062 outline: 1px dotted #555d66; 3076 3063 } 3077 3064 3078 3065 /* @todo: appears to be Press This only and overridden */ … … 3166 3153 } 3167 3154 [role="treeitem"] .folder-label.focus { 3168 3155 color: #124964; 3169 box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8);3156 outline: 1px dotted #555d66; 3170 3157 } 3171 3158 [role="treeitem"].hover, 3172 3159 [role="treeitem"] .folder-label.hover { … … 3393 3380 } 3394 3381 3395 3382 .widget-top .widget-action:focus .toggle-indicator:before { 3396 box-shadow: 3397 0 0 0 1px #5b9dd9, 3398 0 0 2px 1px rgba(30, 140, 190, 0.8); 3383 outline: 1px dotted #555d66; 3399 3384 } 3400 3385 3401 3386 .control-section .accordion-section-title:after, -
src/wp-admin/css/forms.css
50 50 input[type="radio"]:focus, 51 51 select:focus, 52 52 textarea:focus { 53 border-color: # 5b9dd9;54 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);53 border-color: #007cba; 54 box-shadow: 0 0 0 1px #007cba; 55 55 /* Only visible in Windows High Contrast mode */ 56 56 outline: 2px solid transparent; 57 57 } -
src/wp-admin/css/themes.css
178 178 } 179 179 180 180 .theme-browser .theme:focus { 181 border-color: #5b9dd9; 182 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); 181 outline: 1px dotted #555d66; 183 182 } 184 183 185 184 .theme-browser .theme:focus .more-details { -
src/wp-includes/css/buttons.css
124 124 .wp-core-ui .button, 125 125 .wp-core-ui .button-secondary { 126 126 color: #555; 127 border-color: #cccccc; 128 background: #f7f7f7; 129 box-shadow: 0 1px 0 #cccccc; 127 border-color: #7e8993; 128 background: #f1f1f1; 130 129 vertical-align: top; 131 130 } 132 131 … … 140 139 .wp-core-ui .button.focus, 141 140 .wp-core-ui .button:focus, 142 141 .wp-core-ui .button-secondary:focus { 143 background: #f afafa;144 border-color: # 999;145 color: # 23282d;142 background: #f3f5f6; 143 border-color: #7e8993; 144 color: #007cba; 146 145 } 147 146 148 147 .wp-core-ui .button.focus, 149 148 .wp-core-ui .button:focus, 150 149 .wp-core-ui .button-secondary:focus { 151 border-color: #5b9dd9; 152 box-shadow: 0 0 3px rgba(0, 115, 170, 0.8); 150 background: #f3f5f6; 151 border-color: #007cba; 152 color: #016087; 153 box-shadow: 0 0 0 1px #007cba; 153 154 } 154 155 155 156 .wp-core-ui .button.active, … … 158 159 .wp-core-ui .button-secondary:active { 159 160 background: #eee; 160 161 border-color: #999; 161 box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);162 162 transform: translateY(1px); 163 box-shadow: none; 163 164 } 164 165 165 166 .wp-core-ui .button.active:focus { 166 border-color: #5b9dd9; 167 box-shadow: 168 inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 169 0 0 3px rgba(0, 115, 170, 0.8); 167 border-color: #999; 168 box-shadow: 0 0 0 1px #999; 170 169 } 171 170 172 171 .wp-core-ui .button[disabled], … … 210 209 211 210 .wp-core-ui .button-link:focus { 212 211 color: #124964; 213 box-shadow: 214 0 0 0 1px #5b9dd9, 215 0 0 2px 1px rgba(30, 140, 190, 0.8); 216 /* Only visible in Windows High Contrast mode */ 217 outline: 1px solid transparent; 212 outline: 1px dotted #555d66; 218 213 } 219 214 220 215 .wp-core-ui .button-link-delete { … … 241 236 ---------------------------------------------------------------------------- */ 242 237 243 238 .wp-core-ui .button-primary { 244 background: #0085ba; 245 border-color: #0073aa #006799 #006799; 246 box-shadow: 0 1px 0 #006799; 239 background: #007cba; 240 border-color: #007cba; 247 241 color: #fff; 248 242 text-decoration: none; 249 text-shadow: 0 -1px 1px #006799, 250 1px 0 1px #006799, 251 0 1px 1px #006799, 252 -1px 0 1px #006799; 243 text-shadow: none; 253 244 } 254 245 255 246 .wp-core-ui .button-primary.hover, … … 256 247 .wp-core-ui .button-primary:hover, 257 248 .wp-core-ui .button-primary.focus, 258 249 .wp-core-ui .button-primary:focus { 259 background: #00 8ec2;260 border-color: #00 6799;250 background: #0071a1; 251 border-color: #0071a1; 261 252 color: #fff; 262 253 } 263 254 264 255 .wp-core-ui .button-primary.focus, 265 256 .wp-core-ui .button-primary:focus { 266 box-shadow: 0 1px 0 #0073aa, 267 0 0 2px 1px #33b3db; 257 box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba; 268 258 } 269 259 270 260 .wp-core-ui .button-primary.active, … … 271 261 .wp-core-ui .button-primary.active:hover, 272 262 .wp-core-ui .button-primary.active:focus, 273 263 .wp-core-ui .button-primary:active { 274 background: #0073aa; 275 border-color: #006799; 276 box-shadow: inset 0 2px 0 #006799; 264 background: #00669b; 265 border-color: #00669b; 266 transform: translateY(1px); 267 box-shadow: none; 277 268 } 278 269 279 270 .wp-core-ui .button-primary[disabled], … … 282 273 .wp-core-ui .button-primary.disabled { 283 274 color: #66c6e4 !important; 284 275 background: #008ec2 !important; 285 border-color: #00 7cb2 !important;276 border-color: #008ec2 !important; 286 277 box-shadow: none !important; 287 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1)!important;278 text-shadow: none !important; 288 279 cursor: default; 289 280 } 290 281 291 .wp-core-ui .button.button-primary.button-hero {292 box-shadow: 0 2px 0 #006799;293 }294 295 .wp-core-ui .button.button-primary.button-hero:focus {296 box-shadow:297 0 2px 0 #006799,298 0 1px 0 #0073aa,299 0 0 2px 1px #33b3db;300 }301 302 .wp-core-ui .button.button-primary.button-hero.active,303 .wp-core-ui .button.button-primary.button-hero.active:hover,304 .wp-core-ui .button.button-primary.button-hero.active:focus,305 .wp-core-ui .button.button-primary.button-hero:active {306 box-shadow: inset 0 3px 0 #006799;307 }308 309 282 /* ---------------------------------------------------------------------------- 310 283 4.0 - Button Groups 311 284 ---------------------------------------------------------------------------- */ … … 324 297 margin-right: -1px; 325 298 } 326 299 327 .wp-core-ui .button-group > .button-primary {328 z-index: 100;329 }330 331 .wp-core-ui .button-group > .button:hover {332 z-index: 20;333 }334 335 300 .wp-core-ui .button-group > .button:first-child { 336 301 border-radius: 3px 0 0 3px; 337 302 } … … 340 305 border-radius: 0 3px 3px 0; 341 306 } 342 307 308 .wp-core-ui .button-group > .button-primary + .button { 309 border-left: 0; 310 } 311 343 312 .wp-core-ui .button-group > .button:focus { 344 313 position: relative; 345 314 z-index: 1; 346 315 } 347 316 317 .wp-core-ui .button-group > .button.active { 318 background-color: #e2e4e7; 319 box-shadow: inset 0 1px 0 0 #999; 320 } 321 322 .wp-core-ui .button-group > .button:active, 323 .wp-core-ui .button-group > .button.active { 324 transform: translateY(0); 325 } 326 348 327 /* ---------------------------------------------------------------------------- 349 328 5.0 - Responsive Button Styles 350 329 ---------------------------------------------------------------------------- */ … … 406 385 padding: 0 12px 2px; 407 386 } 408 387 409 } 388 } 389 No newline at end of file