[BUG] When use icon on navbar there are no text

[alohl669]

Describe the bug

Related to #1640
Looks like is not possible to show an icon near the text on navbar area.

To reproduce

Steps to reproduce the behavior:

1. Create a menus.toml on config/_default/menus/menus.toml (not multilingual website)
2. Use this example

[[main]]
  name = "Blog"
  weight = 10
  url = "/blog/"
  pre = "fas newspaper"

[[main]]
  name = "Podcast"
  weight = 20
  url = "/podcast/"
  pre = "fas microphone"

[[main]]
  name = "food"
  weight = 30
  url = "/food/"
  pre = "fas plate-wheat"

[[main]]
  name = "about"
  weight = 40
  url = "/about/"
  pre = "fas info-circle"

3. run hugo server

Expected behavior

I did'n know if it was possible to put text + icon on the navbar on desktop display, I thougt that I was doing something wrong. So I asked on the discussion section because looks that is a real feature but only works using a cellphone view.

See the screenshots for more details.

Log file

Not visible errors

Watching for changes in /home/alohl669/code/RESEARCH/hugo/website/{archetypes,assets,content,data,i18n,layouts,static}
Watching for config changes in /home/alohl669/code/RESEARCH/hugo/website/hugo.toml, /home/alohl669/code/RESEARCH/hugo/website/config/_default, /home/alohl669/code/RESEARCH/hugo/website/config/_default/menus, /home/alohl669/code/RESEARCH/hugo/website/go.mod
Start building sites … 
hugo v0.152.2-6abdacad3f3fe944ea42177844469139e81feda6+extended linux/amd64 BuildDate=2025-10-24T15:31:49Z VendorInfo=snap:0.152.2


                  │ EN  
──────────────────┼─────
 Pages            │  78 
 Paginator pages  │   2 
 Non-page files   │   2 
 Static files     │ 109 
 Processed images │  60 
 Aliases          │   6 
 Cleaned          │   0 

Built in 2129 ms
Environment: "development"
Serving pages from disk
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) 
Press Ctrl+C to stop

Screenshots

Cellphone view

desktop view

Host environment

Please complete the following information where applicable.

• Hinode version: hinode@v1.22.0
• Host OS: Ubuntu 24.04
• Hugo version: v3@v3.16.5 (snap version)
• golang version: go1.25.4
• Browser:
  • vivaldi
  • firefox
  • chrome

Hugo environment

Copy the output of hugo env or npm run env here.

hugo v0.152.2-6abdacad3f3fe944ea42177844469139e81feda6+extended linux/amd64 BuildDate=2025-10-24T15:31:49Z VendorInfo=snap:0.152.2
GOOS="linux"
GOARCH="amd64"
GOVERSION="go1.25.3"
github.com/sass/libsass="3.6.6"
github.com/webmproject/libwebp="v1.3.2"
github.com/sass/dart-sass/protocol="3.2.0"
github.com/sass/dart-sass/compiler="1.93.2"
github.com/sass/dart-sass/implementation="1.93.2"

Additional context

I just thought that I was doing something wrong or I miss something seeing the docs. Thanks to @markdumay to ask me to report it

[github-actions]

🎉 This issue has been resolved in version 2.0.0-beta.9 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[markdumay]

@alohl669, I've isolated the issue and committed a fix. It will be included in the upcoming v2 release of Hinode. If you'd like to apply the fix sooner, you can simply copy the file referenced in this commit to your own repo.

[alohl669]

Thank you for your effort!!.

But I thougt that the regular behavior was icon + text on the same line. Isn't it?

Desktop mode(weird):

cellphone/mobile mode(right):

Or need I to change something in my config?

[[main]]
  name = "Blog"
  weight = 10
  url = "/blog/"
  pre = "fas newspaper"

[[main]]
  name = "Podcast"
  weight = 20
  url = "/podcast/"
  pre = "fas microphone"

[[main]]
  name = "food"
  weight = 30
  url = "/food/"
  pre = "fas plate-wheat"

[[main]]
  name = "about"
  weight = 40
  url = "/about/"
  pre = "fas info-circle"

To add info, I need to say thay I had to create _partials/assets/helpers directories inside layouts folder to download the fixed file.

I don't know if its should exits before. I have created another project folder using the installation docs again to test

hugo new site new-project
cd new-project/
hugo mod init new-project.com/blog
echo "[[module.imports]]" >> hugo.toml
echo "path = 'github.com/gethinode/hinode'" >> hugo.toml
hugo server

And layouts folder still empty.

[markdumay]

You're right, this is unintentional behavior. I've released a fix in this commit. I'll do some more testing in the coming days, but hopefully this resolves the issues you encountered.

PS: you can ignore the changes to hugo_stats.json, they are stats that Hugo generates on each build.

[github-actions]

🎉 This issue has been resolved in version 2.0.0-beta.10 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[markdumay]

You may also want to include this commit. It fixes the spacing behavior whn applied to a menu entry, e.g.:

[[main]]
name = "spacing"
weight = 60
[[main.params]]
spacing = true

[alohl669]

You may also want to include this commit. It fixes the spacing behavior whn applied to a menu entry, e.g.:

[[main]]
name = "spacing"
weight = 60
[[main.params]]
spacing = true

Yeah, looks perfect right now.
Sorry, I have delayed exactly 1 month from your last answer. I didn't see the github notification until today.

So, if this bug is resolved, I suppose that you will update your main branch. I'm looking forward to see that to update my hugo.mod

Thankyou so much

[markdumay]

Great to hear it's working as expected now. Hinode v2 is quite a comprehensive update including refactoring of the page layouts. It's still work in progress, although I've adopted it successfully to a few public and private sites by now. You're welcome to try it out. But indeed, this bug fix will be released in v2.