Unverified Commit 5981ab0d authored by Henk Verlinde's avatar Henk Verlinde Committed by GitHub
Browse files

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

Adds support for sub navigation main menu
parents 0fad0abb ef830bf2

assets/scss/common/_dark.scss

+16 −0
Original line number Diff line number Diff line
@@ -527,3 +527,19 @@ $navbar-dark-active-color: $link-color-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;

}

assets/scss/components/_buttons.scss

+27 −0
Original line number Diff line number Diff line
@@ -218,3 +218,30 @@ pre { 
  margin-left: -0.1875rem;

  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;

}

config/_default/menus/menus.en.toml

+20 −0
Original line number Diff line number Diff line
@@ -44,6 +44,26 @@ 
  url = "/blog/"

  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]]

  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>"

layouts/partials/header/header.html

+20 −3
Original line number Diff line number Diff line
@@ -34,9 +34,26 @@ 
            {{- $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 "Blog") (eq $current.Section "blog" "contributors")) -}}

            {{ if .HasChildren }}

              <li class="nav-item dropdown">

                <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 -}}

        </ul>

        <hr class="text-black-50 my-4 d-md-none">