summaryrefslogtreecommitdiff
path: root/lib/flat/dijit/layout/dijit_layout_variables.styl
blob: fdda4b59ee961c1069256e7df790f732848ebdb9 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
/* dijit/layout/* variables */

@import '../../variables';

/* BorderContainer*/

$bordercontainer-padding = $padding;
$bordercontainer-border-color = $border-color;

// splitter
$splitter-size = isEven($bordercontainer-padding) ? $bordercontainer-padding + 1 : $bordercontainer-padding; // the width of the splitter, will always be an odd number since the splitter bar's width is always 1px 
$splitter-color = $border-color; // color of the splitter thumb (the 1px wide bar)
$splitter-hovered-color = darken($splitter-color, 25%);
$splitter-dragged-color = $splitter-hovered-color;
$splitter-background-color = none;
$splitter-hovered-background-color = darken(#fff, 5%);
$splitter-dragged-background-color = darken(#fff, 5%);
 
/* ContentPane */

$contentpane-padding = $padding * 2;
$contentpane-background-color = $theme-base-color;

// contentpane in other layout widgets (accordion and tab container)
$contentpane-nested-padding = $padding * 2;
$contentpane-nested-background-color = $theme-base-color;

/* TabContainer */

$tab-highlight-color = $theme-base;
$tab-padding = $padding;
$tab-checked-has-highlight-border = true; // whether to have a highlight bar on the edge of the tab

// TabContainer: wrapper
// (the outer container)
$tab-wrapper-background-color = $theme-base-color;
$tab-wrapper-border-color = $border-color;
$tab-wrapper-border-radius = $border-radius;

// tabs
$tab-background-color = $tab-wrapper-background-color;
$tab-border-color = transparent;
$tab-spacing = 0; // space between tabs

// hover
$tab-hover-background-color = darken($theme-base-color, 5%);

// active
$tab-active-background-color = darken($theme-base-color, 10%);

// checked
$tab-checked-border-color = $tab-wrapper-border-color;
$tab-checked-background-color = $tab-wrapper-background-color;
$tab-checked-text-color = $grey-dark;

// icons
$tab-left-icon = "\f004";
$tab-right-icon = "\f005";
$tab-menu-icon = "\f006";

// close button
$tab-close-button-icon = "\f00e";
$tab-close-button-opacity = .35;

// hover
$tab-close-button-hover-opacity = .75;

// active
$tab-close-button-active-opacity = 1;

// tab dtrip button
$tab-strip-button-background-color = $tab-background-color;
$tab-strip-button-border-color = $tab-border-color;

// hover
$tab-strip-button-hover-background-color = $tab-hover-background-color;

// active
$tab-strip-button-active-background-color = $tab-active-background-color;

// arrow
$tab-strip-button-arrow-color = $theme-base;

// tabs: top
$tab-top-padding = $tab-padding * 1.5 $tab-padding * 4;

// tabs: bottom
$tab-bottom-padding = $tab-top-padding;

// tabs: left
$tab-left-padding = $tab-padding * 2 $tab-padding * 3;

// tabs: right
$tab-right-padding = $tab-left-padding;

// nested tab container
$nestedtab-spacing = $padding;
$nestedtab-padding = $tab-padding $tab-padding * 2;
$nestedtab-border-color = transparent;
$nestedtab-border-radius = $border-radius;

// normal
$nestedtab-text-color = $theme-base;

// hover
$nestedtab-hover-background-color = $tab-hover-background-color;

// active
$nestedtab-active-text-color = $theme-base;
$nestedtab-active-background-color = $tab-active-background-color;

// checked
$nestedtab-checked-background-color = $theme-base;
$nestedtab-checked-text-color = $theme-base-color;

/* AccordionContainer */

$accordion-spacing = 0; // space between accordion panes; minimum value is 0
$accordion-border-color = $border-color;
$accordion-border-radius = $border-radius;
$accordion-background-color = $theme-base-color;

// accordion title bar 
// normal, hover and active status styles are inherited from "form/Button"

// checked
$accordion-title-bar-checked-background-color = $theme-base;
$accordion-title-bar-checked-text-color = $theme-base-color;

// content pane
$accordion-content-border-color = $accordion-border-color;
$accordion-content-background-color = $theme-base-color;

// icons
// uses common vars directly