Header - Hamburger
Large dropdown mega menu with informational text, static link list, collapsible navigation, and socials.
Check out the following video for a guide through Rubric’s header global partial:
[
**
View a live demo of this partial here.**](https://themes.lyntonweb.com/rubric/style-guide#header-hamburger)
The following is a detailed listing of the styling edits made to the partial’s sections, the modules used in the sections, and field changes from the modules’ default state.
Warning: This partial is split into two parts for Desktop and Mobile. Only editing the Desktop version will not update the Mobile version and vice-versa. Both versions need to be edited and customized to be updated on all devices.
Desktop
Section 1
This section is contained in a dnd_area above the main navigation.
Section Styles
No styles have been applied.
Modules
Utility Items
Utility Type: Skip Link
Skip Link > Anchor: #body
Section 2
This section is contained within a dnd_area for the main navigation which will be affected by transparency and sticky options available in the Page Settings module and the Theme Settings.
Section Styles
Class
main-navigation
Modules
**
Section Settings**
Section Options
Custom Columns
Custom Columns
{
Number: 3
Margin > Desktop > Left: 20
Width > Desktop > 160px
}
**
Logos**
Content Type
Company Logo
Utility Items
Utility Type: Site Search
Styles > Dark Mode
true
Styles > Module > Alignment
Desktop: Right
Styles > Search > Search Type
Toggle
Navigation Type
Hamburger
Position
Dropdown
Hamburger Max Width
0
Mega Menu
{
Column Width: 4
Row 1 >
Content Type: Image
Row 2 >
Content Type: Text
Row 3 >
Content Type: Buttons
},{
Column Width: 4
Alignment > Desktop: Right
Alignment > Tablet: Left
Row 1 >
Content Type: Static Menu
Menu Type: Simple
Row 2 >
Content Type: Buttons
Spacing > Padding Top: 45
Spacing > Padding Right: 50
},{
Column Width: 4
Row 1 >
Content Type: Collapsible Menu
Menu Type: Simple
Border Left: theme.global.borders
Spacing > Padding Left: 50
Row 2 >
Content Type: Socials
Spacing > Padding Top: 105
Spacing > padding Left: 50
Styles > Module > Alignment
Desktop: Right
Styles > Dropdown > Dark Mode
True
Styles > Dropdown > Alignment
Center
Styles > Dropdown > Spacing > Padding
Top: 100
Right: 40
Bottom: 40
Left: 40
Mobile
Section 1
This section is contained in a dnd_area above the main navigation.
Section Styles
No styles have been applied.
Modules
Utility Items
Utility Type: Skip Link
Skip Link > Anchor: #body
Section 2
This section is contained within a dnd_area for the main navigation which will be affected by transparency and sticky options available in the Page Settings module and the Theme Settings.
Modules
Content Type
Company Logo
Navigation Type
Hamburger
Position
Right
Mega Menu
{
Column Width: 12
Row 1 >
Content Type: Collapsible Menu
Row 2 >
Content Type: Site Search
Row 3 >
Content Type: Socials
Spacing > Padding Top: 130
}
Styles > Module > Alignment
Desktop: Right
Styles > Dropdown > Dark Mode
true