Make WordPress Core

Ticket #52230: 52230.diff

File 52230.diff, 9.3 KB (added by ryelle, 4 years ago)
  • src/wp-admin/css/colors/_admin.scss

     
    623623        color: $menu-highlight-text;
    624624}
    625625
     626
     627/* Nav Menus */
     628
     629.nav-menus-php .item-edit:focus:before {
     630        box-shadow:
     631                0 0 0 1px lighten($button-color, 10),
     632                0 0 2px 1px $button-color;
     633}
     634
     635
    626636/* Responsive Component */
    627637
    628638div#wp-responsive-toggle a:before {
     
    654664}
    655665
    656666/* Customizer */
    657 #customize-controls .control-section:hover > .accordion-section-title,
    658 #customize-controls .control-section .accordion-section-title:hover,
    659 #customize-controls .control-section.open .accordion-section-title,
    660 #customize-controls .control-section .accordion-section-title:focus {
    661         color: $highlight-color;
    662         border-left-color: $highlight-color;
    663 }
     667.wp-core-ui {
     668        #customize-controls .control-section:hover > .accordion-section-title,
     669        #customize-controls .control-section .accordion-section-title:hover,
     670        #customize-controls .control-section.open .accordion-section-title,
     671        #customize-controls .control-section .accordion-section-title:focus {
     672                color: $link;
     673                border-left-color: $button-color;
     674        }
    664675
    665 .customize-controls-close:focus,
    666 .customize-controls-close:hover,
    667 .customize-controls-preview-toggle:focus,
    668 .customize-controls-preview-toggle:hover {
    669         color: $highlight-color;
    670         border-top-color: $highlight-color;
    671 }
     676        .customize-controls-close:focus,
     677        .customize-controls-close:hover,
     678        .customize-controls-preview-toggle:focus,
     679        .customize-controls-preview-toggle:hover {
     680                color: $link;
     681                border-top-color: $button-color;
     682        }
    672683
    673 .customize-panel-back:hover,
    674 .customize-panel-back:focus,
    675 .customize-section-back:hover,
    676 .customize-section-back:focus {
    677         color: $highlight-color;
    678         border-left-color: $highlight-color;
    679 }
     684        .customize-panel-back:hover,
     685        .customize-panel-back:focus,
     686        .customize-section-back:hover,
     687        .customize-section-back:focus {
     688                color: $link;
     689                border-left-color: $button-color;
     690        }
    680691
    681 .customize-screen-options-toggle:hover,
    682 .customize-screen-options-toggle:active,
    683 .customize-screen-options-toggle:focus,
    684 .active-menu-screen-options .customize-screen-options-toggle,
    685 #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:hover,
    686 #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:active,
    687 #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:focus {
    688         color: $highlight-color;
    689 }
     692        .customize-screen-options-toggle:hover,
     693        .customize-screen-options-toggle:active,
     694        .customize-screen-options-toggle:focus,
     695        .active-menu-screen-options .customize-screen-options-toggle,
     696        #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:hover,
     697        #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:active,
     698        #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:focus {
     699                color: $link;
     700        }
    690701
    691 .wp-customizer .menu-item .submitbox .submitdelete:focus,
    692 .customize-screen-options-toggle:focus:before,
    693 #customize-controls .customize-info .customize-help-toggle:focus:before,
    694 .wp-customizer button:focus .toggle-indicator:before,
    695 .menu-delete:focus,
    696 .menu-item-bar .item-delete:focus:before,
    697 #available-menu-items .item-add:focus:before {
    698         box-shadow:
    699                 0 0 0 1px lighten($highlight-color, 10),
    700                 0 0 2px 1px $highlight-color;
    701 }
     702        .customize-screen-options-toggle:focus:before,
     703        #customize-controls .customize-info .customize-help-toggle:focus:before,
     704        &.wp-customizer button:focus .toggle-indicator:before,
     705        .menu-item-bar .item-delete:focus:before,
     706        #available-menu-items .item-add:focus:before,
     707        #customize-save-button-wrapper .save:focus,
     708        #publish-settings:focus {
     709                box-shadow:
     710                        0 0 0 1px lighten($button-color, 10),
     711                        0 0 2px 1px $button-color;
     712        }
    702713
    703 #customize-controls .customize-info.open .customize-help-toggle,
    704 #customize-controls .customize-info .customize-help-toggle:focus,
    705 #customize-controls .customize-info .customize-help-toggle:hover {
    706         color: $highlight-color;
    707 }
     714        #customize-controls .customize-info.open .customize-help-toggle,
     715        #customize-controls .customize-info .customize-help-toggle:focus,
     716        #customize-controls .customize-info .customize-help-toggle:hover {
     717                color: $link;
     718        }
    708719
    709 .control-panel-themes .customize-themes-section-title:focus,
    710 .control-panel-themes .customize-themes-section-title:hover {
    711         border-left-color: $highlight-color;
    712         color: $highlight-color;
    713 }
     720        .control-panel-themes .customize-themes-section-title:focus,
     721        .control-panel-themes .customize-themes-section-title:hover {
     722                border-left-color: $button-color;
     723                color: $link;
     724        }
    714725
    715 .control-panel-themes .theme-section .customize-themes-section-title.selected:after {
    716         background: $highlight-color;
    717 }
     726        .control-panel-themes .theme-section .customize-themes-section-title.selected:after {
     727                background: $button-color;
     728        }
    718729
    719 .control-panel-themes .customize-themes-section-title.selected {
    720         color: $highlight-color;
    721 }
     730        .control-panel-themes .customize-themes-section-title.selected {
     731                color: $link;
     732        }
    722733
    723 #customize-theme-controls .control-section:hover > .accordion-section-title:after,
    724 #customize-theme-controls .control-section .accordion-section-title:hover:after,
    725 #customize-theme-controls .control-section.open .accordion-section-title:after,
    726 #customize-theme-controls .control-section .accordion-section-title:focus:after,
    727 #customize-outer-theme-controls .control-section:hover > .accordion-section-title:after,
    728 #customize-outer-theme-controls .control-section .accordion-section-title:hover:after,
    729 #customize-outer-theme-controls .control-section.open .accordion-section-title:after,
    730 #customize-outer-theme-controls .control-section .accordion-section-title:focus:after {
    731         color: $highlight-color;
    732 }
     734        #customize-theme-controls .control-section:hover > .accordion-section-title:after,
     735        #customize-theme-controls .control-section .accordion-section-title:hover:after,
     736        #customize-theme-controls .control-section.open .accordion-section-title:after,
     737        #customize-theme-controls .control-section .accordion-section-title:focus:after,
     738        #customize-outer-theme-controls .control-section:hover > .accordion-section-title:after,
     739        #customize-outer-theme-controls .control-section .accordion-section-title:hover:after,
     740        #customize-outer-theme-controls .control-section.open .accordion-section-title:after,
     741        #customize-outer-theme-controls .control-section .accordion-section-title:focus:after {
     742                color: $link;
     743        }
    733744
    734 .customize-control .attachment-media-view .button-add-media:focus {
    735         background-color: #fbfbfc;
    736         border-color: $highlight-color;
    737         border-style: solid;
    738         box-shadow: 0 0 0 1px $highlight-color;
    739         outline: 2px solid transparent;
    740 }
     745        .customize-control .attachment-media-view .button-add-media:focus {
     746                background-color: #fbfbfc;
     747                border-color: $button-color;
     748                border-style: solid;
     749                box-shadow: 0 0 0 1px $button-color;
     750                outline: 2px solid transparent;
     751        }
    741752
    742 .wp-full-overlay-footer .devices button:focus,
    743 .wp-full-overlay-footer .devices button.active:hover {
    744         border-bottom-color: $highlight-color;
    745 }
     753        .wp-full-overlay-footer .devices button:focus,
     754        .wp-full-overlay-footer .devices button.active:hover {
     755                border-bottom-color: $button-color;
     756        }
    746757
    747 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
    748 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
    749         color: $highlight-color;
    750 }
     758        .wp-full-overlay-footer .devices button:hover:before,
     759        .wp-full-overlay-footer .devices button:focus:before {
     760                color: $button-color;
     761        }
    751762
    752 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
    753 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
    754         box-shadow:
    755                 0 0 0 1px lighten($highlight-color, 10),
    756                 0 0 2px 1px $highlight-color;
    757 }
     763        .wp-full-overlay .collapse-sidebar:hover,
     764        .wp-full-overlay .collapse-sidebar:focus {
     765                color: $button-color;
     766        }
    758767
    759 .wp-full-overlay-footer .devices button:hover:before,
    760 .wp-full-overlay-footer .devices button:focus:before {
    761         color: $highlight-color;
     768        .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
     769        .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
     770                box-shadow:
     771                        0 0 0 1px lighten($button-color, 10),
     772                        0 0 2px 1px $button-color;
     773        }
     774
     775        &.wp-customizer .theme-overlay .theme-header .close:focus,
     776        &.wp-customizer .theme-overlay .theme-header .close:hover,
     777        &.wp-customizer .theme-overlay .theme-header .right:focus,
     778        &.wp-customizer .theme-overlay .theme-header .right:hover,
     779        &.wp-customizer .theme-overlay .theme-header .left:focus,
     780        &.wp-customizer .theme-overlay .theme-header .left:hover {
     781                border-bottom-color: $button-color;
     782                color: $link;
     783        }
    762784}
  • src/wp-admin/css/customize-controls.css

     
    28172817                position: absolute;
    28182818                top: 0;
    28192819                left: 48px;
    2820                 line-height: 3.2;
     2820                line-height: 2.6;
    28212821                font-size: 14px;
    2822                 padding: 0 12px;
     2822                padding: 0 12px 4px;
    28232823                margin: 0;
    28242824                height: 45px;
    28252825                background: #f0f0f1;
    28262826                border: 0;
    28272827                border-right: 1px solid #dcdcde;
     2828                border-top: 4px solid #f0f0f1;
    28282829                color: #50575e;
    28292830                cursor: pointer;
    28302831                transition: color .1s ease-in-out, background .1s ease-in-out;