Home › Styling & Colors

Styling & Colors

Template-matched menu styling for Six, Twenty-One and Nexus — without touching a single template file.

Template picker

Select the client area template you run (Six, Twenty-One — default — or Nexus) in Settings. You choose explicitly because template folder names are often renamed, which makes auto-detection unreliable. Box heights, bar spacing and wrap guards all follow this choice.

Sticky navbar

Pins the main menu to the top of the screen on scroll, using each template's own pin classes (navbar-fixed-top on Six, fixed-top on Twenty-One/Nexus). The pinned bar keeps an opaque background — your Nav Background color when menu colors are on, otherwise the header's own background. Sticky never engages below 992px, so phones and small tablets are unaffected.

Menu colors

With Menu Color on, MiniColors pickers control every surface:

Nav Background / Nav Link — bar and link text (including the right-side Account menu).
Link Hover / Nav Link Hover — full-box hovers (top links behave like boxes, no underlines).
Dropdown Active Link / Dropdown Link Hover — submenu items.
Badge Background / Badge Text Color — the badge pills (defaults reproduce the stock grey pill).

Values are normalized to #rrggbb on save. Top-link boxes stay within each template's overflow limits: 28px on Twenty-One (its script collapses taller menus into “More”), 50px on Nexus (the module raises that template's threshold to match).

Phones & small screens

Below 992px none of the module's CSS applies — the hamburger menu and bar are 100% stock template.
The sticky pin is force-disabled by CSS even if the classes get added.

The “More” menu — Twenty-One and Nexus collect overflowing items into a stock “More” dropdown whenever the navbar wraps. If it appears with room to spare, some rule is making the bar too tall — check custom CSS first.