mirror of https://github.com/google/docsy.git
Always show lang menu in navbar (#2303)
This commit is contained in:
Patrice Chalin
GitHub
parent
16335ca146
commit
aa8a7015c7
11
CHANGELOG.md
11
CHANGELOG.md
|
|
@ -26,6 +26,11 @@ For the full list of changes, see the [0.x.y] release notes.
|
|||
|
||||
**Breaking changes**:
|
||||
|
||||
- **Appearance**:
|
||||
- The **language menu** is now visible from the navbar on all screen sizes
|
||||
([#2303]). The menu is hidden from the sidebar by default. To restore the
|
||||
legacy behavior, set `ui.sidebar_lang_menu` to `true` in your project's
|
||||
config. For details see, [Adding a language menu][].
|
||||
- **Shortcodes**:
|
||||
- The alert shortcode has been reworked to address [#906] and [#939]. It can
|
||||
now be used with Markdown content, and it can contain calls to other
|
||||
|
|
@ -43,8 +48,12 @@ For the full list of changes, see the [0.x.y] release notes.
|
|||
- Hamburger menu toggle button icon changes to an X when the menu is expanded
|
||||
([#2301]). This is a style change only.
|
||||
|
||||
[0.x.y]: https://github.com/google/docsy/releases/latest?FIXME=v0.X.Y
|
||||
[#2300]: https://github.com/google/docsy/pull/2300
|
||||
[#2301]: https://github.com/google/docsy/pull/2301
|
||||
[#2303]: https://github.com/google/docsy/pull/2303
|
||||
[0.x.y]: https://github.com/google/docsy/releases/latest?FIXME=v0.X.Y
|
||||
[Adding a language menu]:
|
||||
https://www.docsy.dev/docs/adding-content/navigation/#adding-a-language-drop-down
|
||||
|
||||
## 0.12.0
|
||||
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@
|
|||
}
|
||||
|
||||
.navbar-nav {
|
||||
padding-top: $spacer * 0.5;
|
||||
// padding-top: $spacer * 0.5;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
|
@ -69,10 +69,6 @@
|
|||
.nav-item {
|
||||
padding-inline-end: $spacer * 0.5;
|
||||
}
|
||||
|
||||
.navbar-nav {
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(lg) {
|
||||
|
|
@ -88,12 +84,17 @@
|
|||
}
|
||||
|
||||
.navbar-nav {
|
||||
padding-bottom: 2rem;
|
||||
// padding-bottom: 2rem;
|
||||
overflow-x: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.td-light-dark-menu {
|
||||
position: unset !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.bi {
|
||||
// Adapted from: https://github.com/twbs/bootstrap/blob/main/site/layouts/_default/examples.html
|
||||
width: 1em;
|
||||
|
|
@ -101,12 +102,55 @@
|
|||
vertical-align: -.125em;
|
||||
fill: currentcolor;
|
||||
}
|
||||
}
|
||||
|
||||
.td-lang-menu {
|
||||
position: unset !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&__title {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
|
||||
&::before {
|
||||
font: var(--fa-font-solid);
|
||||
content: fa-content($fa-var-globe);
|
||||
padding-right: 0.5rem;
|
||||
}
|
||||
|
||||
&-code {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.dropdown {
|
||||
@include media-breakpoint-down(lg) {
|
||||
position: unset;
|
||||
&-text {
|
||||
display: none;
|
||||
}
|
||||
&-code {
|
||||
display: inline;
|
||||
}
|
||||
&::before {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
position: relative;
|
||||
padding-left: 2.5rem;
|
||||
|
||||
&.active::before {
|
||||
font: var(--fa-font-solid);
|
||||
content: fa-content($fa-var-check);
|
||||
position: absolute;
|
||||
left: 0.75rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -194,4 +194,14 @@
|
|||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.td-lang-menu {
|
||||
&__title {
|
||||
padding-left: 0 !important;
|
||||
&-code {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
{{ end -}}
|
||||
|
||||
{{ $outputFormat := partial "outputformat.html" . -}}
|
||||
{{ if and hugo.IsProduction (ne $outputFormat "print") -}}
|
||||
{{ if and hugo.IsProduction (ne $outputFormat "print") (ne .Site.Language.Lang "xx") -}}
|
||||
<meta name="robots" content="index, follow">
|
||||
{{ else -}}
|
||||
<meta name="robots" content="noindex, nofollow">
|
||||
|
|
|
|||
|
|
@ -1,12 +1,35 @@
|
|||
{{/* Link directly to documentation etc., if possible. */ -}}
|
||||
{{ $langPage := cond (gt (len .Translations) 0) . .Site.Home -}}
|
||||
<div class="dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
{{- $langPage.Language.LanguageName -}}
|
||||
<div class="td-lang-menu dropdown">
|
||||
<a class="nav-link dropdown-toggle td-lang-menu__title" href="#" role="button"
|
||||
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<span class="td-lang-menu__title-text">{{ $langPage.Language.LanguageName }}</span>
|
||||
<span class="td-lang-menu__title-code">{{ $langPage.Language.Lang | upper }}</span>
|
||||
</a>
|
||||
{{/* */ -}}
|
||||
|
||||
{{ $allPages := slice . -}}
|
||||
{{ if .Translations -}}
|
||||
{{ $allPages = $allPages | append .Translations -}}
|
||||
{{ end -}}
|
||||
|
||||
<ul class="dropdown-menu">
|
||||
{{ range $langPage.Translations -}}
|
||||
<li><a class="dropdown-item" href="{{ .RelPermalink }}">{{ .Language.LanguageName }}</a></li>
|
||||
{{ end -}}
|
||||
</ul>
|
||||
{{ range $.Site.Languages -}}
|
||||
{{ $translatedPages := where $allPages "Language.Lang" .Lang -}}
|
||||
{{ $translated := "" -}}
|
||||
{{ if gt (len $translatedPages) 0 -}}
|
||||
{{ $translated = index $translatedPages 0 -}}
|
||||
{{- end -}}
|
||||
{{ $isActive := eq $.Site.Language.Lang .Lang -}}
|
||||
<li>
|
||||
{{- if $isActive -}}
|
||||
<span class="dropdown-item active">{{ .LanguageName }}</span>
|
||||
{{- else if $translated -}}
|
||||
<a class="dropdown-item" href="{{ $translated.RelPermalink }}">{{ .LanguageName }}</a>
|
||||
{{- else -}}
|
||||
<span class="dropdown-item disabled">{{ .LanguageName }}</span>
|
||||
{{- end -}}
|
||||
</li>
|
||||
{{- end }}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -53,12 +53,12 @@
|
|||
</li>
|
||||
{{ end -}}
|
||||
{{ if (gt (len .Site.Home.Translations) 0) -}}
|
||||
<li class="nav-item dropdown d-none d-lg-block">
|
||||
<li class="nav-item">
|
||||
{{ partial "navbar-lang-selector.html" . -}}
|
||||
</li>
|
||||
{{ end -}}
|
||||
{{ if .Site.Params.ui.showLightDarkModeMenu -}}
|
||||
<li class="td-light-dark-menu nav-item dropdown">
|
||||
<li class="nav-item">
|
||||
{{ partial "theme-toggler" . }}
|
||||
</li>
|
||||
{{ end -}}
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
{{- if .Site.Params.ui.sidebar_search_disable }} td-sidebar-nav--search-disabled{{ end -}}
|
||||
{{- if .Site.Params.ui.sidebar_menu_foldable }} foldable-nav{{ end -}}
|
||||
" id="td-section-nav">
|
||||
{{ if (gt (len .Site.Home.Translations) 0) -}}
|
||||
{{ if and .Site.Params.ui.sidebar_lang_menu (gt (len .Site.Home.Translations) 0) -}}
|
||||
<div class="td-sidebar-nav__section nav-item dropdown d-block d-lg-none">
|
||||
{{ partial "navbar-lang-selector.html" . }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
{{/* Adapted from: https://github.com/twbs/bootstrap/blob/main/site/layouts/partials/icons.html */ -}}
|
||||
<div class="td-light-dark-menu dropdown">
|
||||
|
||||
{{- /* Adapted from: https://github.com/twbs/bootstrap/blob/main/site/layouts/partials/icons.html */ -}}
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="d-none">
|
||||
<symbol id="check2" viewBox="0 0 16 16">
|
||||
|
|
@ -15,26 +17,23 @@
|
|||
<path d="M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"/>
|
||||
</symbol>
|
||||
</svg>
|
||||
{{/* */ -}}
|
||||
|
||||
{{/* Adapted from: https://github.com/twbs/bootstrap/blob/main/site/layouts/partials/theme-toggler.html */ -}}
|
||||
|
||||
{{ $isExamples := eq .Layout "examples" -}}
|
||||
<button class="btn
|
||||
{{- if $isExamples }} btn-bd-primary
|
||||
{{- else }} btn-link nav-link
|
||||
{{- end }} dropdown-toggle d-flex align-items-center"
|
||||
<button class="btn btn-link nav-link dropdown-toggle d-flex align-items-center"
|
||||
id="bd-theme"
|
||||
type="button"
|
||||
aria-expanded="false"
|
||||
data-bs-toggle="dropdown"
|
||||
{{ if not $isExamples }}data-bs-display="static"{{ end }}
|
||||
aria-label="Toggle theme (auto)">
|
||||
<svg class="bi my-1 theme-icon-active"><use href="#circle-half"></use></svg>
|
||||
{{- /* Disable menu name for Docsy:
|
||||
<span class="{{ if $isExamples }}visually-hidden{{ else }}d-lg-none ms-2{{ end }}" id="bd-theme-text">Toggle theme</span>
|
||||
*/}}
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end{{ if $isExamples }} shadow{{ end }}" aria-labelledby="bd-theme-text">
|
||||
<ul class="dropdown-menu" aria-labelledby="bd-theme">
|
||||
<li>
|
||||
<button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="light" aria-pressed="false">
|
||||
<svg class="bi me-2 opacity-50"><use href="#sun-fill"></use></svg>
|
||||
|
|
@ -57,3 +56,5 @@
|
|||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{{/* */ -}}
|
||||
|
|
|
|||
|
|
@ -8,10 +8,12 @@ TestFilesConcurrently: true
|
|||
IgnoreDirs:
|
||||
- _print
|
||||
- ^blog/(\d+/)?page/\d+
|
||||
- ^xx # Placeholder language
|
||||
IgnoreEmptyHref: true # FIXME
|
||||
IgnoreInternalEmptyHash: true # FIXME
|
||||
IgnoreInternalURLs: # list of paths
|
||||
IgnoreURLs: # list of regexs of paths or URLs to be ignored
|
||||
- ^(https://www.docsy.dev/)?xx/ # Placeholder language
|
||||
- \?no-link-check
|
||||
- (index.xml|_print/)$ # ignore <link rel=alternate ...>
|
||||
- ^https?://[^/]+/(categories|tags)/ # ignore Docsy-generated content
|
||||
|
|
|
|||
|
|
@ -161,15 +161,21 @@ version selector drop down to the top-level menu.
|
|||
You can find out more in the guide to
|
||||
[versioning your docs](/docs/adding-content/versioning/).
|
||||
|
||||
### Adding a language drop-down
|
||||
### Adding a language dropdown
|
||||
|
||||
If you configure more than one language in `hugo.toml`, the Docsy theme adds a
|
||||
language selector drop down to the top-level menu. Selecting a language takes
|
||||
the user to the translated version of the current page, or the home page for the
|
||||
given language.
|
||||
If you configure more than one language in `hugo.toml`, Docsy adds a language
|
||||
selector drop down to the navbar menu. Selecting a language takes the user to
|
||||
the translated version of the current page, or the home page for the given
|
||||
language. The menu is visible for all screen sizes. By default current site
|
||||
language name is shown. On narrow displays, this is replaced by the language
|
||||
code.
|
||||
|
||||
You can find out more in [Multi-language support](/docs/language/).
|
||||
|
||||
You can control whether the language selector menu appears in the sidebar by
|
||||
setting the optional parameter `.ui.sidebar_lang_menu` to `true` (default:
|
||||
unset).
|
||||
|
||||
## Section menu
|
||||
|
||||
The section menu, as shown in the left side of the `docs` section, is
|
||||
|
|
|
|||
|
|
@ -31,6 +31,11 @@ languages:
|
|||
languageName: English
|
||||
params:
|
||||
description: Docsy does docs
|
||||
# Placeholder language used to demo multilingual support
|
||||
xx:
|
||||
languageName: Placeholder
|
||||
params:
|
||||
description: Docsy does multilingual docs
|
||||
|
||||
markup:
|
||||
tableOfContents:
|
||||
|
|
@ -77,6 +82,7 @@ params:
|
|||
ui:
|
||||
showLightDarkModeMenu: true
|
||||
sidebar_cache_limit: 10
|
||||
sidebar_lang_menu: true # Set to true to show the language menu in the sidebar
|
||||
sidebar_menu_compact: true
|
||||
sidebar_menu_foldable: false
|
||||
sidebar_search_disable: false
|
||||
|
|
@ -147,5 +153,9 @@ module:
|
|||
target: content/project/changelog.md
|
||||
- source: ../CONTRIBUTING.md
|
||||
target: content/project/contributing.md
|
||||
# Placeholder language used to demo multilingual support
|
||||
- source: content/en
|
||||
target: content
|
||||
lang: xx
|
||||
|
||||
# cSpell:ignore docsy github goldmark markmap plantuml readingtime userguide
|
||||
|
|
|
|||
|
|
@ -1131,6 +1131,14 @@
|
|||
"StatusCode": 206,
|
||||
"LastSeen": "2025-05-22T19:21:14.104646-04:00"
|
||||
},
|
||||
"https://github.com/google/docsy/pull/2301": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-08-02T17:12:43.757038-04:00"
|
||||
},
|
||||
"https://github.com/google/docsy/pull/2303": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-08-02T17:12:43.051065-04:00"
|
||||
},
|
||||
"https://github.com/google/docsy/pull/941": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-06-10T18:59:25.465236-04:00"
|
||||
|
|
@ -2227,6 +2235,10 @@
|
|||
"StatusCode": 200,
|
||||
"LastSeen": "2025-05-16T09:20:35.492337-04:00"
|
||||
},
|
||||
"https://www.docsy.dev/": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-08-02T16:19:13.783813-04:00"
|
||||
},
|
||||
"https://www.docsy.dev/about/": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-05-16T09:20:45.23027-04:00"
|
||||
|
|
@ -2331,6 +2343,10 @@
|
|||
"StatusCode": 206,
|
||||
"LastSeen": "2024-11-06T12:06:01.765051-05:00"
|
||||
},
|
||||
"https://www.docsy.dev/docs/adding-content/language/#adding-a-language-menu": {
|
||||
"StatusCode": 404,
|
||||
"LastSeen": "2025-08-02T17:12:43.30695-04:00"
|
||||
},
|
||||
"https://www.docsy.dev/docs/adding-content/lookandfeel/#before-page-content": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-05-22T13:24:36.066951-04:00"
|
||||
|
|
@ -2347,6 +2363,10 @@
|
|||
"StatusCode": 206,
|
||||
"LastSeen": "2024-11-06T12:08:17.225307-05:00"
|
||||
},
|
||||
"https://www.docsy.dev/docs/adding-content/navigation/#adding-a-language-drop-down": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-08-02T17:42:11.260079-04:00"
|
||||
},
|
||||
"https://www.docsy.dev/docs/adding-content/navigation/#breadcrumb-navigation": {
|
||||
"StatusCode": 206,
|
||||
"LastSeen": "2025-01-08T13:26:58.452656-05:00"
|
||||
|
|
|
|||
Loading…
Reference in New Issue