semantic-ui-sass 0.8.1.0 → 0.8.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +8 -0
  3. data/README.md +1 -1
  4. data/app/assets/javascripts/semantic-ui/dimmer.js +4 -2
  5. data/app/assets/javascripts/semantic-ui/modal.js +11 -6
  6. data/app/assets/javascripts/semantic-ui/popup.js +0 -1
  7. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +6 -2
  8. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +56 -73
  9. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +89 -53
  10. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +221 -316
  11. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +43 -88
  12. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +83 -23
  13. data/app/assets/stylesheets/semantic-ui/elements/_basic.icon.scss +831 -187
  14. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +189 -191
  15. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +4 -22
  16. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +43 -20
  17. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +1529 -472
  18. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +145 -152
  19. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +36 -63
  20. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +120 -175
  21. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +13 -11
  22. data/app/assets/stylesheets/semantic-ui/elements/_progress.scss +33 -115
  23. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +46 -101
  24. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +35 -65
  25. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +127 -170
  26. data/app/assets/stylesheets/semantic-ui/modules/_chatroom.scss +287 -269
  27. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +42 -129
  28. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +16 -49
  29. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +54 -107
  30. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +29 -22
  31. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +112 -147
  32. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +226 -230
  33. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +20 -28
  34. data/app/assets/stylesheets/semantic-ui/modules/_reveal.scss +35 -78
  35. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +27 -44
  36. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +10 -41
  37. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +31 -60
  38. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +3 -3
  39. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +219 -451
  40. data/app/assets/stylesheets/semantic-ui/modules/_video.scss +75 -79
  41. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +21 -23
  42. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +20 -8
  43. data/app/assets/stylesheets/semantic-ui/views/_item.scss +86 -43
  44. data/app/assets/stylesheets/semantic-ui/views/_list.scss +80 -53
  45. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +6 -1
  46. data/lib/semantic/ui/sass/version.rb +2 -2
  47. data/semantic-ui-sass.gemspec +1 -1
  48. data/spec/dummy/config/application.rb +1 -1
  49. data/spec/spec_helper.rb +0 -1
  50. data/tasks/converter.rb +7 -0
  51. metadata +4 -7
  52. data/spec/dummy/config/database.yml +0 -25
@@ -9,7 +9,6 @@
9
9
  *
10
10
  */
11
11
 
12
-
13
12
  /*******************************
14
13
  Segment
15
14
  *******************************/
@@ -17,21 +16,15 @@
17
16
  .ui.segment {
18
17
  position: relative;
19
18
  background-color: #FFFFFF;
20
-
19
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
21
20
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
22
-
23
21
  margin: 1em 0em;
24
22
  padding: 1em;
25
-
26
- -webkit-border-radius: 5px 5px 5px 5px;
27
- -moz-border-radius: 5px 5px 5px 5px;
28
23
  border-radius: 5px 5px 5px 5px;
29
-
30
24
  -webkit-box-sizing: border-box;
31
25
  -moz-box-sizing: border-box;
32
26
  -ms-box-sizing: border-box;
33
27
  box-sizing: border-box;
34
-
35
28
  }
36
29
 
37
30
  .ui.segment:first-child {
@@ -54,23 +47,12 @@
54
47
  margin: 0em;
55
48
  padding-left: 0em;
56
49
  padding-right: 0em;
57
-
58
50
  background-color: transparent;
59
-
60
- -webkit-border-radius: 0px;
61
- -moz-border-radius: 0px;
62
51
  border-radius: 0px;
63
-
64
- -webkit-box-shadow:
65
- 0px 1px 0px rgba(0, 0, 0, 0.1)
66
- ;
67
- -moz-box-shadow:
68
- 0px 1px 0px rgba(0, 0, 0, 0.1)
69
- ;
70
- box-shadow:
71
- 0px 1px 0px rgba(0, 0, 0, 0.1)
72
- ;
52
+ -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1);
53
+ box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1);
73
54
  }
55
+
74
56
  .ui.vertical.segment:first-child {
75
57
  padding-top: 0em;
76
58
  }
@@ -79,23 +61,12 @@
79
61
  margin: 0em;
80
62
  padding-top: 0em;
81
63
  padding-bottom: 0em;
82
-
83
64
  background-color: transparent;
84
-
85
- -webkit-border-radius: 0px;
86
- -moz-border-radius: 0px;
87
65
  border-radius: 0px;
