Foundation - Top Bar SASS Reference
Variables
You can change the styles of the components by using following SASS variables as listed in the table.
| Sr.No. | Name & Description | Type | Default Value |
|---|---|---|---|
| 1 |
$topbar-padding Sets padding for top bar. |
Number | 0.5em |
| 2 |
$topbar-background Background color is set for top bar. |
Color | $light-gray |
| 3 |
$topbar-link-color Sets color for link that is present inside the top bar menu. |
Color | $primary-color |
| 4 |
$topbar-input-width Set width in the top bar for <input> element. |
Number | 200px |
Mixins
You can use the mixins to build the CSS class structure for your components as listed in the table.
top-bar-container
Includes styles in the top bar container.
@include top-bar-container;
top-bar-stacked
Makes the top bar menu stacked.
@include top-bar-stacked;
foundation_navigation.htm
Advertisements