Merge pull request #642 from h-enk/navbar-dropdown

Adds support for sub navigation main menu
This commit is contained in:
Henk Verlinde 2022-02-01 11:08:49 +01:00 committed by GitHub
commit 5981ab0d20
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 83 additions and 3 deletions

View File

@ -527,3 +527,19 @@ $navbar-dark-active-color: $link-color-dark;
border-color: $border-dark; border-color: $border-dark;
} }
} }
[data-dark-mode] .dropdown-menu.dropdown-menu-main {
background: $body-overlay-dark;
}
[data-dark-mode] .dropdown-menu-main .dropdown-item {
color: $body-color-dark;
}
[data-dark-mode] .dropdown-menu-main .dropdown-item:hover {
color: $link-color-dark;
}
[data-dark-mode] .dropdown-menu-main .dropdown-item.active {
color: $link-color-dark;
}

View File

@ -218,3 +218,30 @@ pre {
margin-left: -0.1875rem; margin-left: -0.1875rem;
margin-right: -0.3125rem; margin-right: -0.3125rem;
} }
.dropdown-menu.dropdown-menu-main {
width: 100%;
}
.dropdown-menu-main .dropdown-item {
color: inherit;
font-size: $font-size-base;
font-weight: 400;
text-decoration: none;
}
.dropdown-menu-main .dropdown-item:hover {
background-color: transparent;
color: $primary;
}
.dropdown-menu-main .dropdown-item.active {
color: $primary;
font-weight: 400;
text-decoration: none;
background-color: inherit;
}
.dropdown-menu-main .dropdown-item.active:hover {
background-color: transparent;
}

View File

@ -44,6 +44,26 @@
url = "/blog/" url = "/blog/"
weight = 20 weight = 20
[[main]]
name = "Get Started"
weight = 30
identifier = "get-started"
url = "/docs/prologue/introduction/"
[[main]]
name = "Quick Start"
weight = 40
identifier = "quick-start"
url = "/docs/prologue/quick-start/"
parent = "get-started"
[[main]]
name = "Tutorial"
weight = 50
identifier = "tutorial"
url = "https://getdoks.org/tutorial/introduction/"
parent = "get-started"
[[social]] [[social]]
name = "GitHub" name = "GitHub"
pre = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-github\"><path d=\"M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22\"></path></svg>" pre = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-github\"><path d=\"M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22\"></path></svg>"

View File

@ -34,9 +34,26 @@
{{- $active = or $active (eq .Name $current.Title) -}} {{- $active = or $active (eq .Name $current.Title) -}}
{{- $active = or $active (and (eq .Name ($section | humanize)) (eq $current.Section $section)) -}} {{- $active = or $active (and (eq .Name ($section | humanize)) (eq $current.Section $section)) -}}
{{- $active = or $active (and (eq .Name "Blog") (eq $current.Section "blog" "contributors")) -}} {{- $active = or $active (and (eq .Name "Blog") (eq $current.Section "blog" "contributors")) -}}
<li class="nav-item"> {{ if .HasChildren }}
<a class="nav-link ps-0 py-1{{ if $active }} active{{ end }}" href="{{ .URL | relLangURL }}">{{ .Name }}</a> <li class="nav-item dropdown">
</li> <a class="nav-link dropdown-toggle ps-0 py-1" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false">
{{ .Name }}
<span class="dropdown-caret"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg></span>
</a>
<ul class="dropdown-menu dropdown-menu-main shadow rounded border-0" aria-labelledby="navbarDropdownMenuLink">
{{ range .Children -}}
{{- $active = eq .Name $current.Title -}}
<li>
<a class="dropdown-item{{ if $active }} active{{ end }}" href="{{ .URL | relLangURL }}"{{ if $active }} aria-current="true"{{ end }}>{{ .Name }}</a>
</li>
{{ end -}}
</ul>
</li>
{{ else }}
<li class="nav-item">
<a class="nav-link ps-0 py-1{{ if $active }} active{{ end }}" href="{{ .URL | relLangURL }}">{{ .Name }}</a>
</li>
{{ end }}
{{ end -}} {{ end -}}
</ul> </ul>
<hr class="text-black-50 my-4 d-md-none"> <hr class="text-black-50 my-4 d-md-none">