88
-
89
- -webkit-box-shadow:
90
- 1px 0px 0px rgba(0, 0, 0, 0.1)
91
- ;
92
- -moz-box-shadow:
93
- 1px 0px 0px rgba(0, 0, 0, 0.1)
94
- ;
95
- box-shadow:
96
- 1px 0px 0px rgba(0, 0, 0, 0.1)
97
- ;
66
+ -webkit-box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1);
67
+ box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1);
98
68
  }
69
+
99
70
  .ui.horizontal.segment:first-child {
100
71
  padding-left: 0em;
101
72
  }
@@ -109,9 +80,11 @@
109
80
  }
110
81
 
111
82
  /* No padding on edge content */
83
+
112
84
  .ui.segment > :first-child {
113
85
  margin-top: 0em;
114
86
  }
87
+
115
88
  .ui.segment > :last-child {
116
89
  margin-bottom: 0em;
117
90
  }
@@ -126,28 +99,20 @@
126
99
 
127
100
  .ui.piled.segment {
128
101
  margin: 2em 0em;
129
- -webkit-box-shadow:
130
- 0px 0px 1px 1px rgba(0, 0, 0, 0.15)
131
- ;
132
- -moz-box-shadow:
133
- 0px 0px 1px 1px rgba(0, 0, 0, 0.15)
134
- ;
135
- -ms-box-shadow:
136
- 0px 0px 1px 1px rgba(0, 0, 0, 0.15)
137
- ;
138
- -o-box-shadow:
139
- 0px 0px 1px 1px rgba(0, 0, 0, 0.15)
140
- ;
141
- box-shadow:
142
- 0px 0px 1px 1px rgba(0, 0, 0, 0.15)
143
- ;
102
+ -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15);
103
+ -ms-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15);
104
+ -o-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15);
105
+ box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15);
144
106
  }
107
+
145
108
  .ui.piled.segment:first-child {
146
109
  margin-top: 0em;
147
110
  }
111
+
148
112
  .ui.piled.segment:last-child {
149
113
  margin-bottom: 0em;
150
114
  }
115
+
151
116
  .ui.piled.segment:after,
152
117
  .ui.piled.segment:before {
153
118
  background-color: #FFFFFF;
@@ -158,31 +123,21 @@
158
123
  left: -1px;
159
124
  position: absolute;
160
125
  width: 100%;
161
-
162
- -webkit-box-shadow:
163
- 0px 0px 1px 1px rgba(0, 0, 0, 0.1)
164
- ;
165
- -moz-box-shadow:
166
- 0px 0px 1px 1px rgba(0, 0, 0, 0.1)
167
- ;
168
- box-shadow:
169
- 0px 0px 1px 1px rgba(0, 0, 0, 0.1)
170
- ;
126
+ -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1);
127
+ box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1);
171
128
  }
129
+
172
130
  .ui.piled.segment:after {
173
131
  -webkit-transform: rotate(1.2deg);
174
- -moz-transform: rotate(1.2deg);
175
132
  -ms-transform: rotate(1.2deg);
176
- -o-transform: rotate(1.2deg);
177
133
  transform: rotate(1.2deg);
178
134
  top: 0;
179
135
  z-index: -1;
180
136
  }
