blob: 4575513ed6e8ade931d573c35a2a0a8b87c1a2cf (
plain) (
blame)
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
|
// Name: Progress
// Description: Component to create progress bars
//
// Component: `uk-progress`
//
// ========================================================================
// Variables
// ========================================================================
$progress-height: 15px !default;
$progress-margin-vertical: $global-margin !default;
$progress-background: $global-muted-background !default;
$progress-bar-background: $global-primary-background !default;
/* ========================================================================
Component: Progress
========================================================================== */
/*
* 1. Add the correct vertical alignment in Chrome, Firefox, and Opera.
* 2. Remove default style
* 3. Behave like a block element
* 4. Remove borders in Firefox and Edge
* 5. Set background color for progress container in Firefox, IE11 and Edge
* 6. Style
*/
.uk-progress {
/* 1 */
vertical-align: baseline;
/* 2 */
-webkit-appearance: none;
-moz-appearance: none;
/* 3 */
display: block;
width: 100%;
/* 4 */
border: 0;
/* 5 */
background-color: $progress-background;
/* 6 */
margin-bottom: $progress-margin-vertical;
height: $progress-height;
@if(mixin-exists(hook-progress)) {@include hook-progress();}
}
/* Add margin if adjacent element */
* + .uk-progress { margin-top: $progress-margin-vertical; }
/*
* Remove animated circles for indeterminate state in IE11 and Edge
*/
.uk-progress:indeterminate { color: transparent; }
/*
* Progress container
* 2. Remove progress bar for indeterminate state in Firefox
*/
.uk-progress::-webkit-progress-bar {
background-color: $progress-background;
@if(mixin-exists(hook-progress)) {@include hook-progress();}
}
/* 2 */
.uk-progress:indeterminate::-moz-progress-bar { width: 0; }
/*
* Progress bar
* 1. Remove right border in IE11 and Edge
*/
.uk-progress::-webkit-progress-value {
background-color: $progress-bar-background;
transition: width 0.6s ease;
@if(mixin-exists(hook-progress-bar)) {@include hook-progress-bar();}
}
.uk-progress::-moz-progress-bar {
background-color: $progress-bar-background;
@if(mixin-exists(hook-progress-bar)) {@include hook-progress-bar();}
}
.uk-progress::-ms-fill {
background-color: $progress-bar-background;
transition: width 0.6s ease;
/* 1 */
border: 0;
@if(mixin-exists(hook-progress-bar)) {@include hook-progress-bar();}
}
// Hooks
// ========================================================================
@if(mixin-exists(hook-progress-misc)) {@include hook-progress-misc();}
// @mixin hook-progress(){}
// @mixin hook-progress-bar(){}
// @mixin hook-progress-misc(){}
|
