diff options
| -rw-r--r-- | hugo.toml | 4 | ||||
| -rw-r--r-- | themes/yinyang/assets/css/index.css | 23 | ||||
| -rw-r--r-- | themes/yinyang/layouts/partials/header.html | 4 |
3 files changed, 23 insertions, 8 deletions
@@ -22,12 +22,12 @@ favicon = "/favicon.png" [[params.nav]] name = "关于" -link = "/about" +link = "/about/" target = "_self" [[params.nav]] name = "链接" -link = "/links" +link = "/links/" target = "_self" [[params.nav]] diff --git a/themes/yinyang/assets/css/index.css b/themes/yinyang/assets/css/index.css index aabbd648..46e9fea4 100644 --- a/themes/yinyang/assets/css/index.css +++ b/themes/yinyang/assets/css/index.css @@ -155,18 +155,33 @@ a:hover { display: flex; justify-content: center; align-items: center; - background-color: var(--text-color); width: fit-content; - padding: 0.25rem 0.75rem; border-radius: 1rem; + overflow: hidden; } .header-item a { + display: inline-block; color: var(--background-color); + padding: 0.25rem 0.5rem; + background-color: var(--text-color); +} + +.header-item:first-child a { + padding-left: 0.75rem +} + +.header-item:last-child a { + padding-right: 0.75rem } -.header-item { - margin: 0 5px; +.header-item.active a { + color: var(--text-color); + background-color: var(--block-background-color); +} + +.header-item a:hover { + text-decoration: none; } .header-line { diff --git a/themes/yinyang/layouts/partials/header.html b/themes/yinyang/layouts/partials/header.html index c176b880..b1f6e50e 100644 --- a/themes/yinyang/layouts/partials/header.html +++ b/themes/yinyang/layouts/partials/header.html @@ -10,8 +10,8 @@ <!-- Navigation --> <nav class="header-items"> {{ range .Site.Params.nav }} - <div class="header-item"> + <div class="header-item {{ if eq .link $.Page.RelPermalink }}active{{ end }}"> <a href="{{ .link }}" target="{{ .target }}">{{ .name }}</a> </div> {{ end }} -</nav>
\ No newline at end of file +</nav> |