Global Header

Global Header

The global header is the anchor for the Salesforce platform and spans all other parts of the UI. The functionality in the header is applicable across all contexts in the Salesforce ecosystem (internal or 3rd party).

Base

Preview

No content has been added for this component.

No content has been added for this component.

About Base

Container that fixes the global header to the top of the viewport, contains global header element


Overview of CSS Classes

Selector.slds-global-header_container
Summary

Container that fixes the global header to the top of the viewport, contains global header element

Restrictheader
VariantTrue
Selector.slds-global-header
Summary
Restrict.slds-global-header_container div
Selector.slds-global-header__item
Summary

A region within the global header

Restrict.slds-global-header div, .slds-global-header ul
Selector.slds-global-header__logo
Summary

Container of the global header logo

Restrict.slds-global-header__item div
Selector.slds-global-header__button_icon
Summary

Button icons on the global header

Restrict.slds-global-header__item button
Selector.slds-global-header__button_icon-actions
Summary

Button icon specifically for global actions

Restrict.slds-global-header__item button
Selector.slds-global-header__button_icon-favorites
Summary

Button icon specifically for global actions

Restrict.slds-global-header__item button
Selector.slds-is-selected
Summary

Selected state for favorites button

Restrict.slds-global-header__button_icon-favorites
ModifierTrue
Selector.slds-is-disabled
Summary

Disabled state for favorites button

Restrict.slds-global-header__button_icon-favorites
ModifierTrue
Selector.global-header__icon
Summary

Deal with sizing for global header icons

Restrict.slds-global-header__item svg
Selector.slds-global-header__item_search
Summary

Region that contains the search input, handles sizing

Restrict.slds-global-header__item:nth-child(2)
Selector.slds-global-header__notification
Summary

Handles styling for notification item interactions

Restrict.slds-global-header_container li
VariantTrue