137
+
181
138
  .ui.piled.segment:before {
182
139
  -webkit-transform: rotate(-1.2deg);
183
- -moz-transform: rotate(-1.2deg);
184
140
  -ms-transform: rotate(-1.2deg);
185
- -o-transform: rotate(-1.2deg);
186
141
  transform: rotate(-1.2deg);
187
142
  top: 0;
188
143
  z-index: -2;
@@ -195,25 +150,26 @@
195
150
  .ui.stacked.segment {
196
151
  padding-bottom: 1.7em;
197
152
  }
153
+
198
154
  .ui.stacked.segment:after,
199
155
  .ui.stacked.segment:before {
200
156
  content: '';
201
157
  position: absolute;
202
158
  bottom: -3px;
203
159
  left: 0%;
204
-
205
160
  border-top: 1px solid rgba(0, 0, 0, 0.1);
206
161
  background-color: rgba(0, 0, 0, 0.02);
207
-
208
162
  width: 100%;
209
163
  height: 5px;
210
164
  visibility: visible;
211
165
  }
166
+
212
167
  .ui.stacked.segment:before {
213
168
  bottom: 0px;
214
169
  }
215
170
 
216
171
  /* Inverted */
172
+
217
173
  .ui.stacked.inverted.segment:after,
218
174
  .ui.stacked.inverted.segment:before {
219
175
  background-color: rgba(255, 255, 255, 0.1);
@@ -226,11 +182,9 @@
226
182
 
227
183
  .ui.raised.segment {
228
184
  -webkit-box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
229
- -moz-box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
230
185
  box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
231
186
  }
232
187
 
233
-
234
188
  /*******************************
235
189
  States
236
190
  *******************************/
@@ -240,12 +194,10 @@
240
194
  color: #DDDDDD;
241
195
  }
242
196
 
243
-
244
197
  /*******************************
245
198
  Variations
246
199
  *******************************/
247
200
 
248
-
249
201
  /*-------------------
250
202
  Basic
251
203
  --------------------*/
@@ -253,23 +205,19 @@
253
205
  .ui.basic.segment {
254
206
  position: relative;
255
207
  background-color: transparent;
256
-
257
208
  -webkit-box-shadow: none;
258
- -moz-box-shadow: none;
259
209
  box-shadow: none;
260
-
261
- -webkit-border-radius: 0px;
262
- -moz-border-radius: 0px;
263
210
  border-radius: 0px;
264
211
  }
212
+
265
213
  .ui.basic.segment:first-child {
266
214
  padding-top: 0em;
267
215
  }
216
+
268
217
  .ui.basic.segment:last-child {
269
218
  padding-bottom: 0em;
270
219
  }
271
220
 
272
-
273
221
  /*-------------------
274
222
  Fittted
275
223
  --------------------*/
@@ -278,7 +226,6 @@
278
226
  padding: 0em;
279
227
  }
280
228
 
281
-
282
229
  /*-------------------
283
230
  Colors
284
231
  --------------------*/
@@ -286,18 +233,23 @@
286
233
  .ui.blue.segment {
287
234
  border-top: 0.2em solid #6ECFF5;
288
235
  }
236
+
289
237
  .ui.green.segment {
290
238
  border-top: 0.2em solid #A1CF64;
291
239
  }
240
+
292
241
  .ui.red.segment {
293
242
  border-top: 0.2em solid #D95C5C;
294
243
  }
244
+
295
245
  .ui.orange.segment {
296
246
  border-top: 0.2em solid #F05940;
297
247
  }
248
+
298
249
  .ui.purple.segment {
299
250
  border-top: 0.2em solid #564F8A;
300
251
  }
252
+
301
253
  .ui.teal.segment {
302
254
  border-top: 0.2em solid #00B5AD;
303
255
  }
@@ -310,32 +262,37 @@
310
262
  background-color: #5C6166 !important;
311
263
  color: #FFFFFF !important;
312
264
  }
265
+
313
266
  .ui.inverted.blue.segment {
314
267
  background-color: #6ECFF5 !important;
315
268
  color: #FFFFFF !important;
316
269
  }
270
+
317
271
  .ui.inverted.green.segment {
318
272
  background-color: #A1CF64 !important;
319
273
  color: #FFFFFF !important;
320
274
  }
275
+
321
276
  .ui.inverted.red.segment {
322
277
  background-color: #D95C5C !important;
323
278
  color: #FFFFFF !important;
324
279
  }
280
+
325
281
  .ui.inverted.orange.segment {
326
282
  background-color: #F05940 !important;
327
283
  color: #FFFFFF !important;
328
284
  }
285
+
329
286
  .ui.inverted.purple.segment {
330
287
  background-color: #564F8A !important;
331
288
  color: #FFFFFF !important;
332
289
  }
290
+
333
291
  .ui.inverted.teal.segment {
334
292
  background-color: #00B5AD !important;
335
293
  color: #FFFFFF !important;
336
294
  }
337
295
 
338
-
339
296
  /*-------------------
340
297
  Aligned
341
298
  --------------------*/
@@ -343,9 +300,11 @@
343
300
  .ui.left.aligned.segment {
344
301
  text-align: left;
345
302
  }
303
+
346
304
  .ui.right.aligned.segment {
347
305
  text-align: right;
348
306
  }
307
+
349
308
  .ui.center.aligned.segment {
350
309
  text-align: center;
351
310
  }
@@ -358,11 +317,11 @@
358
317
  .ui.left.floated.segment {
359
318
  float: left;
360
319
  }
