diff --git a/assets/css/common/footer.css b/assets/css/common/footer.css index b0dc264..cbfee41 100644 --- a/assets/css/common/footer.css +++ b/assets/css/common/footer.css @@ -22,12 +22,18 @@ } .footer a { + font-weight: 500; color: inherit; - border-bottom: 1px solid var(--secondary); + box-shadow: var(--link-underline-shadow); } .footer a:hover { - border-bottom: 1px solid var(--primary); + color: var(--link-hover-color); + box-shadow: var(--link-hover-underline-shadow); +} + +.top-link:hover { + color: var(--link-hover-color); } .top-link { @@ -49,10 +55,6 @@ filter: drop-shadow(0px 0px 0px var(--theme)); } -.footer a:hover, -.top-link:hover { - color: var(--primary); -} .top-link:focus, #theme-toggle:focus { diff --git a/assets/css/common/header.css b/assets/css/common/header.css index 4c8de8f..0805c56 100644 --- a/assets/css/common/header.css +++ b/assets/css/common/header.css @@ -8,7 +8,7 @@ line-height: var(--header-height); } -.nav a { +.logo a { display: block; } @@ -69,11 +69,16 @@ body:not(.dark) #sun { font-size: 16px; font-weight: 500; color: var(--secondary); + display: inline-block; + line-height: 1.5em; +} +#menu a:hover { + color: var(--link-hover-color); } #menu .active { color: var(--primary); - border-bottom: 2px solid currentColor; + box-shadow: 0 2px 0 var(--primary); } .lang-switch li, diff --git a/assets/css/common/post-entry.css b/assets/css/common/post-entry.css index 885aa2a..8c37127 100644 --- a/assets/css/common/post-entry.css +++ b/assets/css/common/post-entry.css @@ -44,7 +44,7 @@ } .post-entry:active { - transform: scale(0.96); + transform: scale(0.97); } .tag-entry .entry-cover { diff --git a/assets/css/common/post-single.css b/assets/css/common/post-single.css index 8730e88..cf6b5f5 100644 --- a/assets/css/common/post-single.css +++ b/assets/css/common/post-single.css @@ -70,7 +70,17 @@ } .post-content a { - box-shadow: 0 1px 0; + font-weight: 500; + color: var(--primary); + box-shadow: var(--link-underline-shadow); +} +.post-content a:hover { + color: var(--link-hover-color); + box-shadow: var(--link-hover-underline-shadow); +} +.post-content a.anchor:hover { + color: var(--primary); + box-shadow: 0 -2px 0 var(--secondary) inset; } .post-content a code { @@ -78,6 +88,31 @@ border-radius: 0; box-shadow: 0 -1px 0 var(--primary) inset; } +.post-content a:hover code { + box-shadow: 0 -1px 0 var(--link-hover-underline-color) inset, 0 1px 0 var(--link-hover-underline-color); +} + +h1 .anchor, +h2 .anchor, +h3 .anchor, +h4 .anchor, +h5 .anchor, +h6 .anchor { + box-shadow: none; + user-select: none; +} + +h1:hover .anchor, +h2:hover .anchor, +h3:hover .anchor, +h4:hover .anchor, +h5:hover .anchor, +h6:hover .anchor { + color: var(--secondary); + margin-inline-start: 8px; + font-weight: 500; + display: inline-flex; +} .post-content del { text-decoration: none; @@ -366,18 +401,6 @@ transform: scale(0.96); } -h1:hover .anchor, -h2:hover .anchor, -h3:hover .anchor, -h4:hover .anchor, -h5:hover .anchor, -h6:hover .anchor { - display: inline-flex; - color: var(--secondary); - margin-inline-start: 8px; - font-weight: 500; - user-select: none; -} .post-content :not(table) ::-webkit-scrollbar-thumb { border: 2px solid var(--hljs-bg); diff --git a/assets/css/core/theme-vars.css b/assets/css/core/theme-vars.css index 955b7e4..33eaebb 100644 --- a/assets/css/core/theme-vars.css +++ b/assets/css/core/theme-vars.css @@ -7,6 +7,7 @@ --header-height: 60px; --footer-height: 60px; --radius: 8px; + --theme: rgb(255, 255, 255); --entry: rgb(255, 255, 255); --primary: rgb(30, 30, 30); @@ -16,6 +17,11 @@ --hljs-bg: rgb(28, 29, 33); --code-bg: rgb(245, 245, 245); --border: rgb(238, 238, 238); + --link-color: var(--primary); + --link-hover-color: #573eaa; + --link-underline-shadow: 0 1px 0 var(--link-color); + --link-hover-underline-color: #573eaa; + --link-hover-underline-shadow: 0 2px 0 var(--link-hover-underline-color); } .dark { @@ -28,6 +34,11 @@ --hljs-bg: rgb(46, 46, 51); --code-bg: rgb(55, 56, 62); --border: rgb(51, 51, 51); + --link-color: var(--primary); + --link-hover-color: #876fd6; + --link-underline-shadow: 0 1px 0 var(--link-color); + --link-hover-underline-color: var(--link-hover-color); + --link-hover-underline-shadow: 0 2px 0 var(--link-hover-underline-color); } .list { diff --git a/layouts/partials/header.html b/layouts/partials/header.html index f172b3b..a80249d 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -126,12 +126,11 @@
  • - - {{- .Pre }} - {{- .Name -}} - {{ .Post -}} - + {{- cond $is_search (" accesskey=/" | safeHTMLAttr) ("" | safeHTMLAttr ) }} + {{- if eq $menu_item_url $page_url }} class="active" {{- end }}> + {{- .Pre }} + {{- .Name -}} + {{ .Post -}}
  • {{- end }}