v4: Navbars
Closed this issue · 12 comments
Meta tracking issue for todos on our navbars across the board. Some of this overlaps with our examples mind you.
- #18049: Navbar text?
- #18053: Containers add extra padding?
- #17532: Dropdowns in navbar navs?
- #17250: No responsive nav love right now
- #18115: Light vs dark nomenclature needs ironing out
New from me as of 5/10:
- #19280: Docs navbar has some funky behavior
- #17990, #18868: The blown out responsive navbar transitions on expand, but toggles awkwardly on collapse
- #17539 , #18863, #18865: Navbar togglers don't respect color scheme
#18495: Navbar and page zoom?- #18599: Inconsistent use of
.active
across navs - #18751: Input groups are too wide in navbars
- #18855: Customizing navbar-brand
- #18875: Flexbox variation is funky
Pulled from @cvrebert's comment:
Btw, was going to try to tackle this stuff in the second alpha, but I just haven't had time to devote to tearing this all apart and putting it thru its paces.
possibly look into adding a variation of the navbar where the padding is on the items and not global to the navbar class. similar to the way materialize handles it http://materializecss.com/navbar.html#icons
its more often that I refactor the navbar to work in this manner especially when working with applications where the icons are usually the links.
easy wy would be to add variables for all the paddings, margins & heights as not all of them currently have them.
Perhaps also some love for a navbar-right
-replacement?
I don`t know if you already have something. I can help.
I am toying with a layout for the navbar. In v3 you had a .navbar-header for placement for the brand and button. I am trying to get around that couse i would like to create a flex menu for placement using flexbox, but don`t know how yet. Maybe toy around with floats vs table-cell.
But some simple things i have planned ;
- responsive sized dropdown (v4 .navbar-toggleable-)
- brand without padding so images fit full height
- testing flex
- dropdowns
Will create a pull request later
@mdo, Hi Mark, while you're doing this, it might be a good idea to create a navbar-static-bottom class to allow the navbar to sit nicely at the bottom of the page (but not fixed at the bottom of the window), with margin-bottom: 0; (to override the default bottom margin) and border-radius: 0; (to override the current 4px border-radius).
@cvrebert Sorry I missed that, and thanks for pointing me to this issue. On a side note, I was only trying to be helpful (I realise I wasn't and sorry for wasting your time), and something like: "Thanks for this. We've actually already discussed this, see #11527" would have been much nicer and would have encouraged me to contribute in future.
Also, .navbar-static-top isn't working ATM. You can see this in the official Bootstrap page here
Has this been updated recently and provide the current state of the navbar progress?
^Sad news... Oh well, will stick to bootstrap 3 for now. Keep up the good work though! It will be awesome.