search

jpescador / hugo-future-imperfect

A ported theme with some extras for the Hugo static website engine
MIT License
308 stars 227 forks source link

added dropdown menu functionality for multilevel navigation #60

Open CFaught opened 7 years ago

pacollins commented 7 years ago

Make sure to style it in the mobile pop-out menu as well. Check your site on mobile.

CFaught commented 7 years ago

I was going to leave the list indented and remove the bullets, is that good or do you think the theme should have an accordion like feature for the side menu?

pacollins commented 7 years ago

@CFaught - Any progress on this? If not, I will make the changes.

CFaught commented 7 years ago

The repo should have everything except the collapsing side-menu items and shadowing. Sorry, I've been busy and haven't finished this, but I can probably do this tomorrow.

pacollins commented 7 years ago

@CFaught - No rush. Was just checking in on it!

daspiras commented 6 years ago

Thank you for this. However, this technique prevents you from easily using a fontawesome icon in a parent menu, so I also think moving the fontawesome code to another variable (I used pre) is better since the identifier variable is technically supposed to be a unique ID for each menu item. This allows use of fontawesome icons at any level, including duplicates.

I also agree with @pacollins that the parent should link to a valid URL, which is what I did:

<li>
      {{ if .HasChildren }}
        <a class="dropdown" href="{{ .URL }}"><i class="{{ .Pre }}">&nbsp;</i>{{ .Name }}</a>
                        <ul class="dropdown-content">
                                 {{ range .Children }}
                                         <li><a href="{{ .URL }}"><i class="{{ .Pre }}">&nbsp;</i>{{ .Name }}</a></li>
                                 {{ end }}
                         </ul>
       {{ else }}
            <a href="{{ .URL }}"><i class="{{ .Pre}}">&nbsp;</i>{{ .Name }}</a>
       {{ end  }}
</li>