vhx-quartz 0.11.23 → 0.11.24
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/lib/vhx/quartz/version.rb +1 -1
- data/vendor/assets/stylesheets/vhx-quartz.avatar.css +188 -0
- data/vendor/assets/stylesheets/vhx-quartz.css +361 -0
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: aef882335ec20335d112eb8d8413e07b46b3da4a
|
4
|
+
data.tar.gz: 1e51b4044752899e32c656e7bb38a89ac34dac22
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 5d1bb565c2c46a81b20df65cb336600f25da836d34a06e5aa35c8cc095c51f615bd13339709d076bd0992be02966bd7c65136c7fafe7f50651b4ef7eb1e81afd
|
7
|
+
data.tar.gz: c9aff91dda388a67c2123c71fab20ed341115b6a352f6e1e592291c00c54455cd8ba055d3e4ae0a1fb0b6e46b7dec7f71d9c6001419be348f86f0879553251cc
|
data/lib/vhx/quartz/version.rb
CHANGED
@@ -0,0 +1,188 @@
|
|
1
|
+
/* imports
|
2
|
+
...................................*/
|
3
|
+
/* .....................................
|
4
|
+
Fonts
|
5
|
+
..................................... */
|
6
|
+
/* .....................................
|
7
|
+
Sets
|
8
|
+
..................................... */
|
9
|
+
/* .....................................
|
10
|
+
Media Query Ranges
|
11
|
+
..................................... */
|
12
|
+
/* .....................................
|
13
|
+
Colors - Grays
|
14
|
+
..................................... */
|
15
|
+
/* .....................................
|
16
|
+
Colors - Teals
|
17
|
+
..................................... */
|
18
|
+
/* .....................................
|
19
|
+
Colors - Red
|
20
|
+
..................................... */
|
21
|
+
/* .....................................
|
22
|
+
Colors - Navy
|
23
|
+
..................................... */
|
24
|
+
/* .....................................
|
25
|
+
Colors - Brand Palette
|
26
|
+
..................................... */
|
27
|
+
/* .....................................
|
28
|
+
Colors - Vimeo Brand Palette
|
29
|
+
..................................... */
|
30
|
+
/* .....................................
|
31
|
+
Colors - External Palette
|
32
|
+
..................................... */
|
33
|
+
/* helper function for margin and padding
|
34
|
+
......................................*/
|
35
|
+
/*.....................................
|
36
|
+
AVATARS
|
37
|
+
......................................*/
|
38
|
+
.avatar,
|
39
|
+
.new-avatar {
|
40
|
+
width: 36px;
|
41
|
+
height: 36px;
|
42
|
+
position: relative;
|
43
|
+
display: inline-block;
|
44
|
+
background-color: rgba(0, 20, 43, 0.5);
|
45
|
+
border-radius: 50%;
|
46
|
+
overflow: hidden;
|
47
|
+
z-index: 1; }
|
48
|
+
.avatar .default-avatar,
|
49
|
+
.new-avatar .default-avatar {
|
50
|
+
line-height: 36px;
|
51
|
+
font-size: 12px; }
|
52
|
+
.avatar .default-avatar,
|
53
|
+
.new-avatar .default-avatar {
|
54
|
+
padding-left: 1px;
|
55
|
+
padding-top: 0px; }
|
56
|
+
.avatar.color-blue,
|
57
|
+
.new-avatar.color-blue {
|
58
|
+
background-color: #144f79; }
|
59
|
+
.avatar.color-purple,
|
60
|
+
.new-avatar.color-purple {
|
61
|
+
background-color: #8a3b7f; }
|
62
|
+
.avatar.color-pink,
|
63
|
+
.new-avatar.color-pink {
|
64
|
+
background-color: #d1184d; }
|
65
|
+
.avatar.color-orange,
|
66
|
+
.new-avatar.color-orange {
|
67
|
+
background-color: #da7868; }
|
68
|
+
.avatar.color-green,
|
69
|
+
.new-avatar.color-green {
|
70
|
+
background-color: #9eba41; }
|
71
|
+
.avatar.color-forest,
|
72
|
+
.new-avatar.color-forest {
|
73
|
+
background-color: #226657; }
|
74
|
+
.avatar.color-light-blue,
|
75
|
+
.new-avatar.color-light-blue {
|
76
|
+
background-color: #30909d; }
|
77
|
+
.avatar.color-gray,
|
78
|
+
.new-avatar.color-gray {
|
79
|
+
background-color: #999999; }
|
80
|
+
.avatar.color-teal,
|
81
|
+
.new-avatar.color-teal {
|
82
|
+
background-color: #22B9B0; }
|
83
|
+
.avatar.avatar--border .avatar-img,
|
84
|
+
.new-avatar.avatar--border .avatar-img {
|
85
|
+
border: 2px solid #fff; }
|
86
|
+
.avatar .avatar-user,
|
87
|
+
.new-avatar .avatar-user {
|
88
|
+
position: absolute;
|
89
|
+
top: 0;
|
90
|
+
left: 0;
|
91
|
+
width: 100%;
|
92
|
+
height: 100%;
|
93
|
+
background-size: cover; }
|
94
|
+
.avatar.avatar--xsmall,
|
95
|
+
.new-avatar.avatar--xsmall {
|
96
|
+
width: 24px;
|
97
|
+
height: 24px; }
|
98
|
+
.avatar.avatar--xsmall .default-avatar,
|
99
|
+
.new-avatar.avatar--xsmall .default-avatar {
|
100
|
+
line-height: 24px;
|
101
|
+
font-size: 8px; }
|
102
|
+
.avatar.avatar--xsmall .default-avatar,
|
103
|
+
.new-avatar.avatar--xsmall .default-avatar {
|
104
|
+
padding-left: 0px;
|
105
|
+
padding-top: 0px; }
|
106
|
+
.avatar.avatar--small,
|
107
|
+
.new-avatar.avatar--small {
|
108
|
+
width: 36px;
|
109
|
+
height: 36px; }
|
110
|
+
.avatar.avatar--small .default-avatar,
|
111
|
+
.new-avatar.avatar--small .default-avatar {
|
112
|
+
line-height: 36px;
|
113
|
+
font-size: 12px; }
|
114
|
+
.avatar.avatar--small .default-avatar,
|
115
|
+
.new-avatar.avatar--small .default-avatar {
|
116
|
+
padding-left: 1px;
|
117
|
+
padding-top: 0px; }
|
118
|
+
.avatar.avatar--medium,
|
119
|
+
.new-avatar.avatar--medium {
|
120
|
+
width: 46px;
|
121
|
+
height: 46px; }
|
122
|
+
.avatar.avatar--medium .default-avatar,
|
123
|
+
.new-avatar.avatar--medium .default-avatar {
|
124
|
+
line-height: 46px;
|
125
|
+
font-size: 15px; }
|
126
|
+
.avatar.avatar--medium .default-avatar,
|
127
|
+
.new-avatar.avatar--medium .default-avatar {
|
128
|
+
padding-left: 1px;
|
129
|
+
padding-top: 0px; }
|
130
|
+
.avatar.avatar--large,
|
131
|
+
.new-avatar.avatar--large {
|
132
|
+
width: 60px;
|
133
|
+
height: 60px; }
|
134
|
+
.avatar.avatar--large .default-avatar,
|
135
|
+
.new-avatar.avatar--large .default-avatar {
|
136
|
+
line-height: 60px;
|
137
|
+
font-size: 20px; }
|
138
|
+
.avatar.avatar--large .default-avatar,
|
139
|
+
.new-avatar.avatar--large .default-avatar {
|
140
|
+
padding-left: 2px;
|
141
|
+
padding-top: 1px; }
|
142
|
+
.avatar.avatar--xlarge,
|
143
|
+
.new-avatar.avatar--xlarge {
|
144
|
+
width: 80px;
|
145
|
+
height: 80px; }
|
146
|
+
.avatar.avatar--xlarge .default-avatar,
|
147
|
+
.new-avatar.avatar--xlarge .default-avatar {
|
148
|
+
line-height: 80px;
|
149
|
+
font-size: 27px; }
|
150
|
+
.avatar.avatar--xlarge .default-avatar,
|
151
|
+
.new-avatar.avatar--xlarge .default-avatar {
|
152
|
+
padding-left: 2px;
|
153
|
+
padding-top: 1px; }
|
154
|
+
.avatar.avatar--xxlarge,
|
155
|
+
.new-avatar.avatar--xxlarge {
|
156
|
+
width: 100px;
|
157
|
+
height: 100px; }
|
158
|
+
.avatar.avatar--xxlarge .default-avatar,
|
159
|
+
.new-avatar.avatar--xxlarge .default-avatar {
|
160
|
+
line-height: 100px;
|
161
|
+
font-size: 33px; }
|
162
|
+
.avatar.avatar--xxlarge .default-avatar,
|
163
|
+
.new-avatar.avatar--xxlarge .default-avatar {
|
164
|
+
padding-left: 3px;
|
165
|
+
padding-top: 1px; }
|
166
|
+
|
167
|
+
.new-avatar {
|
168
|
+
text-align: center; }
|
169
|
+
.new-avatar .default-avatar {
|
170
|
+
color: #fff;
|
171
|
+
font-weight: bold;
|
172
|
+
display: block; }
|
173
|
+
|
174
|
+
.avatar:before {
|
175
|
+
color: red;
|
176
|
+
content: ' ';
|
177
|
+
display: block;
|
178
|
+
position: absolute;
|
179
|
+
-webkit-background-clip: padding-box;
|
180
|
+
background-clip: padding-box;
|
181
|
+
top: 0;
|
182
|
+
left: 0;
|
183
|
+
width: 100%;
|
184
|
+
height: 100%;
|
185
|
+
background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%3E%3Cg%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M7.1%2011c1.8%200%201.8-2.8%200-2.8S5.3%2011%207.1%2011zM15.9%2011c1.8%200%201.8-2.8%200-2.8s-1.8%202.8%200%202.8z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M4.2%2012.9c.3%200%20.5.2.5.5v1.4h13.6v-1.4c0-.3.2-.5.5-.5h3.8V4.6c0-.4-.3-.8-.8-.8H1.2c-.4%200-.8.4-.8.8v8.3h3.8zm11.7-5.7c3.1%200%203.1%204.8%200%204.8s-3.1-4.8%200-4.8zm-8.8%200c3.1%200%203.1%204.8%200%204.8S4%207.2%207.1%207.2z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M19.3%2013.9v1.4c0%20.3-.2.5-.5.5H4.2c-.3%200-.5-.2-.5-.5v-1.4H.4v4.5c0%20.4.3.8.8.8h20.7c.4%200%20.8-.4.8-.8v-4.5h-3.4z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3Cpath%20d%3D%22M7.1%208.2c-1.8%200-1.8%202.8%200%202.8s1.8-2.8%200-2.8zM15.9%208.2c-1.8%200-1.8%202.8%200%202.8s1.8-2.8%200-2.8z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
|
186
|
+
background-repeat: no-repeat;
|
187
|
+
background-position: 50% 50%;
|
188
|
+
background-size: 50%; }
|
@@ -1,3 +1,193 @@
|
|
1
|
+
/* imports
|
2
|
+
...................................*/
|
3
|
+
/* .....................................
|
4
|
+
Fonts
|
5
|
+
..................................... */
|
6
|
+
/* .....................................
|
7
|
+
Sets
|
8
|
+
..................................... */
|
9
|
+
/* .....................................
|
10
|
+
Media Query Ranges
|
11
|
+
..................................... */
|
12
|
+
/* .....................................
|
13
|
+
Colors - Grays
|
14
|
+
..................................... */
|
15
|
+
/* .....................................
|
16
|
+
Colors - Teals
|
17
|
+
..................................... */
|
18
|
+
/* .....................................
|
19
|
+
Colors - Red
|
20
|
+
..................................... */
|
21
|
+
/* .....................................
|
22
|
+
Colors - Navy
|
23
|
+
..................................... */
|
24
|
+
/* .....................................
|
25
|
+
Colors - Brand Palette
|
26
|
+
..................................... */
|
27
|
+
/* .....................................
|
28
|
+
Colors - Vimeo Brand Palette
|
29
|
+
..................................... */
|
30
|
+
/* .....................................
|
31
|
+
Colors - External Palette
|
32
|
+
..................................... */
|
33
|
+
/* helper function for margin and padding
|
34
|
+
......................................*/
|
35
|
+
/*.....................................
|
36
|
+
AVATARS
|
37
|
+
......................................*/
|
38
|
+
.avatar,
|
39
|
+
.new-avatar {
|
40
|
+
width: 36px;
|
41
|
+
height: 36px;
|
42
|
+
position: relative;
|
43
|
+
display: inline-block;
|
44
|
+
background-color: rgba(0, 20, 43, 0.5);
|
45
|
+
border-radius: 50%;
|
46
|
+
overflow: hidden;
|
47
|
+
z-index: 1; }
|
48
|
+
.avatar .default-avatar,
|
49
|
+
.new-avatar .default-avatar {
|
50
|
+
line-height: 36px;
|
51
|
+
font-size: 12px; }
|
52
|
+
.avatar .default-avatar,
|
53
|
+
.new-avatar .default-avatar {
|
54
|
+
padding-left: 1px;
|
55
|
+
padding-top: 0px; }
|
56
|
+
.avatar.color-blue,
|
57
|
+
.new-avatar.color-blue {
|
58
|
+
background-color: #144f79; }
|
59
|
+
.avatar.color-purple,
|
60
|
+
.new-avatar.color-purple {
|
61
|
+
background-color: #8a3b7f; }
|
62
|
+
.avatar.color-pink,
|
63
|
+
.new-avatar.color-pink {
|
64
|
+
background-color: #d1184d; }
|
65
|
+
.avatar.color-orange,
|
66
|
+
.new-avatar.color-orange {
|
67
|
+
background-color: #da7868; }
|
68
|
+
.avatar.color-green,
|
69
|
+
.new-avatar.color-green {
|
70
|
+
background-color: #9eba41; }
|
71
|
+
.avatar.color-forest,
|
72
|
+
.new-avatar.color-forest {
|
73
|
+
background-color: #226657; }
|
74
|
+
.avatar.color-light-blue,
|
75
|
+
.new-avatar.color-light-blue {
|
76
|
+
background-color: #30909d; }
|
77
|
+
.avatar.color-gray,
|
78
|
+
.new-avatar.color-gray {
|
79
|
+
background-color: #999999; }
|
80
|
+
.avatar.color-teal,
|
81
|
+
.new-avatar.color-teal {
|
82
|
+
background-color: #22B9B0; }
|
83
|
+
.avatar.avatar--border .avatar-img,
|
84
|
+
.new-avatar.avatar--border .avatar-img {
|
85
|
+
border: 2px solid #fff; }
|
86
|
+
.avatar .avatar-user,
|
87
|
+
.new-avatar .avatar-user {
|
88
|
+
position: absolute;
|
89
|
+
top: 0;
|
90
|
+
left: 0;
|
91
|
+
width: 100%;
|
92
|
+
height: 100%;
|
93
|
+
background-size: cover; }
|
94
|
+
.avatar.avatar--xsmall,
|
95
|
+
.new-avatar.avatar--xsmall {
|
96
|
+
width: 24px;
|
97
|
+
height: 24px; }
|
98
|
+
.avatar.avatar--xsmall .default-avatar,
|
99
|
+
.new-avatar.avatar--xsmall .default-avatar {
|
100
|
+
line-height: 24px;
|
101
|
+
font-size: 8px; }
|
102
|
+
.avatar.avatar--xsmall .default-avatar,
|
103
|
+
.new-avatar.avatar--xsmall .default-avatar {
|
104
|
+
padding-left: 0px;
|
105
|
+
padding-top: 0px; }
|
106
|
+
.avatar.avatar--small,
|
107
|
+
.new-avatar.avatar--small {
|
108
|
+
width: 36px;
|
109
|
+
height: 36px; }
|
110
|
+
.avatar.avatar--small .default-avatar,
|
111
|
+
.new-avatar.avatar--small .default-avatar {
|
112
|
+
line-height: 36px;
|
113
|
+
font-size: 12px; }
|
114
|
+
.avatar.avatar--small .default-avatar,
|
115
|
+
.new-avatar.avatar--small .default-avatar {
|
116
|
+
padding-left: 1px;
|
117
|
+
padding-top: 0px; }
|
118
|
+
.avatar.avatar--medium,
|
119
|
+
.new-avatar.avatar--medium {
|
120
|
+
width: 46px;
|
121
|
+
height: 46px; }
|
122
|
+
.avatar.avatar--medium .default-avatar,
|
123
|
+
.new-avatar.avatar--medium .default-avatar {
|
124
|
+
line-height: 46px;
|
125
|
+
font-size: 15px; }
|
126
|
+
.avatar.avatar--medium .default-avatar,
|
127
|
+
.new-avatar.avatar--medium .default-avatar {
|
128
|
+
padding-left: 1px;
|
129
|
+
padding-top: 0px; }
|
130
|
+
.avatar.avatar--large,
|
131
|
+
.new-avatar.avatar--large {
|
132
|
+
width: 60px;
|
133
|
+
height: 60px; }
|
134
|
+
.avatar.avatar--large .default-avatar,
|
135
|
+
.new-avatar.avatar--large .default-avatar {
|
136
|
+
line-height: 60px;
|
137
|
+
font-size: 20px; }
|
138
|
+
.avatar.avatar--large .default-avatar,
|
139
|
+
.new-avatar.avatar--large .default-avatar {
|
140
|
+
padding-left: 2px;
|
141
|
+
padding-top: 1px; }
|
142
|
+
.avatar.avatar--xlarge,
|
143
|
+
.new-avatar.avatar--xlarge {
|
144
|
+
width: 80px;
|
145
|
+
height: 80px; }
|
146
|
+
.avatar.avatar--xlarge .default-avatar,
|
147
|
+
.new-avatar.avatar--xlarge .default-avatar {
|
148
|
+
line-height: 80px;
|
149
|
+
font-size: 27px; }
|
150
|
+
.avatar.avatar--xlarge .default-avatar,
|
151
|
+
.new-avatar.avatar--xlarge .default-avatar {
|
152
|
+
padding-left: 2px;
|
153
|
+
padding-top: 1px; }
|
154
|
+
.avatar.avatar--xxlarge,
|
155
|
+
.new-avatar.avatar--xxlarge {
|
156
|
+
width: 100px;
|
157
|
+
height: 100px; }
|
158
|
+
.avatar.avatar--xxlarge .default-avatar,
|
159
|
+
.new-avatar.avatar--xxlarge .default-avatar {
|
160
|
+
line-height: 100px;
|
161
|
+
font-size: 33px; }
|
162
|
+
.avatar.avatar--xxlarge .default-avatar,
|
163
|
+
.new-avatar.avatar--xxlarge .default-avatar {
|
164
|
+
padding-left: 3px;
|
165
|
+
padding-top: 1px; }
|
166
|
+
|
167
|
+
.new-avatar {
|
168
|
+
text-align: center; }
|
169
|
+
.new-avatar .default-avatar {
|
170
|
+
color: #fff;
|
171
|
+
font-weight: bold;
|
172
|
+
display: block; }
|
173
|
+
|
174
|
+
.avatar:before {
|
175
|
+
color: red;
|
176
|
+
content: ' ';
|
177
|
+
display: block;
|
178
|
+
position: absolute;
|
179
|
+
-webkit-background-clip: padding-box;
|
180
|
+
background-clip: padding-box;
|
181
|
+
top: 0;
|
182
|
+
left: 0;
|
183
|
+
width: 100%;
|
184
|
+
height: 100%;
|
185
|
+
background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2223%22%20height%3D%2223%22%20viewBox%3D%220%200%2023%2023%22%3E%3Cg%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M7.1%2011c1.8%200%201.8-2.8%200-2.8S5.3%2011%207.1%2011zM15.9%2011c1.8%200%201.8-2.8%200-2.8s-1.8%202.8%200%202.8z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M4.2%2012.9c.3%200%20.5.2.5.5v1.4h13.6v-1.4c0-.3.2-.5.5-.5h3.8V4.6c0-.4-.3-.8-.8-.8H1.2c-.4%200-.8.4-.8.8v8.3h3.8zm11.7-5.7c3.1%200%203.1%204.8%200%204.8s-3.1-4.8%200-4.8zm-8.8%200c3.1%200%203.1%204.8%200%204.8S4%207.2%207.1%207.2z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M19.3%2013.9v1.4c0%20.3-.2.5-.5.5H4.2c-.3%200-.5-.2-.5-.5v-1.4H.4v4.5c0%20.4.3.8.8.8h20.7c.4%200%20.8-.4.8-.8v-4.5h-3.4z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3Cpath%20d%3D%22M7.1%208.2c-1.8%200-1.8%202.8%200%202.8s1.8-2.8%200-2.8zM15.9%208.2c-1.8%200-1.8%202.8%200%202.8s1.8-2.8%200-2.8z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
|
186
|
+
background-repeat: no-repeat;
|
187
|
+
background-position: 50% 50%;
|
188
|
+
background-size: 50%; }
|
189
|
+
|
190
|
+
|
1
191
|
/* generated with grunt-sass-globbing */
|
2
192
|
/* imports
|
3
193
|
...................................*/
|
@@ -7633,3 +7823,174 @@ a.text--astro-granite.is-disabled:link, a.text--astro-granite.is-disabled:visite
|
|
7633
7823
|
max-width: 200px; }
|
7634
7824
|
.tooltip.tooltip--fill {
|
7635
7825
|
width: 100%; }
|
7826
|
+
|
7827
|
+
/* .....................................
|
7828
|
+
Fonts
|
7829
|
+
..................................... */
|
7830
|
+
/* .....................................
|
7831
|
+
Sets
|
7832
|
+
..................................... */
|
7833
|
+
/* .....................................
|
7834
|
+
Media Query Ranges
|
7835
|
+
..................................... */
|
7836
|
+
/* .....................................
|
7837
|
+
Colors - Grays
|
7838
|
+
..................................... */
|
7839
|
+
/* .....................................
|
7840
|
+
Colors - Teals
|
7841
|
+
..................................... */
|
7842
|
+
/* .....................................
|
7843
|
+
Colors - Red
|
7844
|
+
..................................... */
|
7845
|
+
/* .....................................
|
7846
|
+
Colors - Navy
|
7847
|
+
..................................... */
|
7848
|
+
/* .....................................
|
7849
|
+
Colors - Brand Palette
|
7850
|
+
..................................... */
|
7851
|
+
/* .....................................
|
7852
|
+
Colors - Vimeo Brand Palette
|
7853
|
+
..................................... */
|
7854
|
+
/* .....................................
|
7855
|
+
Colors - External Palette
|
7856
|
+
..................................... */
|
7857
|
+
/* helper function for margin and padding
|
7858
|
+
......................................*/
|
7859
|
+
/*.....................................
|
7860
|
+
Admin Radio
|
7861
|
+
......................................*/
|
7862
|
+
.form .radio-gray,
|
7863
|
+
.form .radio-vimeo-blue {
|
7864
|
+
position: relative;
|
7865
|
+
display: inline-block;
|
7866
|
+
width: 100%;
|
7867
|
+
list-style: none;
|
7868
|
+
margin-left: 0;
|
7869
|
+
color: #5E7887;
|
7870
|
+
font-size: 14px;
|
7871
|
+
background: transparent;
|
7872
|
+
user-select: none;
|
7873
|
+
/* radio
|
7874
|
+
...................................*/
|
7875
|
+
/* label unchecked
|
7876
|
+
...................................*/
|
7877
|
+
/* label checked
|
7878
|
+
...................................*/
|
7879
|
+
/* stacked radio
|
7880
|
+
...................................*/
|
7881
|
+
/* color styles
|
7882
|
+
...................................*/ }
|
7883
|
+
.form .radio-gray input[type="radio"],
|
7884
|
+
.form .radio-vimeo-blue input[type="radio"] {
|
7885
|
+
display: none; }
|
7886
|
+
.form .radio-gray li,
|
7887
|
+
.form .radio-vimeo-blue li {
|
7888
|
+
display: inline-block;
|
7889
|
+
margin-right: 10px; }
|
7890
|
+
.form .radio-gray li:after,
|
7891
|
+
.form .radio-vimeo-blue li:after {
|
7892
|
+
clear: both; }
|
7893
|
+
.form .radio-gray li:before, .form .radio-gray li:after,
|
7894
|
+
.form .radio-vimeo-blue li:before,
|
7895
|
+
.form .radio-vimeo-blue li:after {
|
7896
|
+
content: " ";
|
7897
|
+
display: table; }
|
7898
|
+
.form .radio-gray label,
|
7899
|
+
.form .radio-vimeo-blue label {
|
7900
|
+
display: block;
|
7901
|
+
height: 20px;
|
7902
|
+
line-height: 20px;
|
7903
|
+
margin: 0px;
|
7904
|
+
box-sizing: border-box; }
|
7905
|
+
.form .radio-gray label .radio--icon,
|
7906
|
+
.form .radio-vimeo-blue label .radio--icon {
|
7907
|
+
position: relative;
|
7908
|
+
display: inline-block;
|
7909
|
+
width: 20px;
|
7910
|
+
height: 20px;
|
7911
|
+
margin-right: 5px;
|
7912
|
+
margin-left: 5px;
|
7913
|
+
float: left;
|
7914
|
+
border: 1px solid #5E7887;
|
7915
|
+
box-shadow: none;
|
7916
|
+
box-sizing: border-box;
|
7917
|
+
border-radius: 20px;
|
7918
|
+
transition: box-shadow .2s ease, color .2s ease; }
|
7919
|
+
.form .radio-gray label .radio--icon .circle-top,
|
7920
|
+
.form .radio-vimeo-blue label .radio--icon .circle-top {
|
7921
|
+
opacity: 0;
|
7922
|
+
transition: opacity .2s ease;
|
7923
|
+
display: block;
|
7924
|
+
height: 5px;
|
7925
|
+
overflow: hidden;
|
7926
|
+
position: absolute;
|
7927
|
+
top: 4px;
|
7928
|
+
left: 4px; }
|
7929
|
+
.form .radio-gray label .radio--icon .circle-top span,
|
7930
|
+
.form .radio-vimeo-blue label .radio--icon .circle-top span {
|
7931
|
+
display: block;
|
7932
|
+
width: 10px;
|
7933
|
+
height: 10px;
|
7934
|
+
background: #869AA5;
|
7935
|
+
border-radius: 10px; }
|
7936
|
+
.form .radio-gray label .radio--icon .circle-bottom,
|
7937
|
+
.form .radio-vimeo-blue label .radio--icon .circle-bottom {
|
7938
|
+
opacity: 0;
|
7939
|
+
transition: opacity .2s ease;
|
7940
|
+
display: block;
|
7941
|
+
height: 5px;
|
7942
|
+
overflow: hidden;
|
7943
|
+
position: absolute;
|
7944
|
+
bottom: 4px;
|
7945
|
+
left: 4px; }
|
7946
|
+
.form .radio-gray label .radio--icon .circle-bottom span,
|
7947
|
+
.form .radio-vimeo-blue label .radio--icon .circle-bottom span {
|
7948
|
+
position: relative;
|
7949
|
+
top: -5px;
|
7950
|
+
display: block;
|
7951
|
+
width: 10px;
|
7952
|
+
height: 10px;
|
7953
|
+
background: #5E7887;
|
7954
|
+
border-radius: 10px; }
|
7955
|
+
.form .radio-gray label .radio--label,
|
7956
|
+
.form .radio-vimeo-blue label .radio--label {
|
7957
|
+
float: left;
|
7958
|
+
height: 20px; }
|
7959
|
+
.form .radio-gray input[type="radio"]:checked + label .radio--icon .circle-top, .form .radio-gray input[type="radio"]:checked + label .radio--icon .circle-bottom,
|
7960
|
+
.form .radio-vimeo-blue input[type="radio"]:checked + label .radio--icon .circle-top,
|
7961
|
+
.form .radio-vimeo-blue input[type="radio"]:checked + label .radio--icon .circle-bottom {
|
7962
|
+
opacity: 1;
|
7963
|
+
transition: opacity .2s ease; }
|
7964
|
+
.form .radio-gray.radio--stacked, .form .radio-gray.radio--buttons,
|
7965
|
+
.form .radio-vimeo-blue.radio--stacked,
|
7966
|
+
.form .radio-vimeo-blue.radio--buttons {
|
7967
|
+
display: block;
|
7968
|
+
height: auto; }
|
7969
|
+
.form .radio-gray.radio--stacked li, .form .radio-gray.radio--buttons li,
|
7970
|
+
.form .radio-vimeo-blue.radio--stacked li,
|
7971
|
+
.form .radio-vimeo-blue.radio--buttons li {
|
7972
|
+
display: block;
|
7973
|
+
margin-right: 0px;
|
7974
|
+
margin-bottom: 10px; }
|
7975
|
+
.form .radio-gray.radio--buttons li,
|
7976
|
+
.form .radio-vimeo-blue.radio--buttons li {
|
7977
|
+
height: auto !important; }
|
7978
|
+
.form .radio-gray.radio--buttons li label,
|
7979
|
+
.form .radio-vimeo-blue.radio--buttons li label {
|
7980
|
+
padding: 10px;
|
7981
|
+
min-height: 58px; }
|
7982
|
+
.form .radio-gray.radio--buttons li .radio--label,
|
7983
|
+
.form .radio-gray.radio--buttons li label,
|
7984
|
+
.form .radio-vimeo-blue.radio--buttons li .radio--label,
|
7985
|
+
.form .radio-vimeo-blue.radio--buttons li label {
|
7986
|
+
height: auto !important; }
|
7987
|
+
.form .radio-gray.radio--buttons li .radio--icon,
|
7988
|
+
.form .radio-vimeo-blue.radio--buttons li .radio--icon {
|
7989
|
+
margin-top: 8px;
|
7990
|
+
background: white; }
|
7991
|
+
.form .radio-gray.radio-vimeo-blue .circle-top span,
|
7992
|
+
.form .radio-vimeo-blue.radio-vimeo-blue .circle-top span {
|
7993
|
+
background: #00adef !important; }
|
7994
|
+
.form .radio-gray.radio-vimeo-blue .circle-bottom span,
|
7995
|
+
.form .radio-vimeo-blue.radio-vimeo-blue .circle-bottom span {
|
7996
|
+
background: #0088cc !important; }
|