Can I add a navigation bar to my Quarto website with theme set to none?

[WillemSleegers]

Description

Is it possible to set theme to none and still get a navigation bar, whose styling I can then set myself using CSS?

[mcanouil]

See https://quarto.org/docs/output-formats/html-themes.html.

[mcanouil]

Sure but apparently the div/nav is removed. They could just leave that in but remove the class.

And how would you style the navbar then? Providing a CSS file won't work.

Yeah I'm not finding your responses particularly helpful; you could have just said no right at the start and mention that it's because it relies on Bootstrap, instead of mainly providing links.

You wanted to have the navbar and use custom (S)CSS.
That's what the "custom themes" section is about: https://quarto.org/docs/output-formats/html-themes.html#custom-themes

[WillemSleegers]

And how would you style the navbar then? Providing a CSS file won't work.

They could make it a nav element so it can be targeted with CSS; or they can leave in the class name but don't load Bootstrap. The current behavior of removing it entirely is weird and seems like an accidental effect of how things are structured rather than an intentional choice.

You wanted to have the navbar and use custom (S)CSS.

I wanted to have the navbar with theme set to none.

[mcanouil]

I wanted to have the navbar with theme set to none.

To be clear, the theme is not set to the navbar, it's for the entire document/project.

They could make it a nav element so it can be targeted with CSS; or they can leave in the class name but don't load Bootstrap. The current behavior of removing it entirely is weird and seems like an accidental effect of how things are structured rather than an intentional choice.

I strongly believe that's a design choice which to me makes sense (I am not a Quarto developer).
CC @dragonstyle

they can leave in the class name but don't load Bootstrap.

Class names are tied up to the CSS framework, it would makes no sense to keep the names and not use the framework.
Setting "neutral" names is not a viable option, because it basically means to create a new CSS framework.

[dragonstyle]

That definitely seems like a reasonable goal, but theme: none isn't really all that close to this right now. The entire website envelope is connected to theme, which includes note merely the navbar, but all the other HTML scaffolding. As @mcanouil noted, the structure of the HTML itself and the attributes like classes are all oriented to support bootstrap.

I think the right long term direction is actually to emit an intermediary form of HTML which semantically represents the simple structure of the site (e.g. navbars, sidebars, footers, etc) and then have a followup pass which applies bootstrap (or other HTML frameworks) to the semantic HTML but restructuring the DOM and injecting attributes. (This is basically how Dashboards work now - we actually have a semantic representation which we then decorate to take advantage of bslib rendering). This would mean we could have a mode that simply didn't apply bootstrap and left the semantic HTML as is, for users to style as they see fit.

This is a great feature, but is likely going to be pretty complicated given how much code we have written around website themes. I would love this and think this is the correct long term direction for Quarto, but it's a big bite and not something that is likely to happen in the near term.

[WillemSleegers]

That's what I was afraid of, but glad to hear there's the motivation to potentially address it in the future!

[cscheid]

Let me temper everyone's expectations: we have no plan to address this in the next 12-24 months at the least. @dragonstyle might be understating the extent to which it would be a massive restructuring of how theming works in Quarto websites.

[dragonstyle]

I put italics on big! 🥇