fomantic-ui-sass 2.9.0 → 2.9.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/fonts/semantic-ui/Lato-Bold.woff +0 -0
- data/app/assets/fonts/semantic-ui/Lato-Bold.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/Lato-BoldItalic.woff +0 -0
- data/app/assets/fonts/semantic-ui/Lato-BoldItalic.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/Lato-Italic.woff +0 -0
- data/app/assets/fonts/semantic-ui/Lato-Italic.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/Lato-Regular.woff +0 -0
- data/app/assets/fonts/semantic-ui/Lato-Regular.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-Bold.woff +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-Bold.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-BoldItalic.woff +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-BoldItalic.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-Italic.woff +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-Italic.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-Regular.woff +0 -0
- data/app/assets/fonts/semantic-ui/LatoLatin-Regular.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/brand-icons.woff +0 -0
- data/app/assets/fonts/semantic-ui/brand-icons.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/icons.woff +0 -0
- data/app/assets/fonts/semantic-ui/icons.woff2 +0 -0
- data/app/assets/fonts/semantic-ui/outline-icons.woff +0 -0
- data/app/assets/fonts/semantic-ui/outline-icons.woff2 +0 -0
- data/app/assets/javascripts/semantic-ui/accordion.js +569 -596
- data/app/assets/javascripts/semantic-ui/api.js +1158 -1180
- data/app/assets/javascripts/semantic-ui/calendar.js +1935 -1810
- data/app/assets/javascripts/semantic-ui/checkbox.js +843 -842
- data/app/assets/javascripts/semantic-ui/dimmer.js +707 -738
- data/app/assets/javascripts/semantic-ui/dropdown.js +4196 -4237
- data/app/assets/javascripts/semantic-ui/embed.js +646 -676
- data/app/assets/javascripts/semantic-ui/flyout.js +1515 -1466
- data/app/assets/javascripts/semantic-ui/form.js +2023 -2005
- data/app/assets/javascripts/semantic-ui/modal.js +1545 -1487
- data/app/assets/javascripts/semantic-ui/nag.js +521 -527
- data/app/assets/javascripts/semantic-ui/popup.js +1457 -1457
- data/app/assets/javascripts/semantic-ui/progress.js +970 -998
- data/app/assets/javascripts/semantic-ui/rating.js +508 -524
- data/app/assets/javascripts/semantic-ui/search.js +1521 -1535
- data/app/assets/javascripts/semantic-ui/shape.js +784 -811
- data/app/assets/javascripts/semantic-ui/sidebar.js +1062 -1100
- data/app/assets/javascripts/semantic-ui/site.js +437 -477
- data/app/assets/javascripts/semantic-ui/slider.js +1311 -1312
- data/app/assets/javascripts/semantic-ui/state.js +639 -658
- data/app/assets/javascripts/semantic-ui/sticky.js +848 -902
- data/app/assets/javascripts/semantic-ui/tab.js +903 -967
- data/app/assets/javascripts/semantic-ui/toast.js +911 -885
- data/app/assets/javascripts/semantic-ui/transition.js +1049 -1078
- data/app/assets/javascripts/semantic-ui/visibility.js +1214 -1246
- data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +7 -7
- data/app/assets/stylesheets/semantic-ui/collections/_form.scss +246 -341
- data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +185 -331
- data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +272 -433
- data/app/assets/stylesheets/semantic-ui/collections/_message.scss +127 -199
- data/app/assets/stylesheets/semantic-ui/collections/_table.scss +549 -776
- data/app/assets/stylesheets/semantic-ui/elements/_button.scss +711 -1123
- data/app/assets/stylesheets/semantic-ui/elements/_container.scss +9 -8
- data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +45 -63
- data/app/assets/stylesheets/semantic-ui/elements/_emoji.scss +3556 -3556
- data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +272 -270
- data/app/assets/stylesheets/semantic-ui/elements/_header.scss +120 -144
- data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +667 -747
- data/app/assets/stylesheets/semantic-ui/elements/_image.scss +41 -65
- data/app/assets/stylesheets/semantic-ui/elements/_input.scss +358 -276
- data/app/assets/stylesheets/semantic-ui/elements/_label.scss +361 -412
- data/app/assets/stylesheets/semantic-ui/elements/_list.scss +51 -72
- data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +69 -157
- data/app/assets/stylesheets/semantic-ui/elements/_placeholder.scss +24 -44
- data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +17 -22
- data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +46 -85
- data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +150 -226
- data/app/assets/stylesheets/semantic-ui/elements/_step.scss +79 -152
- data/app/assets/stylesheets/semantic-ui/elements/_text.scss +33 -33
- data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +10 -15
- data/app/assets/stylesheets/semantic-ui/globals/_site.scss +30 -43
- data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +37 -55
- data/app/assets/stylesheets/semantic-ui/modules/_calendar.scss +26 -29
- data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +122 -193
- data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +55 -174
- data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +254 -388
- data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +20 -31
- data/app/assets/stylesheets/semantic-ui/modules/_flyout.scss +97 -143
- data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +122 -156
- data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +55 -65
- data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +426 -204
- data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +108 -213
- data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +83 -124
- data/app/assets/stylesheets/semantic-ui/modules/_search.scss +71 -100
- data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +16 -32
- data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +105 -208
- data/app/assets/stylesheets/semantic-ui/modules/_slider.scss +93 -121
- data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +3 -7
- data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +12 -16
- data/app/assets/stylesheets/semantic-ui/modules/_toast.scss +71 -149
- data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +371 -1282
- data/app/assets/stylesheets/semantic-ui/views/_ad.scss +36 -47
- data/app/assets/stylesheets/semantic-ui/views/_card.scss +221 -367
- data/app/assets/stylesheets/semantic-ui/views/_comment.scss +43 -61
- data/app/assets/stylesheets/semantic-ui/views/_feed.scss +37 -59
- data/app/assets/stylesheets/semantic-ui/views/_item.scss +86 -133
- data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +77 -118
- data/lib/fomantic/ui/sass/version.rb +2 -2
- data/tasks/converter.rb +1 -1
- metadata +17 -1
@@ -1,10 +1,10 @@
|
|
1
1
|
/*!
|
2
|
-
* # Fomantic-UI 2.9.
|
3
|
-
*
|
2
|
+
* # Fomantic-UI 2.9.1 - Video
|
3
|
+
* https://github.com/fomantic/Fomantic-UI/
|
4
4
|
*
|
5
5
|
*
|
6
6
|
* Released under the MIT license
|
7
|
-
*
|
7
|
+
* https://opensource.org/licenses/MIT
|
8
8
|
*
|
9
9
|
*/
|
10
10
|
|
@@ -18,14 +18,13 @@
|
|
18
18
|
max-width: 100%;
|
19
19
|
height: 0;
|
20
20
|
overflow: hidden;
|
21
|
-
background: #
|
21
|
+
background: #dcddde;
|
22
22
|
padding-bottom: 56.25%;
|
23
23
|
}
|
24
24
|
|
25
|
-
|
25
|
+
/* -----------------
|
26
26
|
Embedded Content
|
27
|
-
|
28
|
-
|
27
|
+
------------------ */
|
29
28
|
.ui.embed iframe,
|
30
29
|
.ui.embed embed,
|
31
30
|
.ui.embed object {
|
@@ -40,18 +39,16 @@
|
|
40
39
|
overflow: hidden;
|
41
40
|
}
|
42
41
|
|
43
|
-
|
42
|
+
/* -----------------
|
44
43
|
Embed
|
45
|
-
|
46
|
-
|
44
|
+
------------------ */
|
47
45
|
.ui.embed > .embed {
|
48
46
|
display: none;
|
49
47
|
}
|
50
48
|
|
51
|
-
|
49
|
+
/* --------------
|
52
50
|
Placeholder
|
53
|
-
|
54
|
-
|
51
|
+
--------------- */
|
55
52
|
.ui.embed > .placeholder {
|
56
53
|
position: absolute;
|
57
54
|
cursor: pointer;
|
@@ -63,10 +60,9 @@
|
|
63
60
|
background-color: radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
64
61
|
}
|
65
62
|
|
66
|
-
|
63
|
+
/* --------------
|
67
64
|
Icon
|
68
|
-
|
69
|
-
|
65
|
+
--------------- */
|
70
66
|
.ui.embed > i.icon {
|
71
67
|
cursor: pointer;
|
72
68
|
position: absolute;
|
@@ -83,23 +79,19 @@
|
|
83
79
|
width: 100%;
|
84
80
|
height: 100%;
|
85
81
|
z-index: 3;
|
86
|
-
content:
|
87
|
-
background: -webkit-radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
82
|
+
content: "";
|
88
83
|
background: radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
89
84
|
opacity: 0.5;
|
90
|
-
-webkit-transition: opacity 0.5s ease;
|
91
85
|
transition: opacity 0.5s ease;
|
92
86
|
}
|
93
87
|
.ui.embed > i.icon::before {
|
94
88
|
position: absolute;
|
95
89
|
top: 50%;
|
96
90
|
left: 50%;
|
97
|
-
|
98
|
-
|
99
|
-
color: #FFFFFF;
|
91
|
+
transform: translateX(-50%) translateY(-50%);
|
92
|
+
color: #fff;
|
100
93
|
font-size: 6rem;
|
101
94
|
text-shadow: 0 2px 10px rgba(34, 36, 38, 0.2);
|
102
|
-
-webkit-transition: opacity 0.5s ease, color 0.5s ease;
|
103
95
|
transition: opacity 0.5s ease, color 0.5s ease;
|
104
96
|
z-index: 10;
|
105
97
|
}
|
@@ -110,23 +102,20 @@
|
|
110
102
|
*******************************/
|
111
103
|
|
112
104
|
|
113
|
-
|
105
|
+
/* --------------
|
114
106
|
Hover
|
115
|
-
|
116
|
-
|
107
|
+
--------------- */
|
117
108
|
.ui.embed i.icon:hover::after {
|
118
|
-
background: -webkit-radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
119
109
|
background: radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
120
110
|
opacity: 1;
|
121
111
|
}
|
122
112
|
.ui.embed i.icon:hover::before {
|
123
|
-
color: #
|
113
|
+
color: #fff;
|
124
114
|
}
|
125
115
|
|
126
|
-
|
116
|
+
/* --------------
|
127
117
|
Active
|
128
|
-
|
129
|
-
|
118
|
+
--------------- */
|
130
119
|
.ui.active.embed > i.icon,
|
131
120
|
.ui.active.embed > .placeholder {
|
132
121
|
display: none;
|
@@ -1,10 +1,10 @@
|
|
1
1
|
/*!
|
2
|
-
* # Fomantic-UI 2.9.
|
3
|
-
*
|
2
|
+
* # Fomantic-UI 2.9.1 - Flyout
|
3
|
+
* https://github.com/fomantic/Fomantic-UI/
|
4
4
|
*
|
5
5
|
*
|
6
6
|
* Released under the MIT license
|
7
|
-
*
|
7
|
+
* https://opensource.org/licenses/MIT
|
8
8
|
*
|
9
9
|
*/
|
10
10
|
|
@@ -21,13 +21,10 @@
|
|
21
21
|
left: 0;
|
22
22
|
-webkit-backface-visibility: hidden;
|
23
23
|
backface-visibility: hidden;
|
24
|
-
-webkit-transition: none;
|
25
24
|
transition: none;
|
26
25
|
will-change: transform;
|
27
|
-
|
28
|
-
transform: translate3d(0, 0, 0);
|
26
|
+
transform: translate3d(0, 0, 0);
|
29
27
|
visibility: hidden;
|
30
|
-
-webkit-overflow-scrolling: touch;
|
31
28
|
height: 100%;
|
32
29
|
max-height: 100%;
|
33
30
|
max-width: 100%;
|
@@ -35,7 +32,8 @@
|
|
35
32
|
margin: 0;
|
36
33
|
overflow-y: hidden;
|
37
34
|
z-index: 102;
|
38
|
-
background: #
|
35
|
+
background: #fff;
|
36
|
+
outline: none;
|
39
37
|
}
|
40
38
|
|
41
39
|
/* GPU Layers for Child Elements */
|
@@ -44,10 +42,9 @@
|
|
44
42
|
backface-visibility: hidden;
|
45
43
|
}
|
46
44
|
|
47
|
-
|
45
|
+
/* --------------
|
48
46
|
Close
|
49
|
-
|
50
|
-
|
47
|
+
--------------- */
|
51
48
|
.ui.flyout > .close {
|
52
49
|
cursor: pointer;
|
53
50
|
position: absolute;
|
@@ -69,55 +66,62 @@
|
|
69
66
|
outline: none;
|
70
67
|
}
|
71
68
|
|
72
|
-
|
69
|
+
/* --------------
|
73
70
|
Header
|
74
|
-
|
75
|
-
|
71
|
+
--------------- */
|
76
72
|
.ui.flyout > .header {
|
77
73
|
display: block;
|
78
|
-
background: #
|
74
|
+
background: #fff;
|
79
75
|
margin: 0;
|
80
76
|
padding: 1.25rem 1.5rem;
|
81
|
-
|
82
|
-
box-shadow: none;
|
77
|
+
box-shadow: none;
|
83
78
|
color: rgba(0, 0, 0, 0.85);
|
84
79
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
85
80
|
}
|
86
81
|
|
87
|
-
|
82
|
+
/* --------------
|
88
83
|
Content
|
89
|
-
|
90
|
-
|
84
|
+
--------------- */
|
91
85
|
.ui.flyout > .content {
|
92
86
|
display: block;
|
93
87
|
width: 100%;
|
94
88
|
font-size: 1em;
|
95
89
|
line-height: 1.4;
|
96
90
|
padding: 1.5rem;
|
97
|
-
background: #
|
91
|
+
background: #fff;
|
92
|
+
}
|
93
|
+
.ui.flyout > .content.scrolling {
|
94
|
+
overflow: auto;
|
95
|
+
-ms-scroll-chaining: none;
|
96
|
+
overscroll-behavior: none;
|
98
97
|
}
|
99
98
|
.ui.flyout.left > .content,
|
100
99
|
.ui.flyout.right > .content {
|
100
|
+
min-height: calc(100vh - 4.7rem);
|
101
|
+
}
|
102
|
+
.ui.flyout.left > .header + .content,
|
103
|
+
.ui.flyout.right > .header + .content {
|
101
104
|
min-height: calc(100vh - 9.1rem);
|
102
105
|
}
|
103
106
|
.ui.flyout.left > .scrolling.content,
|
104
107
|
.ui.flyout.right > .scrolling.content {
|
108
|
+
max-height: calc(100vh - 4.7rem);
|
109
|
+
}
|
110
|
+
.ui.flyout.left > .header + .scrolling.content,
|
111
|
+
.ui.flyout.right > .header + .scrolling.content {
|
105
112
|
max-height: calc(100vh - 9.1rem);
|
106
|
-
overflow: auto;
|
107
113
|
}
|
108
114
|
.ui.flyout.top > .scrolling.content,
|
109
115
|
.ui.flyout.bottom > .scrolling.content {
|
110
116
|
max-height: calc(80vh - 9.1rem);
|
111
|
-
overflow: auto;
|
112
117
|
}
|
113
118
|
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
119
|
+
/* --------------
|
120
|
+
Actions
|
121
|
+
--------------- */
|
118
122
|
.ui.flyout > .actions {
|
119
|
-
background: #
|
120
|
-
padding: 1rem
|
123
|
+
background: #f9fafb;
|
124
|
+
padding: 1rem;
|
121
125
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
122
126
|
text-align: right;
|
123
127
|
}
|
@@ -151,21 +155,18 @@
|
|
151
155
|
border-bottom: none;
|
152
156
|
}
|
153
157
|
|
154
|
-
|
158
|
+
/* --------------
|
155
159
|
Direction
|
156
|
-
|
157
|
-
|
160
|
+
--------------- */
|
158
161
|
.ui.left.flyout {
|
159
162
|
right: auto;
|
160
163
|
left: 0;
|
161
|
-
|
162
|
-
transform: translate3d(-100%, 0, 0);
|
164
|
+
transform: translate3d(-100%, 0, 0);
|
163
165
|
}
|
164
166
|
.ui.right.flyout {
|
165
167
|
right: 0;
|
166
168
|
left: auto;
|
167
|
-
|
168
|
-
transform: translate3d(100%, 0, 0);
|
169
|
+
transform: translate3d(100%, 0, 0);
|
169
170
|
}
|
170
171
|
.ui.top.flyout,
|
171
172
|
.ui.bottom.flyout {
|
@@ -175,20 +176,17 @@
|
|
175
176
|
.ui.top.flyout {
|
176
177
|
top: 0;
|
177
178
|
bottom: auto;
|
178
|
-
|
179
|
-
transform: translate3d(0, -100%, 0);
|
179
|
+
transform: translate3d(0, -100%, 0);
|
180
180
|
}
|
181
181
|
.ui.bottom.flyout {
|
182
182
|
top: auto;
|
183
183
|
bottom: 0;
|
184
|
-
|
185
|
-
transform: translate3d(0, 100%, 0);
|
184
|
+
transform: translate3d(0, 100%, 0);
|
186
185
|
}
|
187
186
|
|
188
|
-
|
187
|
+
/* --------------
|
189
188
|
Pushable
|
190
|
-
|
191
|
-
|
189
|
+
--------------- */
|
192
190
|
.pushable.pushable.pushable {
|
193
191
|
height: 100%;
|
194
192
|
overflow-x: hidden;
|
@@ -209,8 +207,7 @@ body.pushable.dimmed {
|
|
209
207
|
|
210
208
|
/* Page Context */
|
211
209
|
.pushable:not(body) {
|
212
|
-
|
213
|
-
transform: translate3d(0, 0, 0);
|
210
|
+
transform: translate3d(0, 0, 0);
|
214
211
|
overflow-y: hidden;
|
215
212
|
}
|
216
213
|
.pushable:not(body) > .ui.flyout,
|
@@ -219,35 +216,27 @@ body.pushable.dimmed {
|
|
219
216
|
position: absolute;
|
220
217
|
}
|
221
218
|
|
222
|
-
|
219
|
+
/* --------------
|
223
220
|
Fixed
|
224
|
-
|
225
|
-
|
221
|
+
--------------- */
|
226
222
|
.pushable > .fixed {
|
227
223
|
position: fixed;
|
228
224
|
-webkit-backface-visibility: hidden;
|
229
225
|
backface-visibility: hidden;
|
230
|
-
-webkit-transition: -webkit-transform 500ms ease;
|
231
|
-
transition: -webkit-transform 500ms ease;
|
232
226
|
transition: transform 500ms ease;
|
233
|
-
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
234
227
|
will-change: transform;
|
235
228
|
z-index: 101;
|
236
229
|
}
|
237
230
|
|
238
|
-
|
231
|
+
/* --------------
|
239
232
|
Page
|
240
|
-
|
241
|
-
|
233
|
+
--------------- */
|
242
234
|
.pushable > .pusher {
|
243
235
|
position: relative;
|
244
236
|
-webkit-backface-visibility: hidden;
|
245
237
|
backface-visibility: hidden;
|
246
238
|
min-height: 100%;
|
247
|
-
-webkit-transition: -webkit-transform 500ms ease;
|
248
|
-
transition: -webkit-transform 500ms ease;
|
249
239
|
transition: transform 500ms ease;
|
250
|
-
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
251
240
|
z-index: 2;
|
252
241
|
|
253
242
|
/* Pusher should inherit background from context */
|
@@ -257,31 +246,28 @@ body.pushable.dimmed {
|
|
257
246
|
overflow: hidden;
|
258
247
|
}
|
259
248
|
body.pushable > .pusher {
|
260
|
-
background: #
|
249
|
+
background: #fff;
|
261
250
|
}
|
262
251
|
|
263
|
-
|
252
|
+
/* --------------
|
264
253
|
Dimmer
|
265
|
-
|
266
|
-
|
254
|
+
--------------- */
|
267
255
|
.pushable > .pusher::after {
|
268
256
|
position: fixed;
|
269
257
|
top: 0;
|
270
258
|
right: 0;
|
271
|
-
content:
|
259
|
+
content: "";
|
272
260
|
background: rgba(0, 0, 0, 0.4);
|
273
261
|
overflow: hidden;
|
274
262
|
opacity: 0;
|
275
|
-
-webkit-transition: all 500ms;
|
276
263
|
transition: all 500ms;
|
277
264
|
will-change: opacity;
|
278
265
|
z-index: 1000;
|
279
266
|
}
|
280
267
|
|
281
|
-
|
268
|
+
/* --------------
|
282
269
|
Coupling
|
283
|
-
|
284
|
-
|
270
|
+
--------------- */
|
285
271
|
.ui.flyout.menu .item {
|
286
272
|
border-radius: 0 !important;
|
287
273
|
}
|
@@ -292,10 +278,9 @@ body.pushable > .pusher {
|
|
292
278
|
*******************************/
|
293
279
|
|
294
280
|
|
295
|
-
|
281
|
+
/* --------------
|
296
282
|
Dimmed
|
297
|
-
|
298
|
-
|
283
|
+
--------------- */
|
299
284
|
.pushable > .pusher.dimmed::after {
|
300
285
|
width: 100% !important;
|
301
286
|
height: 100% !important;
|
@@ -310,56 +295,47 @@ body.pushable > .pusher {
|
|
310
295
|
opacity: 0 !important;
|
311
296
|
}
|
312
297
|
|
313
|
-
|
298
|
+
/* --------------
|
314
299
|
Animating
|
315
|
-
|
316
|
-
|
300
|
+
--------------- */
|
317
301
|
.ui.animating.flyout {
|
318
302
|
visibility: visible;
|
319
303
|
}
|
320
304
|
|
321
|
-
|
305
|
+
/* --------------
|
322
306
|
Visible
|
323
|
-
|
324
|
-
|
307
|
+
--------------- */
|
325
308
|
.ui.visible.flyout {
|
326
309
|
visibility: visible;
|
327
|
-
|
328
|
-
transform: translate3d(0, 0, 0);
|
310
|
+
transform: translate3d(0, 0, 0);
|
329
311
|
}
|
330
312
|
|
331
313
|
/* Shadow Direction */
|
332
314
|
.ui.left.visible.flyout,
|
333
315
|
.ui.right.visible.flyout {
|
334
|
-
|
335
|
-
box-shadow: 0 0 20px rgba(34, 36, 38, 0.15);
|
316
|
+
box-shadow: 0 0 20px rgba(34, 36, 38, 0.15);
|
336
317
|
}
|
337
318
|
.ui.top.visible.flyout,
|
338
319
|
.ui.bottom.visible.flyout {
|
339
|
-
|
340
|
-
box-shadow: 0 0 20px rgba(34, 36, 38, 0.15);
|
320
|
+
box-shadow: 0 0 20px rgba(34, 36, 38, 0.15);
|
341
321
|
}
|
342
322
|
|
343
323
|
/* Visible On Load */
|
344
324
|
.ui.visible.left.flyout ~ .fixed,
|
345
325
|
.ui.visible.left.flyout ~ .pusher {
|
346
|
-
|
347
|
-
transform: translate3d(400px, 0, 0);
|
326
|
+
transform: translate3d(400px, 0, 0);
|
348
327
|
}
|
349
328
|
.ui.visible.right.flyout ~ .fixed,
|
350
329
|
.ui.visible.right.flyout ~ .pusher {
|
351
|
-
|
352
|
-
transform: translate3d(-400px, 0, 0);
|
330
|
+
transform: translate3d(-400px, 0, 0);
|
353
331
|
}
|
354
332
|
.ui.visible.top.flyout ~ .fixed,
|
355
333
|
.ui.visible.top.flyout ~ .pusher {
|
356
|
-
|
357
|
-
transform: translate3d(0, 36px, 0);
|
334
|
+
transform: translate3d(0, 36px, 0);
|
358
335
|
}
|
359
336
|
.ui.visible.bottom.flyout ~ .fixed,
|
360
337
|
.ui.visible.bottom.flyout ~ .pusher {
|
361
|
-
|
362
|
-
transform: translate3d(0, -36px, 0);
|
338
|
+
transform: translate3d(0, -36px, 0);
|
363
339
|
}
|
364
340
|
|
365
341
|
/* opposite sides visible forces content overlay */
|
@@ -367,29 +343,27 @@ body.pushable > .pusher {
|
|
367
343
|
.ui.visible.left.flyout ~ .ui.visible.right.flyout ~ .pusher,
|
368
344
|
.ui.visible.right.flyout ~ .ui.visible.left.flyout ~ .fixed,
|
369
345
|
.ui.visible.right.flyout ~ .ui.visible.left.flyout ~ .pusher {
|
370
|
-
|
371
|
-
transform: translate3d(0, 0, 0);
|
346
|
+
transform: translate3d(0, 0, 0);
|
372
347
|
}
|
373
348
|
|
374
|
-
|
375
|
-
|
376
|
-
|
377
|
-
|
349
|
+
/* --------------
|
350
|
+
Inverted
|
351
|
+
--------------- */
|
378
352
|
.ui.flyout.inverted {
|
379
|
-
background: #
|
353
|
+
background: #000;
|
380
354
|
}
|
381
355
|
.ui.flyout.inverted > .close {
|
382
|
-
color: #
|
356
|
+
color: #fff;
|
383
357
|
}
|
384
358
|
.ui.flyout.inverted > .header,
|
385
359
|
.ui.flyout.inverted > .content {
|
386
|
-
background: #
|
387
|
-
color: #
|
360
|
+
background: #000;
|
361
|
+
color: #fff;
|
388
362
|
}
|
389
363
|
.ui.flyout.inverted > .actions {
|
390
|
-
background: #
|
364
|
+
background: #191a1b;
|
391
365
|
border-top: 1px solid rgba(34, 36, 38, 0.85);
|
392
|
-
color: #
|
366
|
+
color: #fff;
|
393
367
|
}
|
394
368
|
|
395
369
|
|
@@ -398,10 +372,9 @@ body.pushable > .pusher {
|
|
398
372
|
*******************************/
|
399
373
|
|
400
374
|
|
401
|
-
|
375
|
+
/* --------------
|
402
376
|
Width
|
403
|
-
|
404
|
-
|
377
|
+
--------------- */
|
405
378
|
|
406
379
|
/* Left / Right */
|
407
380
|
.ui.left.flyout,
|
@@ -428,45 +401,37 @@ body.pushable > .pusher {
|
|
428
401
|
/* Left Visible */
|
429
402
|
.ui.visible.thin.left.flyout ~ .fixed,
|
430
403
|
.ui.visible.thin.left.flyout ~ .pusher {
|
431
|
-
|
432
|
-
transform: translate3d(200px, 0, 0);
|
404
|
+
transform: translate3d(200px, 0, 0);
|
433
405
|
}
|
434
406
|
.ui.visible[class*="very thin"].left.flyout ~ .fixed,
|
435
407
|
.ui.visible[class*="very thin"].left.flyout ~ .pusher {
|
436
|
-
|
437
|
-
transform: translate3d(120px, 0, 0);
|
408
|
+
transform: translate3d(120px, 0, 0);
|
438
409
|
}
|
439
410
|
.ui.visible.wide.left.flyout ~ .fixed,
|
440
411
|
.ui.visible.wide.left.flyout ~ .pusher {
|
441
|
-
|
442
|
-
transform: translate3d(600px, 0, 0);
|
412
|
+
transform: translate3d(600px, 0, 0);
|
443
413
|
}
|
444
414
|
.ui.visible[class*="very wide"].left.flyout ~ .fixed,
|
445
415
|
.ui.visible[class*="very wide"].left.flyout ~ .pusher {
|
446
|
-
|
447
|
-
transform: translate3d(800px, 0, 0);
|
416
|
+
transform: translate3d(800px, 0, 0);
|
448
417
|
}
|
449
418
|
|
450
419
|
/* Right Visible */
|
451
420
|
.ui.visible.thin.right.flyout ~ .fixed,
|
452
421
|
.ui.visible.thin.right.flyout ~ .pusher {
|
453
|
-
|
454
|
-
transform: translate3d(-200px, 0, 0);
|
422
|
+
transform: translate3d(-200px, 0, 0);
|
455
423
|
}
|
456
424
|
.ui.visible[class*="very thin"].right.flyout ~ .fixed,
|
457
425
|
.ui.visible[class*="very thin"].right.flyout ~ .pusher {
|
458
|
-
|
459
|
-
transform: translate3d(-120px, 0, 0);
|
426
|
+
transform: translate3d(-120px, 0, 0);
|
460
427
|
}
|
461
428
|
.ui.visible.wide.right.flyout ~ .fixed,
|
462
429
|
.ui.visible.wide.right.flyout ~ .pusher {
|
463
|
-
|
464
|
-
transform: translate3d(-600px, 0, 0);
|
430
|
+
transform: translate3d(-600px, 0, 0);
|
465
431
|
}
|
466
432
|
.ui.visible[class*="very wide"].right.flyout ~ .fixed,
|
467
433
|
.ui.visible[class*="very wide"].right.flyout ~ .pusher {
|
468
|
-
|
469
|
-
transform: translate3d(-800px, 0, 0);
|
434
|
+
transform: translate3d(-800px, 0, 0);
|
470
435
|
}
|
471
436
|
|
472
437
|
/* Fullscreen */
|
@@ -474,10 +439,9 @@ body.pushable > .pusher {
|
|
474
439
|
width: 100%;
|
475
440
|
}
|
476
441
|
|
477
|
-
|
478
|
-
|
479
|
-
|
480
|
-
|
442
|
+
/* -------------------
|
443
|
+
Column Width
|
444
|
+
-------------------- */
|
481
445
|
|
482
446
|
/* Sizing Combinations */
|
483
447
|
.ui[class*="one wide"].flyout:not(.fullscreen) {
|
@@ -535,10 +499,9 @@ body.pushable > .pusher {
|
|
535
499
|
*******************************/
|
536
500
|
|
537
501
|
|
538
|
-
|
539
|
-
|
540
|
-
|
541
|
-
|
502
|
+
/* --------------
|
503
|
+
Overlay
|
504
|
+
--------------- */
|
542
505
|
|
543
506
|
/* Set-up */
|
544
507
|
.ui.overlay.flyout {
|
@@ -547,42 +510,33 @@ body.pushable > .pusher {
|
|
547
510
|
|
548
511
|
/* Initial */
|
549
512
|
.ui.left.overlay.flyout {
|
550
|
-
|
551
|
-
transform: translate3d(-100%, 0, 0);
|
513
|
+
transform: translate3d(-100%, 0, 0);
|
552
514
|
}
|
553
515
|
.ui.right.overlay.flyout {
|
554
|
-
|
555
|
-
transform: translate3d(100%, 0, 0);
|
516
|
+
transform: translate3d(100%, 0, 0);
|
556
517
|
}
|
557
518
|
.ui.top.overlay.flyout {
|
558
|
-
|
559
|
-
transform: translate3d(0%, -100%, 0);
|
519
|
+
transform: translate3d(0, -100%, 0);
|
560
520
|
}
|
561
521
|
.ui.bottom.overlay.flyout {
|
562
|
-
|
563
|
-
transform: translate3d(0%, 100%, 0);
|
522
|
+
transform: translate3d(0, 100%, 0);
|
564
523
|
}
|
565
524
|
|
566
525
|
/* Animation */
|
567
526
|
.animating.ui.overlay.flyout,
|
568
527
|
.ui.visible.overlay.flyout {
|
569
|
-
-webkit-transition: -webkit-transform 500ms ease;
|
570
|
-
transition: -webkit-transform 500ms ease;
|
571
528
|
transition: transform 500ms ease;
|
572
|
-
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
573
529
|
}
|
574
530
|
|
575
531
|
/* End - flyout */
|
576
532
|
.ui.visible.overlay.flyout {
|
577
|
-
|
578
|
-
transform: translate3d(0%, 0, 0);
|
533
|
+
transform: translate3d(0, 0, 0);
|
579
534
|
}
|
580
535
|
|
581
536
|
/* End - Pusher */
|
582
537
|
.ui.visible.overlay.flyout ~ .fixed,
|
583
538
|
.ui.visible.overlay.flyout ~ .pusher {
|
584
|
-
|
585
|
-
transform: none !important;
|
539
|
+
transform: none !important;
|
586
540
|
}
|
587
541
|
|
588
542
|
|