_mixins.scss
1.88 KB
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
// Button mixins start
@mixin buttons($back-color,$border-color,$color:#fff,$cursor:pointer,$transition:all ease-in 0.3s){
background-color: $back-color;
border-color:$border-color;
color:$color;
cursor:$cursor;
transition: $transition;
}
@mixin buttons-hover($back-color,$border-color,$color:#fff){
background-color: $back-color;
border-color:$border-color;
}
@mixin animations-frame($name){
@-webkit-keyframes #{$name}{
@content;
}
@keyframes #{$name}{
@content;
}
}
@mixin buttons-active($back-color,$border-color,$color:#fff,$box-shadow:none){
background-color: $back-color !important;
border-color:$border-color;
box-shadow:$box-shadow;
color:$color;
}
@mixin labels-active($back-color,$border-color,$color:#fff,$box-shadow:none){
background-color: $back-color !important;
border-color:$border-color;
box-shadow:$box-shadow;
color:$color;
}
@mixin button-trans($back-color,$border-color){
background-color:$back-color;
border-color:$border-color;
}
@mixin buttons-focus($back-color,$color:#fff,$box-shadow:none){
box-shadow:$box-shadow;
color:$color;
background-color:$back-color;
}
@mixin buttons-borders($color,$back-color:#fff){
color:$color;
background-color:$back-color;
}
@mixin dropdown-hover($back-color,$color:#fff){
background-color:$back-color;
color:$color;
}
// Button mixins end
// Label mixin start
@mixin labels-inverse($border-color,$color){
border-color: $border-color;
color:$color !important;
}
@mixin labels-badge($back-color:#34495e,$color:#fff){
background-color: $back-color;
color:$color;
}
@mixin labels-badge-inverse($color,$back-color:#fff){
color:$color;
background-color: $back-color;
}
// Label mixin end
@mixin width($width){
width:$width;
}
@mixin shadow($shadow...){
box-shadow:$shadow;
}
@mixin theme-keyframes($name) {
@-webkit-keyframes #{$name} {
@content;
}
@keyframes #{$name} {
@content;
}
}