From a7772674751b0133a89d175d010084a12a613284 Mon Sep 17 00:00:00 2001 From: Thedro Neely Date: Fri, 18 Jun 2021 00:38:39 -0400 Subject: public/css: Normalize hover and focus anchor colors --- public/css/tdro-dark.css | 8 ++++++-- public/css/tdro.css | 23 +++++++---------------- 2 files changed, 13 insertions(+), 18 deletions(-) diff --git a/public/css/tdro-dark.css b/public/css/tdro-dark.css index 55d203f..fa8b455 100644 --- a/public/css/tdro-dark.css +++ b/public/css/tdro-dark.css @@ -2,6 +2,7 @@ html { background-color: #001f2c; } a { color: #75b2f0; } +a:focus, a:focus span { color: #fff; background-color: #3f5c00; } a:hover img { outline: 6px dashed #75b2f0; box-shadow: none; } a:focus img { outline: 9px dashed #75b2f0; } a.navbar-item:hover { color: #fff !important; } @@ -13,7 +14,7 @@ body, .sans-serif a, .serif a, .document h2 a, .document h3 a, nav#TableOfConten .navbar-item, .subtitle, .has-text-grey-dark { color: #ccc !important; } .navbar-mobile .navbar__active, .navbar-end .navbar__active { color: #75b2f0 !important; } .dropdown-content { background-color: #002e42; border: 1px solid #00405c; } -.dropdown-content a.navbar-item:hover, .dropdown-content .theme-toggle-button:hover { background-color: #4698EA; color: #fff !important; } +.dropdown-content a.navbar-item:hover, .dropdown-content .theme-toggle-button:hover, .dropdown-content .navbar__active { background-color: #004766; } .has-text-danger { color: #ff8f93 !important; } .has-text-primary { color: #a6c9e8 !important; } .footer a { color: #bbb; } @@ -28,7 +29,7 @@ a.navbar-item:focus, a.navbar-item:hover, .navbar-item:hover label { color: #fff .item__box { color: #ddd; background-color: #004766; } .item__box:hover, .item__box:hover svg, .item__box:focus svg { color: #fff; } .message__success { background-color: #55a1ec; border: 1px solid #1259a1; color: black; } -.pagination-link.is-current { background-color: #75b2f0; border-color: #75b2f0; color: #212121 !important; } +.pagination-link.is-current { background-color: #004766; border-color: #00608a; color: #fff !important; } .pagination-previous, .pagination-next, .pagination-link { border-color: #002e42; color: #cad6e2; min-width: 2.25em; } .pagination-previous:hover, .pagination-next:hover, .pagination-link:hover, .pagination-previous.disabled, .pagination-next.disabled { color: #cad6e2; } @@ -52,3 +53,6 @@ input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #cad6e2; } .isso-comment > div.text-wrapper > .text a { color: #cad6e2; } .is-success:focus, .is-link:focus { background-color: #75b2f0 !important; color: #121212 !important; border-color: #75b2f0 !important; } .timeline .timeline-item .timeline-marker { border: 3px solid #001f2c !important; } +.sidenote-container:hover .sidenote-mark span, .sidenote-container:hover .sidenote mark, +.marginnote-container:hover .marginnote-mark span, .marginnote-container:hover .marginnote mark, +.sidenote-container:hover .sidenote a, .marginnote-container:hover .marginnote a { color: #fff; background-color: #3f5c00; } diff --git a/public/css/tdro.css b/public/css/tdro.css index 842814c..b14a762 100644 --- a/public/css/tdro.css +++ b/public/css/tdro.css @@ -3924,7 +3924,7 @@ html.has-navbar-fixed-top, body.has-navbar-fixed-top, html.has-navbar-fixed-bott .navbar__middle .dropdown { padding: 0; } .dropdown label { cursor: pointer; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 1.5rem; } .dropdown-content .navbar-item { margin: 0; padding: 0.65rem 1rem; width: 100%; } -.dropdown-content .navbar__active { font-weight: 700; color: #014cc6; } +.dropdown-content .navbar__active { font-weight: 700; background-color: #ebf2ff; } .dropdown-content a.navbar-item:hover, .dropdown-content .theme-toggle-button:hover { background-color: #ffeac2; color: black; } .dropdown-input[type="checkbox"]:checked ~ .dropdown-menu { display: block; } @@ -4028,18 +4028,10 @@ h1.article__list:not(:first-child) { margin-top: 1.5rem; } * Focus Links */ -.focus-link:focus, -li a:focus, -li a:focus span, -.post-header a:focus, -.sans-serif > a:focus, -.serif > a:focus, -.isso-comment > div.text-wrapper > .text a:focus, -.front__more:focus { background-color: #fefe98 !important; color: black !important; outline: none; } - +a:focus, a:focus span { background-color: #fefe98; color: #014cc6; outline: none; } a:focus img { outline: 2px solid; } a:hover img { box-shadow: 0 8px 32px #999; } - +figure > a:focus { background-color: transparent; } .is-success:focus, .is-link:focus { background-color: #ebebeb !important } @@ -4167,11 +4159,10 @@ input.sidenote-toggle, input.marginnote-toggle { display: none; } mark { background-color: transparent; color: unset; } -.sidenote-container:hover .sidenote-mark span, -.sidenote-container:hover .sidenote mark, -.marginnote-container:hover .marginnote-mark span, -.marginnote-container:hover .marginnote mark { background-color: #fefe98; color: #000; } -.sidenote-container:hover .sidenote a, .marginnote-container:hover .marginnote a { background-color: #fefe98; color: #000; border-color: dodgerblue; } +.sidenote-container:hover .sidenote-mark span, .sidenote-container:hover .sidenote mark, +.marginnote-container:hover .marginnote-mark span, .marginnote-container:hover .marginnote mark, +.sidenote-container:hover .sidenote a, .marginnote-container:hover .marginnote a { background-color: #fefe98; color: #000; } +.sidenote-container:hover .sidenote a, .marginnote-container:hover .marginnote a { border-color: dodgerblue; } .sideimage > a, .sideimage a:focus { border-bottom: 1px solid transparent !important; background-color: transparent !important; } @media (max-width: 768px) { -- cgit v1.2.3