ASCII text
1
// Drawing mixins
2
// generic drawing of more complex things
4
// provide font size in rem, with px fallback
6
@mixin fontsize($size: 24, $base: 16) {
7
font-size: round($size) + pt;
8
//font-size: ($size / $base) * 1rem;
9
}
10
// shadows
12
@mixin shadow($level) {
13
@if $level==1 {
14
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
15
}
16
@if $level==2 {
17
box-shadow: 0 3px 6px rgba(0,0,0,0.16*1.5), 0 3px 6px rgba(0,0,0,0.23*1.5);
18
}
19
@if $level==3 {
20
box-shadow: 0 10px 20px rgba(0,0,0,0.19*1.5), 0 6px 6px rgba(0,0,0,0.23*1.5);
21
}
22
@if $level==4 {
23
box-shadow: 0 14px 28px rgba(0,0,0,0.25*1.5), 0 10px 10px rgba(0,0,0,0.22*1.5);
24
}
25
@if $level==5 {
26
box-shadow: 0 19px 38px rgba(0,0,0,0.30*1.5), 0 15px 12px rgba(0,0,0,0.22*1.5);
27
}
28
}
29
// entries
31
@mixin entry($t, $fc:$selected_bg_color) {
33
//
34
// Entries drawing function
35
//
36
// $t: entry type
37
// $fc: focus color
38
//
39
// possible $t values:
40
// normal, focus, insensitive
41
//
42
@if $t==normal {
43
background-color: rgba(0, 0, 0, 0.01);
44
border-color: transparent;
45
box-shadow: inset 0 -1px if($fc!=$selected_bg_color, $fc, $fill_color);
46
}
48
@if $t==focus {
49
border-color: transparent;
50
box-shadow: inset 0 -2px if($fc!=$selected_bg_color, $fc, $selected_bg_color);
51
}
52
@if $t==hover { }
53
@if $t==insensitive {
54
color: $insensitive_fg_color;
55
border-color: transparent;
56
box-shadow: inset 0 -1px if($fc!=$selected_bg_color, $fc, $insensitive_fill_color);
57
}
58
}
59
// buttons
61
@mixin button($t, $c:$bg_color, $tc:$fg_color) {
63
//
64
// Button drawing function
65
//
66
// $t: button type,
67
// $c: base button color for colored* types
68
// $tc: optional text color for colored* types
69
//
70
// possible $t values:
71
// normal, hover, active, insensitive, undecorated
72
//
73
@if $t==normal {
74
//
75
// normal button
76
//
77
color: if($tc!=$fg_color, $tc, $secondary_fg_color);
78
background-color: $c;
79
border-color: transparent;
80
@include shadow(1);
81
text-shadow: none;
82
icon-shadow: none;
83
}
84
@if $t==focus {
85
//
86
// focused button
87
//
88
color: $tc;
89
text-shadow: none;
90
icon-shadow: none;
91
box-shadow: 0 0 transparent;
92
// box-shadow: inset 0px 0px 0px 2px $fill_color;
93
}
94
@else if $t==hover {
96
//
97
// hovered button
98
//
99
color: if($tc!=$fg_color, $tc, $fg_color);
100
background-color: $c;
101
border-color: transparent;
102
@include shadow(2);
103
text-shadow: none;
104
icon-shadow: none;
105
}
107
@else if $t==active {
108
//
109
// pushed button
110
//
111
color: if($tc!=$fg_color, $tc, $fg_color);
112
background-color: mix($tc, $c, 20%);
113
border-color: transparent;
114
@include shadow(2);
115
text-shadow: none;
116
icon-shadow: none;
117
}
118
@else if $t==insensitive {
119
//
120
// insensitive button
121
//
122
color: if($tc!=$fg_color, $tc, $insensitive_secondary_fg_color);
123
background-color: if($c!=$bg_color, $c, $insensitive_fill_color);
124
border-color: transparent;
125
box-shadow: 0 0 transparent;
126
text-shadow: none;
127
icon-shadow: none;
128
}
129
@if $t==flat-normal {
130
//
131
// normal flat button
132
//
133
color: if($tc!=$fg_color, $tc, $secondary_fg_color);
134
background-color: transparent;
135
border-color: transparent;
136
box-shadow: 0 0 transparent;
137
text-shadow: none;
138
icon-shadow: none;
139
}
140
@if $t==flat-focus {
141
//
142
// focused flat button
143
//
144
color: $tc;
145
text-shadow: none;
146
icon-shadow: none;
147
box-shadow: 0 0 transparent;
148
// box-shadow: inset 0px 0px 0px 2px $fill_color;
149
}
150
@else if $t==flat-hover {
152
//
153
// hovered flat button
154
//
155
color: if($tc!=$fg_color, $tc, $fg_color);
156
background-color: if($c!=$bg_color, $c, $semi_fill_color);
157
border-color: transparent;
158
box-shadow: 0 0 transparent;
159
text-shadow: none;
160
icon-shadow: none;
161
}
163
@else if $t==flat-active {
164
//
165
// pushed flat button
166
//
167
color: if($tc!=$fg_color, $tc, $fg_color);
168
background-color: if($c!=$bg_color, $c, $fill_color);
169
border-color: transparent;
170
box-shadow: 0 0 transparent;
171
text-shadow: none;
172
icon-shadow: none;
173
}
174
@else if $t==flat-insensitive {
175
//
176
// insensitive flat button
177
//
178
color: if($tc!=$fg_color, $tc, $insensitive_secondary_fg_color);
179
background-color: transparent;
180
border-color: transparent;
181
box-shadow: 0 0 transparent;
182
text-shadow: none;
183
icon-shadow: none;
184
}
185
@else if $t==undecorated {
186
//
187
// reset
188
//
189
color: inherit;
190
background-color: transparent;
191
border-color: transparent;
192
box-shadow: 0 0 transparent;
193
text-shadow: none;
194
icon-shadow: none;
195
}
196
}
197