cncf / dot-org-hugo-theme

Hugo theme ideal for Organizations to use. Built initially for the TODO site redesign.
https://dot-org-hugo-theme-demo.netlify.app/
MIT License
43 stars 14 forks source link

Menu rotating arrows not displayed #41

Closed doolio closed 5 months ago

doolio commented 8 months ago

The demo site has the following:

image

However, on a site I'm building I don't see these elements.

image

The only SCSS I override is the styles.scss file to introduce a _news.scss file which is based on the _blog.scss theme file.

I do have a home.scss file based on that from the Deep Casuality site but I don't think that is the issue because these arrows are visible on that site.

I presume these rotating arrows are driven by the _header.scss file but I have not overridden this file. Thanks for your time.

thetwopct commented 8 months ago

Hard to give feedback without seeing the code tbh.

The arrows are attached to the class ".menu-item-has-children" - which is applied if the top menu item has children

https://github.com/cncf/dot-org-hugo-theme/blob/47e7ade287b2541ee3b6702604297c8c98677472/layouts/partials/header.html#L22

https://github.com/cncf/dot-org-hugo-theme/blob/47e7ade287b2541ee3b6702604297c8c98677472/assets/scss/_header.scss#L249

doolio commented 8 months ago

Thank you. I think my problem is I have my menus defined in a menus.yaml file (under a main: key) in the config/_default/ directory rather than under a menu: key in config/_default/languages.yaml.

thetwopct commented 8 months ago

I see. The "menu:" in languages.yaml and the "menus" config file may be conflicting. Remove the menu: and its children from the language file. The existing code at L18 should still work if your file is in the _default config folder and called menus.yaml.

https://github.com/cncf/dot-org-hugo-theme/blob/47e7ade287b2541ee3b6702604297c8c98677472/layouts/partials/header.html#L18

Oh and menus.yaml will need to be properly structured and indented, Hugo can be a bit tricky with that

doolio commented 8 months ago

Sorry I should have been more clear. I removed the menu: key and its children from the languages.yaml file and put its children starting from the main: key into a menus.yaml file (i.e. this file does not contain a menu: key). This I believe is in line with splitting one's config into separate files.

My site is not multi-lingual so I suppose I could remove the languages.yaml file entirely. I did remove the en: key from this file thinking that may resolve it as the Hugo docs describe menu files such as menus.en.yaml, menus.es.yaml etc. when a site is multilingual.

thetwopct commented 5 months ago

Marking this one as won't fix - our theme is opinionated and I can't see a way to make custom configs work without more people having this issue, although PRs are welcome if they cover both scenarios successfully.