How to make the navbar a fixed width and always onebar?

[ooiiredq]

Perfect css template, but help me with these:

How to make the navbar a fixed width for any screen sizes How to remove the ability to roll the navbar down when the window is minimized (I need a one line layout for all screen sizes)

Didn't get what to change in media queries

[Bali10050]

You first need to remove these lines:

@media screen and (min-width:850px) and (max-width:1324px)    /*  Both the tabs space and the navbar will grow  */
{#nav-bar{margin-top: calc(var(--TabsHeight) * -1px - var(--TabsBorder) * 1px) !important; height: calc(var(--TabsHeight) * 1px + var(--TabsBorder) * 1px)} #TabsToolbar{margin-left: calc(var(--NavbarWidth) * 1vw) !important} #nav-bar{margin-right: calc(100vw - calc(var(--NavbarWidth) * 1vw)) !important; vertical-align: center !important} #urlbar-container{min-width: 0px !important;  flex: auto !important} toolbarspring{display: none !important} #TabsToolbar, #nav-bar{transition: margin-top .25s !important}}

@media screen and (max-width:849px)    /*  The window is not enough wide for a one line layout  */
{#nav-bar{padding: 0 5px 0 5px!important; height: calc(var(--NavbarHeightSmall) * 1px) !important} toolbarspring{display: none !important;} #TabsToolbar, #nav-bar{transition: margin-top .25s !important}}
#nav-bar, #PersonalToolbar{background-color: #0000 !important;background-image: none !important; box-shadow: none !important} #nav-bar{margin-left: 3px; border-top: none !important} .tab-background, .tab-stack { min-height: calc(var(--TabsHeight) * 1px) !important}

then, you need to edit this:

@media screen and (min-width:1325px)    /*  Only the tabs space will grow from here  */
{#nav-bar{margin-top: calc(var(--TabsHeight) * -1px - var(--TabsBorder) * 1px)!important; height: calc(var(--TabsHeight) * 1px + var(--TabsBorder) * 1px)} #TabsToolbar{margin-left: calc(1325px / 100 * var(--NavbarWidth)) !important} #nav-bar{margin-right: calc(100vw - calc(1325px / 100 * var(--NavbarWidth))) !important; vertical-align: center !important} #urlbar-container{min-width: 0px !important;  flex: auto !important} toolbarspring{display: none !important}}

into this:

#nav-bar{margin-top: calc(var(--TabsHeight) * -1px - var(--TabsBorder) * 1px)!important; height: calc(var(--TabsHeight) * 1px + var(--TabsBorder) * 1px)} #TabsToolbar{margin-left: calc(1325px / 100 * var(--NavbarWidth)) !important} #nav-bar{margin-right: calc(100vw - calc(1325px / 100 * var(--NavbarWidth))) !important; vertical-align: center !important} #urlbar-container{min-width: 0px !important;  flex: auto !important} toolbarspring{display: none !important}

Also, I don't recommend doing this, because the only thing it will achieve is that some buttons will start overlapping, some will get cut off by the side of the window, and using it will become a very bad experience in smaller window sizes. The only way to combat this would be to set bigger minimum size, but I don't think that's a solution, that's the reason I have written my own code for everything and didn't just fork cascade or some other oneliner theme at the time

[ooiiredq]

works perfect but urlbar with elements on the left now changed color, is there is a way to change it back to the color of tabs?

issue is not critical, this way looks interesting too