320
+
361
321
  .ui.right.floated.segment {
362
322
  float: right;
363
323
  }
364
324
 
365
-
366
325
  /*-------------------
367
326
  Inverted
368
327
  --------------------*/
@@ -370,9 +329,9 @@
370
329
  .ui.inverted.segment {
371
330
  border: none;
372
331
  -webkit-box-shadow: none;
373
- -moz-box-shadow: none;
374
332
  box-shadow: none;
375
333
  }
334
+
376
335
  .ui.inverted.segment,
377
336
  .ui.primary.inverted.segment {
378
337
  background-color: #222222;
@@ -402,22 +361,20 @@
402
361
  background-color: #555555;
403
362
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.3)));
404
363
  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%);
405
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%);
406
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%);
364
+ background-image: -webkit-gradient(linear, top left, bottom left, from(rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.3)));
407
365
  background-image: linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%);
408
366
  color: #FAFAFA;
409
367
  }
368
+
410
369
  .ui.tertiary.inverted.segment {
411
370
  background-color: #555555;
412
371
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 0.6)));
413
372
  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%);
414
- background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%);
415
- background-image: -o-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%);
373
+ background-image: -webkit-gradient(linear, top left, bottom left, from(rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 0.6)));
416
374
  background-image: linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%);
417
375
  color: #EEEEEE;
418
376
  }
419
377
 
420
-
421
378
  /*-------------------
422
379
  Attached
423
380
  --------------------*/
@@ -425,36 +382,24 @@
425
382
  .ui.segment.attached {
426
383
  top: -1px;
427
384
  bottom: -1px;
428
-
429
- -moz-border-radius: 0px;
430
- -webkit-border-radius: 0px;
431
385
  border-radius: 0px;
432
-
433
386
  margin: 0em;
434
-
435
- -moz-box-shadow: 0px 0px 0px 1px #DDDDDD;
436
387
  -webkit-box-shadow: 0px 0px 0px 1px #DDDDDD;
437
388
  box-shadow: 0px 0px 0px 1px #DDDDDD;
438
389
  }
390
+
439
391
  .ui.top.attached.segment {
440
392
  top: 0px;
441
393
  bottom: -1px;
442
-
443
394
  margin-top: 1em;
444
395
  margin-bottom: 0em;
445
-
446
- -moz-border-radius: 5px 5px 0px 0px;
447
- -webkit-border-radius: 5px 5px 0px 0px;
448
396
  border-radius: 5px 5px 0px 0px;
449
397
  }
398
+
450
399
  .ui.segment.bottom.attached {
451
400
  top: -1px;
452
401
  bottom: 0px;
453
-
454
402
  margin-top: 0em;
455
403
  margin-bottom: 1em;
456
-
457
- -moz-border-radius: 0px 0px 5px 5px;
458
- -webkit-border-radius: 0px 0px 5px 5px;
459
404
  border-radius: 0px 0px 5px 5px;
460
- }
405
+ }
@@ -18,16 +18,15 @@
18
18
  display: inline-block;
19
19
  position: relative;
20
20
  padding: 1em 2em 1em 3em;
21
-
22
21
  vertical-align: top;
23
22
  background-color: #FFFFFF;
24
23
  color: #888888;
25
-
26
24
  -webkit-box-sizing: border-box;
27
25
  -moz-box-sizing: border-box;
28
26
  -ms-box-sizing: border-box;
29
27
  box-sizing: border-box;
30
28
  }
29
+
31
30
  .ui.step:after,
32
31
  .ui.steps .step:after {
33
32
  position: absolute;
@@ -35,11 +34,9 @@
35
34
  content: '';
36
35
  top: 0em;
37
36
  right: -1.45em;
38
-
39
37
  border-bottom: 1.5em solid transparent;
40
38
  border-left: 1.5em solid #FFFFFF;
41
39
  border-top: 1.5em solid transparent;
42
-
43
40
  width: 0em;
44
41
  height: 0em;
45
42
  }
@@ -47,31 +44,12 @@
47
44
  .ui.step,
48
45
  .ui.steps .step,
