6 /// @Foundation.settings
\r
8 $tabstrip-background: transparent !default;
\r
10 $tab-title-background: $gray-light !default;
\r
11 $tab-title-background-hover: smartscale($tab-title-background, 5%) !default;
\r
12 $tab-title-background-active: smartscale($tab-title-background, 3%) !default;
\r
13 $tab-title-color: isitlight($tab-title-background) !default;
\r
14 $tab-title-color-active: $tab-title-color !default;
\r
16 $tab-title-padding: $global-padding !default;
\r
17 $tab-content-padding: $global-padding !default;
\r
21 $orientation: horizontal,
\r
22 $background: $tabstrip-background
\r
28 background: $background;
\r
30 @if $orientation == vertical {
\r
31 flex-flow: column nowrap;
\r
34 flex-flow: row wrap;
\r
38 @mixin tabstrip-item(
\r
39 $background: $tab-title-background,
\r
40 $background-hover: $tab-title-background-hover,
\r
41 $background-active: $tab-title-background-active,
\r
42 $color: $tab-title-color,
\r
43 $color-active: $tab-title-color-active,
\r
44 $padding: $tab-title-padding
\r
46 background: $background;
\r
55 background: $background-active;
\r
56 color: $color-active;
\r
59 background: $background-hover;
\r
63 background: $background-hover;
\r
68 $padding: $tab-content-padding
\r
73 @mixin tab-content-item {
\r
80 @include exports(tabs) {
\r
82 @include tabstrip(horizontal);
\r
85 @include tabstrip(vertical);
\r
89 @include tabstrip-item;
\r
94 @include tab-content;
\r
97 @include tab-content-item;
\r