commonroutesApp/www/lib/ionic/scss/_variables.scss
www/lib/ionic/scss/_variables.scssRaw
1
2// Colors
3// -------------------------------
4
5$light: #fff !default;
6$stable: #f8f8f8 !default;
7$positive: #387ef5 !default;
8$calm: #11c1f3 !default;
9$balanced: #33cd5f !default;
10$energized: #ffc900 !default;
11$assertive: #ef473a !default;
12$royal: #886aea !default;
13$dark: #444 !default;
14
15
16// Base
17// -------------------------------
18
19$font-family-sans-serif: '-apple-system', "Helvetica Neue", "Roboto", "Segoe UI", sans-serif !default;
20
21$font-family-light-sans-serif: '-apple-system', "HelveticaNeue-Light", "Roboto-Light", "Segoe UI-Light", sans-serif-light !default;
22$font-family-serif: serif !default;
23$font-family-monospace: monospace !default;
24
25$font-family-base: $font-family-sans-serif !default;
26$font-size-base: 14px !default;
27$font-size-large: 18px !default;
28$font-size-small: 11px !default;
29
30$line-height-base: 1.428571429 !default; // 20/14
31$line-height-computed: floor($font-size-base * $line-height-base) !default; // ~20px
32$line-height-large: 1.33 !default;
33$line-height-small: 1.5 !default;
34
35$headings-font-family: $font-family-base !default;
36$headings-font-weight: 500 !default;
37$headings-line-height: 1.2 !default;
38
39$base-background-color: #fff !default;
40$base-color: #000 !default;
41
42$link-color: $positive !default;
43$link-hover-color: darken($link-color, 15%) !default;
44
45$content-padding: 10px !default;
46
47$padding-base-vertical: 6px !default;
48$padding-base-horizontal: 12px !default;
49
50$padding-large-vertical: 10px !default;
51$padding-large-horizontal: 16px !default;
52
53$padding-small-vertical: 5px !default;
54$padding-small-horizontal: 10px !default;
55
56$border-radius-base: 4px !default;
57$border-radius-large: 6px !default;
58$border-radius-small: 3px !default;
59
60
61// Content
62// -------------------------------
63
64$scroll-refresh-icon-color: #666666 !default;
65
66
67// Buttons
68// -------------------------------
69
70$button-color: #222 !default;
71$button-block-margin: 10px !default;
72$button-clear-padding: 6px !default;
73$button-border-radius: 4px !default;
74$button-border-width: 1px !default;
75
76$button-font-size: 16px !default;
77$button-height: 42px !default;
78$button-padding: 12px !default;
79$button-icon-size: 24px !default;
80
81$button-large-font-size: 20px !default;
82$button-large-height: 54px !default;
83$button-large-padding: 16px !default;
84$button-large-icon-size: 32px !default;
85
86$button-small-font-size: 12px !default;
87$button-small-height: 28px !default;
88$button-small-padding: 4px !default;
89$button-small-icon-size: 16px !default;
90
91$button-bar-button-font-size: 13px !default;
92$button-bar-button-height: 32px !default;
93$button-bar-button-padding: 8px !default;
94$button-bar-button-icon-size: 20px !default;
95
96$button-default-border: transparent;
97$button-default-active-border:null;
98
99$button-light-bg: $light !default;
100$button-light-text: #444 !default;
101$button-light-border: #ddd !default;
102$button-light-active-bg: #fafafa !default;
103$button-light-active-border: #ccc !default;
104
105$button-stable-bg: $stable !default;
106$button-stable-text: #444 !default;
107$button-stable-border: #b2b2b2 !default;
108$button-stable-active-bg: #e5e5e5 !default;
109$button-stable-active-border: #a2a2a2 !default;
110
111$button-positive-bg: $positive !default;
112$button-positive-text: #fff !default;
113$button-positive-border: darken($positive, 10%) !default;
114$button-positive-active-bg: darken($positive, 10%) !default;
115$button-positive-active-border: darken($positive, 10%) !default;
116
117$button-calm-bg: $calm !default;
118$button-calm-text: #fff !default;
119$button-calm-border: darken($calm, 10%) !default;
120$button-calm-active-bg: darken($calm, 10%) !default;
121$button-calm-active-border: darken($calm, 10%) !default;
122
123$button-assertive-bg: $assertive !default;
124$button-assertive-text: #fff !default;
125$button-assertive-border: darken($assertive, 10%) !default;
126$button-assertive-active-bg: darken($assertive, 10%) !default;
127$button-assertive-active-border: darken($assertive, 10%) !default;
128
129$button-balanced-bg: $balanced !default;
130$button-balanced-text: #fff !default;
131$button-balanced-border: darken($balanced, 10%) !default;
132$button-balanced-active-bg: darken($balanced, 10%) !default;
133$button-balanced-active-border: darken($balanced, 10%) !default;
134
135$button-energized-bg: $energized !default;
136$button-energized-text: #fff !default;
137$button-energized-border: darken($energized, 5%) !default;
138$button-energized-active-bg: darken($energized, 5%) !default;
139$button-energized-active-border: darken($energized, 5%) !default;
140
141$button-royal-bg: $royal !default;
142$button-royal-text: #fff !default;
143$button-royal-border: darken($royal, 8%) !default;
144$button-royal-active-bg: darken($royal, 8%) !default;
145$button-royal-active-border: darken($royal, 8%) !default;
146
147$button-dark-bg: $dark !default;
148$button-dark-text: #fff !default;
149$button-dark-border: #111 !default;
150$button-dark-active-bg: #262626 !default;
151$button-dark-active-border: #000 !default;
152
153$button-default-bg: $button-stable-bg !default;
154$button-default-text: $button-stable-text !default;
155$button-default-border: $button-stable-border !default;
156$button-default-active-bg: $button-stable-active-bg !default;
157$button-default-active-border: $button-stable-active-border !default;
158
159
160// Bars
161// -------------------------------
162
163$bar-height: 44px !default;
164$bar-title-font-size: 17px !default;
165$bar-padding-portrait: 5px !default;
166$bar-padding-landscape: 5px !default;
167$bar-transparency: 1 !default;
168
169$bar-footer-height: $bar-height !default;
170$bar-subheader-height: $bar-height !default;
171$bar-subfooter-height: $bar-height !default;
172
173$bar-light-bg: rgba($button-light-bg, $bar-transparency) !default;
174$bar-light-text: $button-light-text !default;
175$bar-light-border: $button-light-border !default;
176$bar-light-active-bg: $button-light-active-bg !default;
177$bar-light-active-border: $button-light-active-border !default;
178
179$bar-stable-bg: rgba($button-stable-bg, $bar-transparency) !default;
180$bar-stable-text: $button-stable-text !default;
181$bar-stable-border: $button-stable-border !default;
182$bar-stable-active-bg: $button-stable-active-bg !default;
183$bar-stable-active-border: $button-stable-active-border !default;
184
185$bar-positive-bg: rgba($button-positive-bg, $bar-transparency) !default;
186$bar-positive-text: $button-positive-text !default;
187$bar-positive-border: $button-positive-border !default;
188$bar-positive-active-bg: $button-positive-active-bg !default;
189$bar-positive-active-border: $button-positive-active-border !default;
190
191$bar-calm-bg: rgba($button-calm-bg, $bar-transparency) !default;
192$bar-calm-text: $button-calm-text !default;
193$bar-calm-border: $button-calm-border !default;
194$bar-calm-active-bg: $button-calm-active-bg !default;
195$bar-calm-active-border: $button-calm-active-border !default;
196
197$bar-assertive-bg: rgba($button-assertive-bg, $bar-transparency) !default;
198$bar-assertive-text: $button-assertive-text !default;
199$bar-assertive-border: $button-assertive-border !default;
200$bar-assertive-active-bg: $button-assertive-active-bg !default;
201$bar-assertive-active-border: $button-assertive-active-border !default;
202
203$bar-balanced-bg: rgba($button-balanced-bg, $bar-transparency) !default;
204$bar-balanced-text: $button-balanced-text !default;
205$bar-balanced-border: $button-balanced-border !default;
206$bar-balanced-active-bg: $button-balanced-active-bg !default;
207$bar-balanced-active-border: $button-balanced-active-border !default;
208
209$bar-energized-bg: rgba($button-energized-bg, $bar-transparency) !default;
210$bar-energized-text: $button-energized-text !default;
211$bar-energized-border: $button-energized-border !default;
212$bar-energized-active-bg: $button-energized-active-bg !default;
213$bar-energized-active-border: $button-energized-active-border !default;
214
215$bar-royal-bg: rgba($button-royal-bg, $bar-transparency) !default;
216$bar-royal-text: $button-royal-text !default;
217$bar-royal-border: $button-royal-border !default;
218$bar-royal-active-bg: $button-royal-active-bg !default;
219$bar-royal-active-border: $button-royal-active-border !default;
220
221$bar-dark-bg: rgba($button-dark-bg, $bar-transparency) !default;
222$bar-dark-text: $button-dark-text !default;
223$bar-dark-border: $button-dark-border !default;
224$bar-dark-active-bg: $button-dark-active-bg !default;
225$bar-dark-active-border: $button-dark-active-border !default;
226
227$bar-default-bg: $bar-light-bg !default;
228$bar-default-text: $bar-light-text !default;
229$bar-default-border: $bar-light-border !default;
230$bar-default-active-bg: $bar-light-active-bg !default;
231$bar-default-active-border: $bar-light-active-border !default;
232
233
234// Tabs
235// -------------------------------
236
237$tabs-height: 49px !default;
238$tabs-text-font-size: 14px !default;
239$tabs-text-font-size-side-icon: 10px !default;
240$tabs-icon-size: 32px !default;
241$tabs-badge-padding: 1px 6px !default;
242$tabs-badge-font-size: 12px !default;
243
244$tabs-light-bg: $button-light-bg !default;
245$tabs-light-border: $button-light-border !default;
246$tabs-light-text: $button-light-text !default;
247
248$tabs-stable-bg: $button-stable-bg !default;
249$tabs-stable-border: $button-stable-border !default;
250$tabs-stable-text: $button-stable-text !default;
251
252$tabs-positive-bg: $button-positive-bg !default;
253$tabs-positive-border: $button-positive-border !default;
254$tabs-positive-text: $button-positive-text !default;
255
256$tabs-calm-bg: $button-calm-bg !default;
257$tabs-calm-border: $button-calm-border !default;
258$tabs-calm-text: $button-calm-text !default;
259
260$tabs-assertive-bg: $button-assertive-bg !default;
261$tabs-assertive-border: $button-assertive-border !default;
262$tabs-assertive-text: $button-assertive-text !default;
263
264$tabs-balanced-bg: $button-balanced-bg !default;
265$tabs-balanced-border: $button-balanced-border !default;
266$tabs-balanced-text: $button-balanced-text !default;
267
268$tabs-energized-bg: $button-energized-bg !default;
269$tabs-energized-border: $button-energized-border !default;
270$tabs-energized-text: $button-energized-text !default;
271
272$tabs-royal-bg: $button-royal-bg !default;
273$tabs-royal-border: $button-royal-border !default;
274$tabs-royal-text: $button-royal-text !default;
275
276$tabs-dark-bg: $button-dark-bg !default;
277$tabs-dark-border: $button-dark-border !default;
278$tabs-dark-text: $button-dark-text !default;
279
280$tabs-default-bg: $tabs-stable-bg !default;
281$tabs-default-border: $tabs-stable-border !default;
282$tabs-default-text: $tabs-stable-text !default;
283
284$tab-item-max-width: 150px !default;
285
286$tabs-off-opacity: 0.4 !default;
287$tabs-striped-off-opacity: $tabs-off-opacity !default;
288$tabs-striped-off-color: #000 !default;
289$tabs-striped-border-width: 2px !default;
290
291
292// Items
293// -------------------------------
294
295$item-font-size: 16px !default;
296$item-border-width: 1px !default;
297$item-padding: 16px !default;
298
299$item-button-font-size: 18px !default;
300$item-button-line-height: 32px !default;
301$item-icon-font-size: 32px !default;
302$item-icon-fill-font-size: 28px !default;
303
304$item-icon-accessory-color: #ccc !default;
305$item-icon-accessory-font-size: 16px !default;
306
307$item-avatar-width: 40px !default;
308$item-avatar-height: 40px !default;
309$item-avatar-border-radius: 50% !default;
310
311$item-thumbnail-width: 80px !default;
312$item-thumbnail-height: 80px !default;
313$item-thumbnail-margin: 10px !default;
314
315$item-divider-bg: #f5f5f5 !default;
316$item-divider-color: #222 !default;
317$item-divider-padding: 5px 15px !default;
318
319$item-light-bg: $button-light-bg !default;
320$item-light-border: $button-light-border !default;
321$item-light-text: $button-light-text !default;
322$item-light-active-bg: $button-light-active-bg !default;
323$item-light-active-border: $button-light-active-border !default;
324
325$item-stable-bg: $button-stable-bg !default;
326$item-stable-border: $button-stable-border !default;
327$item-stable-text: $button-stable-text !default;
328$item-stable-active-bg: $button-stable-active-bg !default;
329$item-stable-active-border: $button-stable-active-border !default;
330
331$item-positive-bg: $button-positive-bg !default;
332$item-positive-border: $button-positive-border !default;
333$item-positive-text: $button-positive-text !default;
334$item-positive-active-bg: $button-positive-active-bg !default;
335$item-positive-active-border: $button-positive-active-border !default;
336
337$item-calm-bg: $button-calm-bg !default;
338$item-calm-border: $button-calm-border !default;
339$item-calm-text: $button-calm-text !default;
340$item-calm-active-bg: $button-calm-active-bg !default;
341$item-calm-active-border: $button-calm-active-border !default;
342
343$item-assertive-bg: $button-assertive-bg !default;
344$item-assertive-border: $button-assertive-border !default;
345$item-assertive-text: $button-assertive-text !default;
346$item-assertive-active-bg: $button-assertive-active-bg !default;
347$item-assertive-active-border: $button-assertive-active-border !default;
348
349$item-balanced-bg: $button-balanced-bg !default;
350$item-balanced-border: $button-balanced-border !default;
351$item-balanced-text: $button-balanced-text !default;
352$item-balanced-active-bg: $button-balanced-active-bg !default;
353$item-balanced-active-border: $button-balanced-active-border !default;
354
355$item-energized-bg: $button-energized-bg !default;
356$item-energized-border: $button-energized-border !default;
357$item-energized-text: $button-energized-text !default;
358$item-energized-active-bg: $button-energized-active-bg !default;
359$item-energized-active-border: $button-energized-active-border !default;
360
361$item-royal-bg: $button-royal-bg !default;
362$item-royal-border: $button-royal-border !default;
363$item-royal-text: $button-royal-text !default;
364$item-royal-active-bg: $button-royal-active-bg !default;
365$item-royal-active-border: $button-royal-active-border !default;
366
367$item-dark-bg: $button-dark-bg !default;
368$item-dark-border: $button-dark-border !default;
369$item-dark-text: $button-dark-text !default;
370$item-dark-active-bg: $button-dark-active-bg !default;
371$item-dark-active-border: $button-dark-active-border !default;
372
373$item-default-bg: $item-light-bg !default;
374$item-default-border: $item-light-border !default;
375$item-default-text: $item-light-text !default;
376$item-default-active-bg: #D9D9D9 !default;
377$item-default-active-border: $item-light-active-border !default;
378
379
380// Item Editing
381// -------------------------------
382
383$item-edit-transition-duration: 250ms !default;
384$item-edit-transition-function: ease-in-out !default;
385
386$item-remove-transition-duration: 300ms !default;
387$item-remove-transition-function: ease-in !default;
388$item-remove-descendents-transition-function: cubic-bezier(.25,.81,.24,1) !default;
389
390$item-left-edit-left: 8px !default; // item's left side edit's "left" property
391
392$item-right-edit-open-width: 50px !default;
393$item-left-edit-open-width: 50px !default;
394
395$item-delete-icon-size: 24px !default;
396$item-delete-icon-color: $assertive !default;
397
398$item-reorder-icon-size: 32px !default;
399$item-reorder-icon-color: $dark !default;
400
401
402// Lists
403// -------------------------------
404
405$list-header-bg: transparent !default;
406$list-header-color: #222 !default;
407$list-header-padding: 5px 15px !default;
408$list-header-margin-top: 20px !default;
409
410
411// Cards
412// -------------------------------
413
414$card-header-bg: #F5F5F5 !default;
415$card-body-bg: #fff !default;
416$card-footer-bg: #F5F5F5 !default;
417
418$card-padding: 10px !default;
419$card-border-width: 1px !default;
420
421$card-border-color: #ccc !default;
422$card-border-radius: 2px !default;
423$card-box-shadow: 0 1px 3px rgba(0, 0, 0, .3) !default;
424
425
426// Forms
427// -------------------------------
428
429$input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default;
430$input-height-large: (floor($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
431$input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;
432
433$input-bg: $light !default;
434$input-bg-disabled: $stable !default;
435
436$input-color: #111 !default;
437$input-border: $item-default-border !default;
438$input-border-width: $item-border-width !default;
439$input-label-color: $dark !default;
440$input-color-placeholder: lighten($dark, 40%) !default;
441
442
443// Progress
444// -------------------------------
445
446$progress-width: 100% !default;
447$progress-margin: 15px auto !default;
448
449
450// Toggle
451// -------------------------------
452
453$toggle-width: 51px !default;
454$toggle-height: 31px !default;
455$toggle-border-width: 2px !default;
456$toggle-border-radius: 20px !default;
457
458$toggle-handle-width: $toggle-height - ($toggle-border-width * 2) !default;
459$toggle-handle-height: $toggle-handle-width !default;
460$toggle-handle-radius: $toggle-handle-width !default;
461$toggle-handle-dragging-bg-color: darken(#fff, 5%) !default;
462
463$toggle-off-bg-color: #fff !default;
464$toggle-off-border-color: #e6e6e6 !default;
465
466$toggle-on-light-bg: $button-light-border !default;
467$toggle-on-light-border: $toggle-on-light-bg !default;
468$toggle-on-stable-bg: $button-stable-border !default;
469$toggle-on-stable-border: $toggle-on-stable-bg !default;
470$toggle-on-positive-bg: $positive !default;
471$toggle-on-positive-border: $toggle-on-positive-bg !default;
472$toggle-on-calm-bg: $calm !default;
473$toggle-on-calm-border: $toggle-on-calm-bg !default;
474$toggle-on-assertive-bg: $assertive !default;
475$toggle-on-assertive-border: $toggle-on-assertive-bg !default;
476$toggle-on-balanced-bg: $balanced !default;
477$toggle-on-balanced-border: $toggle-on-balanced-bg !default;
478$toggle-on-energized-bg: $energized !default;
479$toggle-on-energized-border: $toggle-on-energized-bg !default;
480$toggle-on-royal-bg: $royal !default;
481$toggle-on-royal-border: $toggle-on-royal-bg !default;
482$toggle-on-dark-bg: $dark !default;
483$toggle-on-dark-border: $toggle-on-dark-bg !default;
484$toggle-on-default-bg: #4cd964 !default;
485$toggle-on-default-border: $toggle-on-default-bg !default;
486
487$toggle-handle-off-bg-color: $light !default;
488$toggle-handle-on-bg-color: $toggle-handle-off-bg-color !default;
489
490$toggle-transition-duration: .3s !default;
491
492$toggle-hit-area-expansion: 5px;
493
494
495// Checkbox
496// -------------------------------
497
498$checkbox-width: 28px !default;
499$checkbox-height: 28px !default;
500$checkbox-border-radius: $checkbox-width !default;
501$checkbox-border-width: 1px !default;
502
503$checkbox-off-bg-color: #fff !default;
504$checkbox-off-border-light: $button-light-border !default;
505$checkbox-on-bg-light: $button-light-border !default;
506$checkbox-off-border-stable: $button-stable-border !default;
507$checkbox-on-bg-stable: $button-stable-border !default;
508$checkbox-off-border-positive: $positive !default;
509$checkbox-on-bg-positive: $positive !default;
510$checkbox-off-border-calm: $calm !default;
511$checkbox-on-bg-calm: $calm !default;
512$checkbox-off-border-assertive: $assertive !default;
513$checkbox-on-bg-assertive: $assertive !default;
514$checkbox-off-border-balanced: $balanced !default;
515$checkbox-on-bg-balanced: $balanced !default;
516$checkbox-off-border-energized: $energized !default;
517$checkbox-on-bg-energized: $energized !default;
518$checkbox-off-border-royal: $royal !default;
519$checkbox-on-bg-royal: $royal !default;
520$checkbox-off-border-dark: $dark !default;
521$checkbox-on-bg-dark: $dark !default;
522$checkbox-off-border-default: $button-light-border !default;
523$checkbox-on-bg-default: $positive !default;
524$checkbox-on-border-default: $positive !default;
525
526$checkbox-check-width: 1px !default;
527$checkbox-check-color: #fff !default;
528
529
530// Range
531// -------------------------------
532
533$range-track-height: 2px !default;
534$range-slider-width: 28px !default;
535$range-slider-height: 28px !default;
536$range-slider-border-radius: 50% !default;
537$range-icon-size: 24px !default;
538$range-slider-box-shadow: 0 0 2px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,0.2) !default;
539
540$range-light-track-bg: $button-light-border !default;
541$range-stable-track-bg: $button-stable-border !default;
542$range-positive-track-bg: $button-positive-bg !default;
543$range-calm-track-bg: $button-calm-bg !default;
544$range-balanced-track-bg: $button-balanced-bg !default;
545$range-assertive-track-bg: $button-assertive-bg !default;
546$range-energized-track-bg: $button-energized-bg !default;
547$range-royal-track-bg: $button-royal-bg !default;
548$range-dark-track-bg: $button-dark-bg !default;
549$range-default-track-bg: #ccc !default;
550
551
552// Menus
553// -------------------------------
554
555$menu-bg: #fff !default;
556$menu-width: 275px !default;
557$menu-animation-speed: 200ms !default;
558
559$menu-side-shadow: -1px 0px 2px rgba(0, 0, 0, 0.2), 1px 0px 2px rgba(0,0,0,0.2) !default;
560
561
562// Modals
563// -------------------------------
564
565$modal-bg-color: #fff !default;
566$modal-backdrop-bg-active: #000 !default;
567$modal-backdrop-bg-inactive: rgba(0,0,0,0) !default;
568
569$modal-inset-mode-break-point: 680px !default; // @media min-width
570$modal-inset-mode-top: 20% !default;
571$modal-inset-mode-right: 20% !default;
572$modal-inset-mode-bottom: 20% !default;
573$modal-inset-mode-left: 20% !default;
574$modal-inset-mode-min-height: 240px !default;
575
576
577// Popovers
578// -------------------------------
579
580$popover-bg-color: $light !default;
581$popover-backdrop-bg-active: rgba(0,0,0,0.1) !default;
582$popover-backdrop-bg-inactive: rgba(0,0,0,0) !default;
583$popover-width: 220px !default;
584$popover-height: 280px !default;
585$popover-large-break-point: 680px !default;
586$popover-large-width: 360px !default;
587
588$popover-box-shadow: 0 1px 3px rgba(0,0,0,0.4) !default;
589$popover-border-radius: 2px !default;
590
591$popover-box-shadow-ios: 0 0 40px rgba(0,0,0,0.08) !default;
592$popover-border-radius-ios: 10px !default;
593
594$popover-bg-color-android: #fafafa !default;
595$popover-box-shadow-android: 0 2px 6px rgba(0,0,0,0.35) !default;
596
597
598// Grids
599// -------------------------------
600
601$grid-padding-width: 10px !default;
602$grid-responsive-sm-break: 567px !default; // smaller than landscape phone
603$grid-responsive-md-break: 767px !default; // smaller than portrait tablet
604$grid-responsive-lg-break: 1023px !default; // smaller than landscape tablet
605
606
607// Action Sheets
608// -------------------------------
609
610$sheet-margin: 8px !default;
611$sheet-border-radius: 4px !default;
612
613$sheet-options-bg-color: #f1f2f3 !default;
614$sheet-options-bg-active-color: #e4e5e7 !default;
615$sheet-options-text-color: #007aff !default;
616$sheet-options-border-color: #d1d3d6 !default;
617
618
619// Popups
620// -------------------------------
621
622$popup-width: 250px !default;
623$popup-enter-animation: superScaleIn !default;
624$popup-enter-animation-duration: 0.2s !default;
625$popup-leave-animation-duration: 0.1s !default;
626
627$popup-border-radius: 0px !default;
628$popup-background-color: rgba(255,255,255,0.9) !default;
629
630$popup-button-border-radius: 2px !default;
631$popup-button-line-height: 20px !default;
632$popup-button-min-height: 45px !default;
633
634
635// Loading
636// -------------------------------
637
638$loading-text-color: #fff !default;
639$loading-bg-color: rgba(0,0,0,0.7) !default;
640$loading-padding: 20px !default;
641$loading-border-radius: 5px !default;
642$loading-font-size: 15px !default;
643
644$loading-backdrop-fadein-duration:0.1s !default;
645$loading-backdrop-bg-color: rgba(0,0,0,0.4) !default;
646
647
648// Badges
649// -------------------------------
650
651$badge-font-size: 14px !default;
652$badge-line-height: 16px !default;
653$badge-font-weight: bold !default;
654$badge-border-radius: 10px !default;
655
656$badge-light-bg: $button-light-bg !default;
657$badge-light-text: $button-light-text !default;
658
659$badge-stable-bg: $button-stable-bg !default;
660$badge-stable-text: $button-stable-text !default;
661
662$badge-positive-bg: $button-positive-bg !default;
663$badge-positive-text: $button-positive-text !default;
664
665$badge-calm-bg: $button-calm-bg !default;
666$badge-calm-text: $button-calm-text !default;
667
668$badge-balanced-bg: $button-balanced-bg !default;
669$badge-balanced-text: $button-balanced-text !default;
670
671$badge-assertive-bg: $button-assertive-bg !default;
672$badge-assertive-text: $button-assertive-text !default;
673
674$badge-energized-bg: $button-energized-bg !default;
675$badge-energized-text: $button-energized-text !default;
676
677$badge-royal-bg: $button-royal-bg !default;
678$badge-royal-text: $button-royal-text !default;
679
680$badge-dark-bg: $button-dark-bg !default;
681$badge-dark-text: $button-dark-text !default;
682
683$badge-default-bg: transparent !default;
684$badge-default-text: #AAAAAA !default;
685
686
687// Spinners
688// -------------------------------
689
690$spinner-width: 28px !default;
691$spinner-height: 28px !default;
692
693$spinner-light-stroke: $light !default;
694$spinner-light-fill: $light !default;
695
696$spinner-stable-stroke: $stable !default;
697$spinner-stable-fill: $stable !default;
698
699$spinner-positive-stroke: $positive !default;
700$spinner-positive-fill: $positive !default;
701
702$spinner-calm-stroke: $calm !default;
703$spinner-calm-fill: $calm !default;
704
705$spinner-balanced-stroke: $balanced !default;
706$spinner-balanced-fill: $balanced !default;
707
708$spinner-assertive-stroke: $assertive !default;
709$spinner-assertive-fill: $assertive !default;
710
711$spinner-energized-stroke: $energized !default;
712$spinner-energized-fill: $energized !default;
713
714$spinner-royal-stroke: $royal !default;
715$spinner-royal-fill: $royal !default;
716
717$spinner-dark-stroke: $dark !default;
718$spinner-dark-fill: $dark !default;
719
720$spinner-default-stroke: $dark !default;
721$spinner-default-fill: $dark !default;
722
723
724// Z-Indexes
725// -------------------------------
726
727$z-index-bar-title: 0 !default;
728$z-index-item-drag: 0 !default;
729$z-index-item-edit: 0 !default;
730$z-index-menu: 0 !default;
731$z-index-badge: 1 !default;
732$z-index-bar-button: 1 !default;
733$z-index-item-options: 1 !default;
734$z-index-pane: 1 !default;
735$z-index-slider-pager: 1 !default;
736$z-index-view: 1 !default;
737$z-index-view-below: 2 !default;
738$z-index-item: 2 !default;
739$z-index-item-checkbox: 3 !default;
740$z-index-item-radio: 3 !default;
741$z-index-item-reorder: 3 !default;
742$z-index-item-toggle: 3 !default;
743$z-index-view-above: 3 !default;
744$z-index-tabs: 5 !default;
745$z-index-item-reordering: 9 !default;
746$z-index-bar: 9 !default;
747$z-index-bar-above: 10 !default;
748$z-index-menu-scroll-content: 10 !default;
749$z-index-modal: 10 !default;
750$z-index-popover: 10 !default;
751$z-index-action-sheet: 11 !default;
752$z-index-backdrop: 11 !default;
753$z-index-menu-bar-header: 11 !default;
754$z-index-scroll-content-false: 11 !default;
755$z-index-popup: 12 !default;
756$z-index-loading: 13 !default;
757$z-index-scroll-bar: 9999 !default;
758$z-index-click-block: 99999 !default;
759
760
761// Platform
762// -------------------------------
763
764$ios-statusbar-height: 20px !default;