49
46
  .ui.steps .step:after {
50
- -webkit-transition:
51
- opacity 0.1s ease,
52
- color 0.1s ease,
53
- box-shadow 0.1s ease
54
- ;
55
- -moz-transition:
56
- opacity 0.1s ease,
57
- color 0.1s ease,
58
- box-shadow 0.1s ease
59
- ;
60
- -o-transition:
61
- opacity 0.1s ease,
47
+ -webkit-transition: opacity 0.1s ease,
62
48
  color 0.1s ease,
63
- box-shadow 0.1s ease
64
- ;
65
- -ms-transition:
66
- opacity 0.1s ease,
49
+ -webkit-box-shadow 0.1s ease;
50
+ transition: opacity 0.1s ease,
67
51
  color 0.1s ease,
68
- box-shadow 0.1s ease
69
- ;
70
- transition:
71
- opacity 0.1s ease,
72
- color 0.1s ease,
73
- box-shadow 0.1s ease
74
- ;
52
+ box-shadow 0.1s ease;
75
53
  }
76
54
 
77
55
  /*******************************
@@ -82,58 +60,49 @@
82
60
  cursor: pointer;
83
61
  display: inline-block;
84
62
  font-size: 0em;
85
-
86
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
87
63
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
88
64
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
89
-
90
65
  line-height: 1;
91
-
92
66
  -webkit-box-sizing: border-box;
93
67
  -moz-box-sizing: border-box;
94
68
  -ms-box-sizing: border-box;
95
69
  box-sizing: border-box;
96
-
97
- -moz-border-radius: 0.3125rem;
98
- -webkit-border-radius: 0.3125rem;
99
70
  border-radius: 0.3125rem;
100
71
  }
101
72
 
102
73
  .ui.steps .step:first-child {
103
74
  padding-left: 1.35em;
104
- -webkit-border-radius: 0.3125em 0em 0em 0.3125em;
105
- -moz-border-radius: 0.3125em 0em 0em 0.3125em;
106
75
  border-radius: 0.3125em 0em 0em 0.3125em;
107
76
  }
77
+
108
78
  .ui.steps .step:last-child {
109
- -webkit-border-radius: 0em 0.3125em 0.3125em 0em;
110
- -moz-border-radius: 0em 0.3125em 0.3125em 0em;
111
79
  border-radius: 0em 0.3125em 0.3125em 0em;
112
80
  }
81
+
113
82
  .ui.steps .step:only-child {
114
- -webkit-border-radius: 0.3125em;
115
- -moz-border-radius: 0.3125em;
116
83
  border-radius: 0.3125em;
117
84
  }
118
85
 
119
86
  .ui.steps .step:last-child {
120
87
  margin-right: 0em;
121
88
  }
89
+
122
90
  .ui.steps .step:last-child:after {
123
91
  display: none;
124
92
  }
125
93
 
126
-
127
94
  /*******************************
128
95
  States
129
96
  *******************************/
130
97
 
131
98
  /* Hover */
99
+
132
100
  .ui.step:hover,
133
101
  .ui.step.hover {
134
102
  background-color: #F7F7F7;
135
103
  color: rgba(0, 0, 0, 0.8);
136
104
  }
105
+
137
106
  .ui.steps .step.hover:after,
138
107
  .ui.steps .step:hover:after,
139
108
  .ui.step:hover,
@@ -142,12 +111,14 @@
142
111
  }
143
112
 
144
113
  /* Hover */
114
+
145
115
  .ui.steps .step.down,
146
116
  .ui.steps .step:active,
147
117
  .ui.step.down,
148
- .ui.step:active {
118
+ .ui.step:active {
149
119
  background-color: #F0F0F0;
150
120
  }
121
+
151
122
  .ui.steps .step.down:after,
152
123
  .ui.steps .step:active:after,
153
124
  .ui.steps.down::after,
@@ -156,43 +127,40 @@
156
127
  }
157
128
 
158
129
  /* Active */
130
+
159
131
  .ui.steps .step.active,
160
132
  .ui.active.step {
161
133
  cursor: auto;
162
134
  background-color: #555555;
163
-
164
135
  color: #FFFFFF;
165
136
  font-weight: bold;
166
137
  }
138
+
167
139
  .ui.steps .step.active:after,
168
140
  .ui.active.steps:after {
169
141
  border-left-color: #555555;
170
142
  }
171
143
 
172
144
  /* Disabled */
145
+
173
146
  .ui.steps .disabled.step,
174
147
  .ui.disabled.step {
175
148
  cursor: auto;
176
149
  background-color: #FFFFFF;
177
150
  color: #CBCBCB;
178
151
  }
