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,
46
$fill_color,
47
$osd_semi_fill_color);
48
}
50
@if $t==focus {
51
border-color: transparent;
52
box-shadow: inset 0 -2px if($fc==$selected_bg_color,
53
$selected_bg_color,
54
$osd_indicator_color);
55
}
56
@if $t==hover { }
57
@if $t==insensitive {
58
color: $insensitive_fg_color;
59
border-color: transparent;
60
box-shadow: inset 0 -1px if($fc==$selected_bg_color,
61
$semi_fill_color,
62
$osd_semi_fill_color);
63
}
64
}
65
// buttons
67
@mixin button($t, $c:$bg_color, $tc:$fg_color) {
69
//
70
// Button drawing function
71
//
72
// $t: button type,
73
// $c: base button color for colored* types
74
// $tc: optional text color for colored* types
75
//
76
// possible $t values:
77
// normal, hover, active, insensitive, undecorated
78
//
79
@if $t==normal {
80
//
81
// normal button
82
//
83
color: if($tc!=$fg_color, $tc, $secondary_fg_color);
84
background-color: $c;
85
border-color: transparent;
86
@include shadow(1);
87
text-shadow: none;
88
icon-shadow: none;
89
}
90
@if $t==focus {
91
//
92
// focused button
93
//
94
color: $tc;
95
text-shadow: none;
96
icon-shadow: none;
97
box-shadow: 0 0 transparent;
98
// box-shadow: inset 0px 0px 0px 2px $fill_color;
99
}
100
@else if $t==hover {
102
//
103
// hovered button
104
//
105
color: if($tc!=$fg_color, $tc, $fg_color);
106
background-color: $c;
107
border-color: transparent;
108
@include shadow(2);
109
text-shadow: none;
110
icon-shadow: none;
111
}
113
@else if $t==active {
114
//
115
// pushed button
116
//
117
color: if($tc!=$fg_color, $tc, $fg_color);
118
background-color: mix($tc,$c,20%);
119
border-color: transparent;
120
@include shadow(2);
121
text-shadow: none;
122
icon-shadow: none;
123
}
124
@else if $t==insensitive {
125
//
126
// insensitive button
127
//
128
color: if($tc!=$fg_color, $insensitive_fg_color, $insensitive_secondary_fg_color);
129
background-color: $semi_fill_color;
130
border-color: transparent;
131
box-shadow: 0 0 transparent;
132
text-shadow: none;
133
icon-shadow: none;
134
}
135
@if $t==flat-normal {
136
//
137
// normal flat button
138
//
139
color: if($tc!=$fg_color, $tc, $secondary_fg_color);
140
background-color: transparent;
141
border-color: transparent;
142
box-shadow: 0 0 transparent;
143
text-shadow: none;
144
icon-shadow: none;
145
}
146
@if $t==flat-focus {
147
//
148
// focused flat button
149
//
150
color: $tc;
151
text-shadow: none;
152
icon-shadow: none;
153
box-shadow: 0 0 transparent;
154
// box-shadow: inset 0px 0px 0px 2px $fill_color;
155
}
156
@else if $t==flat-hover {
158
//
159
// hovered flat button
160
//
161
color: if($tc!=$fg_color, $tc, $fg_color);
162
background-color: $semi_fill_color;
163
border-color: transparent;
164
box-shadow: 0 0 transparent;
165
text-shadow: none;
166
icon-shadow: none;
167
}
169
@else if $t==flat-active {
170
//
171
// pushed flat button
172
//
173
color: if($tc!=$fg_color, $tc, $fg_color);
174
background-color: $fill_color;
175
border-color: transparent;
176
box-shadow: 0 0 transparent;
177
text-shadow: none;
178
icon-shadow: none;
179
}
180
@else if $t==flat-insensitive {
181
//
182
// insensitive flat button
183
//
184
color: if($tc!=$fg_color, $insensitive_fg_color, $insensitive_secondary_fg_color);
185
background-color: transparent;
186
border-color: transparent;
187
box-shadow: 0 0 transparent;
188
text-shadow: none;
189
icon-shadow: none;
190
}
191
@else if $t==undecorated {
192
//
193
// reset
194
//
195
color: inherit;
196
background-color: transparent;
197
border-color: transparent;
198
box-shadow: 0 0 transparent;
199
text-shadow: none;
200
icon-shadow: none;
201
}
202
}
203