diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 8054d2d335..b4dc0eba9a 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -91,13 +91,13 @@ {{- partial "toc.html" . }} {{- end }} -
-{{- partial "tags.html" . }} -
{{- if .Params.chapter }}
{{- end }}
+
+{{- partial "tags.html" . }} +
{{- if and (not .IsHome) (not .Params.chapter) }}

{{ if eq .Kind "term" }}{{ .Data.Singular }} :: {{ end }}{{ .Title }}

{{- end }} diff --git a/static/css/tags.css b/static/css/tags.css index 9c2cb8155c..dc4a42df4c 100644 --- a/static/css/tags.css +++ b/static/css/tags.css @@ -1,12 +1,12 @@ /* Tags */ #head-tags{ - margin-left:1em; - margin-top:1em; + margin-left:1rem; + margin-top:1rem; } #body .tags a.tag-link { - background: #7dc903; /* var(--MENU-HEADER-BG-color) */ + background: #7dc903; /* var(--TAG-BG-color) */ border-bottom-right-radius: 3px; border-top-right-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,0.2); @@ -20,7 +20,7 @@ } #body .tags a.tag-link:before { - border-color: transparent #7dc903 transparent transparent; /* var(--MENU-HEADER-BG-color) */ + border-color: transparent #7dc903 transparent transparent; /* var(--TAG-BG-color) */ border-style: solid; border-width: 1em 1em 1em 0; content: ""; diff --git a/static/css/theme-neon.css b/static/css/theme-neon.css index edb42464b6..adacfa39b8 100644 --- a/static/css/theme-neon.css +++ b/static/css/theme-neon.css @@ -28,6 +28,8 @@ --CODE-INLINE-BG-color: #282a36; /* color for inline code background */ --CODE-INLINE-BORDER-color: #464646; /* color of inline code border */ + --TAG-BG-color: #cccc00; /* Background color of menu header */ + --MENU-HOME-LINK-color: #323232; /* Color of the home button text */ --MENU-HOME-LINK-HOVER-color: #5e5e5e; /* Color of the hovered home button text */ diff --git a/static/css/variant.css b/static/css/variant.css index 1bb2516830..aa8b5841df 100644 --- a/static/css/variant.css +++ b/static/css/variant.css @@ -1,10 +1,12 @@ :root { - --INTERNAL-MAIN-TITLES-H1-color: var(--MAIN-TITLES-H1-color , var(--MAIN-TEXT-color)); - --INTERNAL-MAIN-TITLES-H2-color: var(--MAIN-TITLES-H2-color , var(--MAIN-TITLES-TEXT-color)); - --INTERNAL-MAIN-TITLES-H3-color: var(--MAIN-TITLES-H3-color , var(--INTERNAL-MAIN-TITLES-H2-color)); - --INTERNAL-MAIN-TITLES-H4-color: var(--MAIN-TITLES-H4-color , var(--INTERNAL-MAIN-TITLES-H3-color)); - --INTERNAL-MAIN-TITLES-H5-color: var(--MAIN-TITLES-H5-color , var(--INTERNAL-MAIN-TITLES-H4-color)); - --INTERNAL-MAIN-TITLES-H6-color: var(--MAIN-TITLES-H6-color , var(--INTERNAL-MAIN-TITLES-H5-color)); + --INTERNAL-TAG-BG-color: var(--TAG-BG-color, var(--MENU-HEADER-BG-color)); + + --INTERNAL-MAIN-TITLES-H1-color: var(--MAIN-TITLES-H1-color, var(--MAIN-TEXT-color)); + --INTERNAL-MAIN-TITLES-H2-color: var(--MAIN-TITLES-H2-color, var(--MAIN-TITLES-TEXT-color)); + --INTERNAL-MAIN-TITLES-H3-color: var(--MAIN-TITLES-H3-color, var(--INTERNAL-MAIN-TITLES-H2-color)); + --INTERNAL-MAIN-TITLES-H4-color: var(--MAIN-TITLES-H4-color, var(--INTERNAL-MAIN-TITLES-H3-color)); + --INTERNAL-MAIN-TITLES-H5-color: var(--MAIN-TITLES-H5-color, var(--INTERNAL-MAIN-TITLES-H4-color)); + --INTERNAL-MAIN-TITLES-H6-color: var(--MAIN-TITLES-H6-color, var(--INTERNAL-MAIN-TITLES-H5-color)); --INTERNAL-BOX-TEXT-color: var(--BOX-TEXT-color); @@ -188,12 +190,12 @@ pre .copy-to-clipboard-button:hover { } #body .tags a.tag-link { - background-color: var(--MENU-HEADER-BG-color); + background-color: var(--INTERNAL-TAG-BG-color); color: var(--MAIN-BG-color, #ffffff); } #body .tags a.tag-link:before { - border-right-color: var(--MENU-HEADER-BG-color); + border-right-color: var(--INTERNAL-TAG-BG-color); } #body .tags a.tag-link:after {