152
+
179
153
  .ui.disabled.step:after {
180
154
  border: none;
181
155
  background-color: #FFFFFF;
182
156
  top: 0.42em;
183
157
  right: -1em;
184
-
185
158
  width: 2.15em;
186
159
  height: 2.15em;
187
-
188
160
  -webkit-transform: rotate(-45deg);
189
- -moz-transform: rotate(-45deg);
190
- -o-transform: rotate(-45deg);
191
161
  -ms-transform: rotate(-45deg);
192
162
  transform: rotate(-45deg);
193
-
194
163
  -webkit-box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
195
- -moz-box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
196
164
  box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
197
165
  }
198
166
 
@@ -201,43 +169,37 @@
201
169
  *******************************/
202
170
 
203
171
  /* Attached */
172
+
204
173
  .attached.ui.steps {
205
174
  margin: 0em;
206
- -webkit-border-radius: 0.3125em 0.3125em 0em 0em;
207
- -moz-border-radius: 0.3125em 0.3125em 0em 0em;
208
175
  border-radius: 0.3125em 0.3125em 0em 0em;
209
176
  }
177
+
210
178
  .attached.ui.steps .step:first-child {
211
- -webkit-border-radius: 0.3125em 0em 0em 0em;
212
- -moz-border-radius: 0.3125em 0em 0em 0em;
213
179
  border-radius: 0.3125em 0em 0em 0em;
214
180
  }
181
+
215
182
  .attached.ui.steps .step:last-child {
216
- -webkit-border-radius: 0em 0.3125em 0em 0em;
217
- -moz-border-radius: 0em 0.3125em 0em 0em;
218
183
  border-radius: 0em 0.3125em 0em 0em;
219
184
  }
220
185
 
221
186
  /* Bottom Side */
187
+
222
188
  .bottom.attached.ui.steps {
223
189
  margin-top: -1px;
224
- -webkit-border-radius: 0em 0em 0.3125em 0.3125em;
225
- -moz-border-radius: 0em 0em 0.3125em 0.3125em;
226
190
  border-radius: 0em 0em 0.3125em 0.3125em;
227
191
  }
192
+
228
193
  .bottom.attached.ui.steps .step:first-child {
229
- -webkit-border-radius: 0em 0em 0em 0.3125em;
230
- -moz-border-radius: 0em 0em 0em 0.3125em;
231
194
  border-radius: 0em 0em 0em 0.3125em;
232
195
  }
196
+
233
197
  .bottom.attached.ui.steps .step:last-child {
234
- -webkit-border-radius: 0em 0em 0.3125em 0em;
235
- -moz-border-radius: 0em 0em 0.3125em 0em;
236
198
  border-radius: 0em 0em 0.3125em 0em;
237
199
  }
238
200
 
239
-
240
201
  /* Evenly divided */
202
+
241
203
  .ui.one.steps,
242
204
  .ui.two.steps,
243
205
  .ui.three.steps,
@@ -248,33 +210,39 @@
248
210
  .ui.eight.steps {
249
211
  display: block;
250
212
  }
213
+
251
214
  .ui.one.steps > .step {
252
215
  width: 100%;
253
216
  }
217
+
254
218
  .ui.two.steps > .step {
255
219
  width: 50%;
256
220
  }
221
+
257
222
  .ui.three.steps > .step {
258
223
  width: 33.333%;
259
224
  }
225
+
260
226
  .ui.four.steps > .step {
261
227
  width: 25%;
262
228
  }
229
+
263
230
  .ui.five.steps > .step {
264
231
  width: 20%;
265
232
  }
233
+
266
234
  .ui.six.steps > .step {
267
235
  width: 16.666%;
268
236
  }
237
+
269
238
  .ui.seven.steps > .step {
270
239
  width: 14.285%;
271
240
  }
241
+
272
242
  .ui.eight.steps > .step {
273
243
  width: 12.500%;
274
244
  }
275
245
 
276
-
277
-
278
246
  /*******************************
279
247
  Sizes
280
248
  *******************************/
@@ -283,11 +251,13 @@
283
251
  .ui.small.steps .step {
284
252
  font-size: 0.8rem;
285
253
  }
254
+
286
255
  .ui.step,
287
256
  .ui.steps .step {
288
257
  font-size: 1rem;
289
258
  }
259
+
290
260
  .ui.large.step,
291
261
  .ui.large.steps .step {
292
262
  font-size: 1.25rem;
293
- }
263
+ }