diff --git a/curator/style.css b/curator/style.css index df43466051..3592284145 100644 --- a/curator/style.css +++ b/curator/style.css @@ -23,28 +23,41 @@ Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, feature } /* - * Button hover styles. + * Button pseudo-class styles. * Necessary until the following issue is resolved in Gutenberg: * https://github.com/WordPress/gutenberg/issues/27075 */ -.wp-block-button:not(.is-style-outline) .wp-block-button__link { + .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background) { padding: 0; } -.wp-block-button__link:hover { +.wp-block-button__link:visited { + color: currentColor; +} +.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { text-decoration: underline; - color: var(--wp--preset--color--foreground); + color: var(--wp--preset--color--primary); } -.wp-block-button__link.wp-block-button__link:active { +.wp-block-button:is(.is-style-outline) .wp-block-button__link:hover { + background: var(--wp--preset--color--foreground); + border-color: var(--wp--preset--color--foreground); color: var(--wp--preset--color--background); - background-color: var(--wp--preset--color--primary); +} +.wp-block-button__link.wp-block-button__link:active { + color: var(--wp--preset--color--primary); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus { - color: var(--wp--preset--color--foreground); - border-bottom: 1px dashed var(--wp--preset--color--foreground); + color: var(--wp--preset--color--primary); + text-decoration-line: underline; + text-decoration-thickness: .08rem; + text-decoration-style: dotted; + text-underline-offset: .1rem; } .wp-block-button:is(.is-style-outline) .wp-block-button__link:focus { - outline: 1px dashed var(--wp--preset--color--foreground); + background-color: var(--wp--preset--color--primary); + border-color: var(--wp--preset--color--primary); + color: var(--wp--preset--color--background); + outline: 1px dotted var(--wp--preset--color--primary); } .wp-block-search__button.wp-block-search__button, @@ -72,7 +85,8 @@ Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, feature ):is( :focus ) { - outline: 1px dashed var(--wp--preset--color--foreground); + border: 1px solid var(--wp--preset--color--background); + outline: 1px dotted var(--wp--preset--color--foreground); } /* @@ -86,7 +100,7 @@ Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, feature .wp-block-file .wp-block-file__button { background-color: var(--wp--preset--color--foreground); border-radius: 0; - border: none; + border: 1px solid var(--wp--preset--color--foreground); color: var(--wp--preset--color--background); font-size: var(--wp--preset--typography--font-size--normal); padding: calc(0.667em + 2px) calc(1.333em + 2px); @@ -120,7 +134,9 @@ a:not( a:not( .wp-block-search__button, - .wp-block-button__link + .wp-block-button__link, + .wp-block-navigation-link__content, + .wp-block-navigation-item__content ):active { text-decoration: none; background-color: var(--wp--preset--color--tertiary); @@ -132,14 +148,16 @@ a:not( :is( .wp-block-pages-list__item .wp-block-pages-list__item__link, - .wp-block-navigation-link__content + .wp-block-navigation-link__content, + .wp-block-navigation-item__content ):hover { text-decoration: underline; } :is( .wp-block-pages-list__item .wp-block-pages-list__item__link, - .wp-block-navigation-link__content + .wp-block-navigation-link__content, + .wp-block-navigation-item__content ):focus { text-decoration-line: underline; text-decoration-style: dotted; @@ -147,9 +165,10 @@ a:not( :is( .wp-block-pages-list__item .wp-block-pages-list__item__link, - .wp-block-navigation-link__content + .wp-block-navigation-link__content, + .wp-block-navigation-item__content ):active { - background-color: var(--wp--preset--color--tertiary); + text-decoration: underline; }