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,27 +9,23 @@
9
9
  *
10
10
  */
11
11
 
12
-
13
12
  /*******************************
14
13
  Button
15
14
  *******************************/
16
15
 
17
16
  /* Prototype */
17
+
18
18
  .ui.button {
19
19
  cursor: pointer;
20
20
  display: inline-block;
21
21
  vertical-align: middle;
22
-
23
22
  min-height: 1em;
24
-
25
23
  outline: none;
26
24
  border: none;
27
25
  background-color: #FAFAFA;
28
26
  color: #808080;
29
-
30
27
  margin: 0em;
31
28
  padding: 0.8em 1.5em 0.875em;
32
-
33
29
  font-size: 1rem;
34
30
  text-transform: uppercase;
35
31
  line-height: 1;
@@ -37,75 +33,39 @@
37
33
  font-style: normal;
38
34
  text-align: center;
39
35
  text-decoration: none;
40
-
36
+ background-image: -webkit-gradient(linear, top left, bottom left, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.05)));
37
+ background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05));
41
38
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05));
42
-
43
- -webkit-border-radius: 0.25em;
44
- -moz-border-radius: 0.25em;
45
39
  border-radius: 0.25em;
46
-
47
- box-shadow:
48
- 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
49
- 0px -0.133em 0px 0px rgba(0, 0, 0, 0.1) inset
50
- ;
51
-
40
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
41
+ 0px -0.133em 0px 0px rgba(0, 0, 0, 0.1) inset;
42
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset,
43
+ 0px -0.133em 0px 0px rgba(0, 0, 0, 0.1) inset;
52
44
  -webkit-user-select: none;
53
45
  -moz-user-select: none;
54
46
  -ms-user-select: none;
55
47
  user-select: none;
56
-
57
48
  -webkit-box-sizing: border-box;
58
49
  -moz-box-sizing: border-box;
59
50
  -ms-box-sizing: border-box;
60
51
  box-sizing: border-box;
61
-
62
52
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
63
-
64
- -webkit-transition:
65
- opacity 0.25s ease,
53
+ -webkit-transition: opacity 0.25s ease,
66
54
  background-color 0.25s ease,
67
55
  color 0.25s ease,
68
56
  background 0.25s ease,
69
- box-shadow 0.25s ease
70
- ;
71
- -moz-transition:
72
- opacity 0.25s ease,
57
+ -webkit-box-shadow 0.25s ease;
58
+ transition: opacity 0.25s ease,
73
59
  background-color 0.25s ease,
74
60
  color 0.25s ease,
75
61
  background 0.25s ease,
76
- box-shadow 0.25s ease
77
- ;
78
- -o-transition:
79
- opacity 0.25s ease,
80
- background-color 0.25s ease,
81
- color 0.25s ease,
82
- background 0.25s ease,
83
- box-shadow 0.25s ease
84
- ;
85
- -ms-transition:
86
- opacity 0.25s ease,
87
- background-color 0.25s ease,
88
- color 0.25s ease,
89
- background 0.25s ease,
90
- box-shadow 0.25s ease
91
- ;
92
- transition:
93
- opacity 0.25s ease,
94
- background-color 0.25s ease,
95
- color 0.25s ease,
96
- background 0.25s ease,
97
- box-shadow 0.25s ease
98
- ;
62
+ box-shadow 0.25s ease;
99
63
  }
100
64
 
101
-
102
-
103
-
104
65
  /*******************************
105
66
  States
106
67
  *******************************/
107
68
 
108
-
109
69
  /*--------------
110
70
  Active
111
71
  ---------------*/
@@ -114,19 +74,22 @@
114
74
  .ui.active.button {
115
75
  background-color: #EAEAEA;
116
76
  background-image: none;
77
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
117
78
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
118
79
  color: rgba(0, 0, 0, 0.7);
119
80
  }
120
81
 
121
-
122
82
  /*--------------
123
83
  Hover
124
84
  ---------------*/
125
85
 
126
86
  .ui.button:not(.loading):hover {
87
+ background-image: -webkit-gradient(linear, top left, bottom left, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.08)));
88
+ background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08));
127
89
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08));
128
90
  color: rgba(0, 0, 0, 0.7);
129
91
  }
92
+
130
93
  .ui.button.active:hover {
131
94
  background-image: none;
132
95
  }
@@ -144,6 +107,7 @@
144
107
  .ui.active.button:not(.loading):active {
145
108
  background-color: #F1F1F1;
146
109
  color: rgba(0, 0, 0, 0.7);
110
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
147
111
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
148
112
  }
149
113
 
@@ -154,16 +118,12 @@
154
118
  .ui.loading.button {
155
119
  position: relative;
156
120
  cursor: default;
157
-
158
121
  background-color: #FFFFFF !important;
159
122
  color: transparent !important;
160
-
161
123
  -webkit-transition: all 0s linear;
162
- -moz-transition: all 0s linear;
163
- -o-transition: all 0s linear;
164
- -ms-transition: all 0s linear;
165
124
  transition: all 0s linear;
166
125
  }
126
+
167
127
  .ui.loading.button:after {
168
128
  position: absolute;
169
129
  top: 0em;
@@ -177,7 +137,6 @@
177
137
  .ui.labeled.icon.loading.button .icon {
178
138
  background-color: transparent;
179
139
  -webkit-box-shadow: none;
180
- -moz-box-shadow: none;
181
140
  box-shadow: none;
182
141
  }
183
142
 
@@ -194,7 +153,6 @@
194
153
  opacity: 0.3 !important;
195
154
  background-image: none !important;
196
155
  -webkit-box-shadow: none !important;
197
- -moz-box-shadow: none !important;
198
156
  box-shadow: none !important;
199
157
  }
200
158
 
@@ -214,89 +172,119 @@
214
172
  .ui.animated.button .visible.content {
215
173
  position: relative;
216
174
  }
175
+
217
176
  .ui.animated.button .hidden.content {
218
177
  position: absolute;
219
178
  width: 100%;
220
179
  }
221
180
 
222
181
  /* Horizontal */
182
+
223
183
  .ui.animated.button .visible.content,
224
184
  .ui.animated.button .hidden.content {
185
+ -webkit-transition: right 0.3s ease 0s;
225
186
  transition: right 0.3s ease 0s;
226
187
  }
188
+
227
189
  .ui.animated.button .visible.content {
228
190
  left: auto;
229
191
  right: 0%;
230
192
  }
193
+
231
194
  .ui.animated.button .hidden.content {
232
195
  top: 50%;
233
196
  left: auto;
234
197
  right: -100%;
235
198
  margin-top: -0.55em;
236
199
  }
200
+
237
201
  .ui.animated.button:hover .visible.content {
238
202
  left: auto;
239
203
  right: 200%;
240
204
  }
205
+
241
206
  .ui.animated.button:hover .hidden.content {
242
207
  left: auto;
243
208
  right: 0%;
244
209
  }
245
210
 
246
211
  /* Vertical */
212
+
247
213
  .ui.vertical.animated.button .visible.content,
248
214
  .ui.vertical.animated.button .hidden.content {
215
+ -webkit-transition: top 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
249
216
  transition: top 0.3s ease 0s, transform 0.3s ease 0s;
250
217
  }
218
+
251
219
  .ui.vertical.animated.button .visible.content {
220
+ -webkit-transform: translateY(0%);
221
+ -ms-transform: translateY(0%);
252
222
  transform: translateY(0%);
253
223
  right: auto;
254
224
  }
225
+
255
226
  .ui.vertical.animated.button .hidden.content {
256
227
  top: -100%;
257
228
  left: 0%;
258
229
  right: auto;
259
230
  }
231
+
260
232
  .ui.vertical.animated.button:hover .visible.content {
233
+ -webkit-transform: translateY(200%);
234
+ -ms-transform: translateY(200%);
261
235
  transform: translateY(200%);
262
236
  right: auto;
263
237
  }
238
+
264
239
  .ui.vertical.animated.button:hover .hidden.content {
265
240
  top: 50%;
266
241
  right: auto;
267
242
  }
268
243
 
269
244
  /* Fade */
245
+
270
246
  .ui.fade.animated.button .visible.content,
271
247
  .ui.fade.animated.button .hidden.content {
248
+ -webkit-transition: opacity 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
272
249
  transition: opacity 0.3s ease 0s, transform 0.3s ease 0s;
273
250
  }
251
+
274
252
  .ui.fade.animated.button .visible.content {
275
253
  left: auto;
276
254
  right: auto;
277
255
  opacity: 1;
256
+ -webkit-transform: scale(1);
257
+ -ms-transform: scale(1);
278
258
  transform: scale(1);
279
259
  }
260
+
280
261
  .ui.fade.animated.button .hidden.content {
281
262
  opacity: 0;
282
263
  left: 0%;
283
264
  right: auto;
265
+ -webkit-transform: scale(1.2);
266
+ -ms-transform: scale(1.2);
284
267
  transform: scale(1.2);
285
268
  }
269
+
286
270
  .ui.fade.animated.button:hover .visible.content {
287
271
  left: auto;
288
272
  right: auto;
289
273
  opacity: 0;
274
+ -webkit-transform: scale(0.7);
275
+ -ms-transform: scale(0.7);
290
276
  transform: scale(0.7);
291
277
  }
278
+
292
279
  .ui.fade.animated.button:hover .hidden.content {
293
280
  left: 0%;
294
281
  right: auto;
295
282
  opacity: 1;
283
+ -webkit-transform: scale(1);
284
+ -ms-transform: scale(1);
296
285
  transform: scale(1);
297
286
  }
298
287
 
299
-
300
288
  /*-------------------
301
289
  Primary
302
290
  --------------------*/
@@ -306,6 +294,7 @@
306
294
  background-color: #D95C5C;
307
295
  color: #FFFFFF;
308
296
  }
297
+
309
298
  .ui.primary.buttons .button:hover,
310
299
  .ui.primary.button:hover,
311
300
  .ui.primary.buttons .active.button,
@@ -313,6 +302,7 @@
313
302
  background-color: #E75859;
314
303
  color: #FFFFFF;
315
304
  }
305
+
316
306
  .ui.primary.buttons .button:active,
317
307
  .ui.primary.button:active {
318
308
  background-color: #D24B4C;
@@ -328,6 +318,7 @@
328
318
  background-color: #00B5AD;
329
319
  color: #FFFFFF;
330
320
  }
321
+
331
322
  .ui.secondary.buttons .button:hover,
332
323
  .ui.secondary.button:hover,
333
324
  .ui.secondary.buttons .active.button,
@@ -335,6 +326,7 @@
335
326
  background-color: #009A93;
336
327
  color: #FFFFFF;
337
328
  }
329
+
338
330
  .ui.secondary.buttons .button:active,
339
331
  .ui.secondary.button:active {
340
332
  background-color: #00847E;
@@ -346,99 +338,119 @@
346
338
  --------------------*/
347
339
 
348
340
  /* Facebook */
341
+
349
342
  .ui.facebook.button {
350
343
  background-color: #3B579D;
351
344
  color: #FFFFFF;
352
345
  }
346
+
353
347
  .ui.facebook.button:hover {
354
348
  background-color: #3A59A9;
355
349
  color: #FFFFFF;
356
350
  }
351
+
357
352
  .ui.facebook.button:active {
358
353
  background-color: #334F95;
359
354
  color: #FFFFFF;
360
355
  }
361
356
 
362
357
  /* Twitter */
358
+
363
359
  .ui.twitter.button {
364
360
  background-color: #4092CC;
365
361
  color: #FFFFFF;
366
362
  }
363
+
367
364
  .ui.twitter.button:hover {
368
365
  background-color: #399ADE;
369
366
  color: #FFFFFF;
370
367
  }
368
+
371
369
  .ui.twitter.button:active {
372
370
  background-color: #3283BC;
373
371
  color: #FFFFFF;
374
372
  }
375
373
 
376
374
  /* Google Plus */
375
+
377
376
  .ui.google.plus.button {
378
377
  background-color: #D34836;
379
378
  color: #FFFFFF;
380
379
  }
380
+
381
381
  .ui.google.plus.button:hover {
382
382
  background-color: #E3432E;
383
383
  color: #FFFFFF;
384
384
  }
385
+
385
386
  .ui.google.plus.button:active {
386
387
  background-color: #CA3A27;
387
388
  color: #FFFFFF;
388
389
  }
389
390
 
390
391
  /* Linked In */
392
+
391
393
  .ui.linkedin.button {
392
394
  background-color: #1F88BE;
393
395
  color: #FFFFFF;
394
396
  }
397
+
395
398
  .ui.linkedin.button:hover {
396
399
  background-color: #1394D6;
397
400
  color: #FFFFFF;
398
401
  }
402
+
399
403
  .ui.linkedin.button:active {
400
404
  background-color: #1179AE;
401
405
  color: #FFFFFF;
402
406
  }
403
407
 
404
408
  /* YouTube */
409
+
405
410
  .ui.youtube.button {
406
411
  background-color: #CC181E;
407
412
  color: #FFFFFF;
408
413
  }
414
+
409
415
  .ui.youtube.button:hover {
410
416
  background-color: #DF0209;
411
417
  color: #FFFFFF;
412
418
  }
419
+
413
420
  .ui.youtube.button:active {
414
421
  background-color: #A50006;
415
422
  color: #FFFFFF;
416
423
  }
417
424
 
418
425
  /* Instagram */
426
+
419
427
  .ui.instagram.button {
420
428
  background-color: #49769C;
421
429
  color: #FFFFFF;
422
430
  }
431
+
423
432
  .ui.instagram.button:hover {
424
433
  background-color: #4781B1;
425
434
  color: #FFFFFF;
426
435
  }
436
+
427
437
  .ui.instagram.button:active {
428
438
  background-color: #38658A;
429
439
  color: #FFFFFF;
430
440
  }
431
441
 
432
-
433
442
  /* Pinterest */
443
+
434
444
  .ui.pinterest.button {
435
445
  background-color: #00ACED;
436
446
  color: #FFFFFF;
437
447
  }
448
+
438
449
  .ui.pinterest.button:hover {
439
450
  background-color: #00B9FF;
440
451
  color: #FFFFFF;
441
452
  }
453
+
442
454
  .ui.pinterest.button:active {
443
455
  background-color: #009EDA;
444
456
  color: #FFFFFF;
@@ -450,32 +462,15 @@
450
462
 
451
463
  .ui.button > .icon {
452
464
  margin-right: 0.6em;
453
-
454
465
  line-height: 1;
455
-
456
- -webkit-transition:
457
- opacity 0.1s ease
458
- ;
459
- -moz-transition:
460
- opacity 0.1s ease
461
- ;
462
- -o-transition:
463
- opacity 0.1s ease
464
- ;
465
- -ms-transition:
466
- opacity 0.1s ease
467
- ;
468
- transition:
469
- opacity 0.1s ease
470
- ;
466
+ -webkit-transition: opacity 0.1s ease;
467
+ transition: opacity 0.1s ease;
471
468
  }
472
469
 
473
-
474
470
  /*******************************
475
471
  Variations
476
472
  *******************************/
477
473
 
478
-
479
474
  /*-------------------
480
475
  Floated
481
476
  --------------------*/
@@ -485,14 +480,13 @@
485
480
  float: left;
486
481
  margin-right: 0.25em;
487
482
  }
483
+
488
484
  .ui.right.floated.buttons,
489
485
  .ui.right.floated.button {
490
486
  float: right;
491
487
  margin-left: 0.25em;
492
488
  }
493
489
 
494
-
495
-
496
490
  /*-------------------
497
491
  Sizes
498
492
  --------------------*/
@@ -507,10 +501,12 @@
507
501
  .ui.mini.button {
508
502
  font-size: 0.8rem;
509
503
  }
504
+
510
505
  .ui.mini.buttons .button,
511
506
  .ui.mini.button {
512
507
  padding: 0.6em 0.8em 0.73em;
513
508
  }
509
+
514
510
  .ui.mini.icon.buttons .button,
515
511
  .ui.mini.buttons .icon.button {
516
512
  padding: 0.6em 0.6em 0.73em;
@@ -521,11 +517,13 @@
521
517
  .ui.tiny.button {
522
518
  font-size: 0.875rem;
523
519
  }
520
+
524
521
  .ui.tiny.buttons .button,
525
522
  .ui.tiny.buttons .button,
526
523
  .ui.tiny.button {
527
524
  padding: 0.6em 0.8em 0.73em;
528
525
  }
526
+
529
527
  .ui.tiny.icon.buttons .button,
530
528
  .ui.tiny.buttons .icon.button {
531
529
  padding: 0.6em 0.6em 0.73em;
@@ -542,16 +540,19 @@
542
540
  .ui.large.button {
543
541
  font-size: 1.125rem;
544
542
  }
543
+
545
544
  .ui.big.buttons .button,
546
545
  .ui.big.buttons .or,
547
546
  .ui.big.button {
548
547
  font-size: 1.25rem;
549
548
  }
549
+
550
550
  .ui.huge.buttons .button,
551
551
  .ui.huge.buttons .or,
552
552
  .ui.huge.button {
553
553
  font-size: 1.375rem;
554
554
  }
555
+
555
556
  .ui.massive.buttons .button,
556
557
  .ui.massive.buttons .or,
557
558
  .ui.massive.button {
@@ -560,6 +561,7 @@
560
561
  }
561
562
 
562
563
  /* Or resize */
564
+
563
565
  .ui.tiny.buttons .or:before,
564
566
  .ui.mini.buttons .or:before {
565
567
  width: 1.45em;
@@ -568,15 +570,18 @@
568
570
  margin-left: -0.725em;
569
571
  margin-top: -0.25em;
570
572
  }
573
+
571
574
  .ui.tiny.buttons .or:after,
572
575
  .ui.mini.buttons .or:after {
573
576
  height: 1.45em;
574
577
  }
575
578
 
576
579
  /* loading */
580
+
577
581
  .ui.huge.loading.button:after {
578
582
  background-image: image-url("semantic-ui/loader-small.gif");
579
583
  }
584
+
580
585
  .ui.massive.buttons .loading.button:after,
581
586
  .ui.gigantic.buttons .loading.button:after,
582
587
  .ui.massive.loading.button:after,
@@ -588,6 +593,7 @@
588
593
  .ui.huge.loading.button.active:after {
589
594
  background-image: image-url("semantic-ui/loader-small.gif");
590
595
  }
596
+
591
597
  .ui.massive.buttons .loading.button:after,
592
598
  .ui.gigantic.buttons .loading.button:after,
593
599
  .ui.massive.loading.button:after,
@@ -607,14 +613,14 @@
607
613
  .ui.icon.button {
608
614
  padding: 0.8em 0.8em 0.875em;
609
615
  }
616
+
610
617
  .ui.icon.buttons .button > .icon,
611
618
  .ui.icon.button > .icon {
612
619
  opacity: 0.9;
613
620
  margin: 0em;
621
+ vertical-align: top;
614
622
  }
615
623
 
616
-
617
-
618
624
  /*-------------------
619
625
  Basic
620
626
  --------------------*/
@@ -626,18 +632,13 @@
626
632
  color: #808080 !important;
627
633
  font-weight: normal;
628
634
  text-transform: none;
629
-
630
635
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
631
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
632
636
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
633
637
  }
638
+
634
639
  .ui.basic.buttons {
635
640
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
636
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
637
641
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
638
-
639
- -webkit-border-radius: 0.25em;
640
- -moz-border-radius: 0.25em;
641
642
  border-radius: 0.25em;
642
643
  }
643
644
 
@@ -646,55 +647,50 @@
646
647
  background-image: none;
647
648
  color: #7F7F7F !important;
648
649
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset;
649
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset;
650
650
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset;
651
651
  }
652
+
652
653
  .ui.basic.buttons .button:active,
653
654
  .ui.basic.button:active {
654
655
  background-color: rgba(0, 0, 0, 0.02) !important;
655
656
  color: #7F7F7F !important;
656
-
657
657
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
658
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
659
658
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
660
659
  }
660
+
661
661
  .ui.basic.buttons .button.active,
662
662
  .ui.basic.button.active {
663
663
  background-color: rgba(0, 0, 0, 0.05);
664
664
  color: #7F7F7F;
665
-
666
665
  -webkit-box-shadow: 0px 0px 0px 1px #BDBDBD inset;
667
- -moz-box-shadow: 0px 0px 0px 1px #BDBDBD inset;
668
666
  box-shadow: 0px 0px 0px 1px #BDBDBD inset;
669
667
  }
668
+
670
669
  .ui.basic.buttons .button.active:hover,
671
670
  .ui.basic.button.active:hover {
672
671
  background-color: rgba(0, 0, 0, 0.1);
673
672
  }
674
673
 
675
674
  /* Basic Group */
675
+
676
676
  .ui.basic.buttons .button {
677
677
  border-left: 1px solid rgba(0, 0, 0, 0.1);
678
-
679
678
  -webkit-box-shadow: none;
680
- -moz-box-shadow: none;
681
679
  box-shadow: none;
682
680
  }
681
+
683
682
  .ui.basic.buttons .button:hover,
684
683
  .ui.basic.buttons .button:active {
685
684
  -webkit-box-shadow: none;
686
- -moz-box-shadow: none;
687
685
  box-shadow: none;
688
686
  }
687
+
689
688
  .ui.basic.buttons .button.active,
690
689
  .ui.basic.buttons .button.active:hover {
691
690
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;
692
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;
693
691
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset;
694
692
  }
695
693
 
696
-
697
-
698
694
  /*--------------
699
695
  Labeled Icon
700
696
  ---------------*/
@@ -711,51 +707,41 @@
711
707
  position: absolute;
712
708
  top: 0em;
713
709
  left: 0em;
714
-
715
710
  -webkit-box-sizing: border-box;
716
711
  -moz-box-sizing: border-box;
717
712
  -ms-box-sizing: border-box;
718
713
  box-sizing: border-box;
719
-
720
714
  width: 2.75em;
721
715
  height: 100%;
722
716
  padding-top: 0.85em;
723
717
  background-color: rgba(0, 0, 0, 0.05);
724
718
  text-align: center;
725
-
726
- -webkit-border-radius: 0.25em 0px 0px 0.25em;
727
- -moz-border-radius: 0.25em 0px 0px 0.25em;
728
719
  border-radius: 0.25em 0px 0px 0.25em;
729
-
730
720
  line-height: 1;
731
-
732
721
  -webkit-box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset;
733
- -moz-box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset;
734
722
  box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset;
735
723
  }
736
724
 
737
725
  .ui.labeled.icon.buttons .button > .icon {
738
- -webkit-border-radius: 0em;
739
- -moz-border-radius: 0em;
740
726
  border-radius: 0em;
741
727
  }
728
+
742
729
  .ui.labeled.icon.buttons .button:first-child > .icon {
743
730
  border-top-left-radius: 0.25em;
744
731
  border-bottom-left-radius: 0.25em;
745
732
  }
733
+
746
734
  .ui.labeled.icon.buttons .button:last-child > .icon {
747
735
  border-top-right-radius: 0.25em;
748
736
  border-bottom-right-radius: 0.25em;
749
737
  }
738
+
750
739
  .ui.vertical.labeled.icon.buttons .button:first-child > .icon {
751
- -webkit-border-radius: 0em;
752
- -moz-border-radius: 0em;
753
740
  border-radius: 0em;
754
741
  border-top-left-radius: 0.25em;
755
742
  }
743
+
756
744
  .ui.vertical.labeled.icon.buttons .button:last-child > .icon {
757
- -webkit-border-radius: 0em;
758
- -moz-border-radius: 0em;
759
745
  border-radius: 0em;
760
746
  border-bottom-left-radius: 0.25em;
761
747
  }
@@ -764,6 +750,7 @@
764
750
  padding-left: 1.4em !important;
765
751
  padding-right: 4em !important;
766
752
  }
753
+
767
754
  .ui.left.fluid.labeled.icon.button,
768
755
  .ui.right.fluid.labeled.icon.button {
769
756
  padding-left: 1.4em !important;
@@ -773,32 +760,30 @@
773
760
  .ui.right.labeled.icon.button .icon {
774
761
  left: auto;
775
762
  right: 0em;
776
-
777
- -webkit-border-radius: 0em 0.25em 0.25em 0em;
778
- -moz-border-radius: 0em 0.25em 0.25em 0em;
779
763
  border-radius: 0em 0.25em 0.25em 0em;
780
-
781
764
  -webkit-box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset;
782
- -moz-box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset;
783
765
  box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset;
784
766
  }
785
767
 
786
-
787
768
  /*--------------
788
769
  Toggle
789
770
  ---------------*/
790
771
 
791
772
  /* Toggle (Modifies active state to give affordances) */
773
+
792
774
  .ui.toggle.buttons .active.button,
793
775
  .ui.buttons .button.toggle.active,
794
776
  .ui.button.toggle.active {
795
777
  background-color: #5BBD72 !important;
796
778
  color: #FFFFFF !important;
779
+ -webkit-box-shadow: none !important;
797
780
  box-shadow: none !important;
798
781
  }
782
+
799
783
  .ui.button.toggle.active:hover {
800
784
  background-color: #58CB73 !important;
801
785
  color: #FFFFFF !important;
786
+ -webkit-box-shadow: none !important;
802
787
  box-shadow: none !important;
803
788
  }
804
789
 
@@ -807,12 +792,9 @@
807
792
  ---------------*/
808
793
 
809
794
  .ui.circular.button {
810
- -webkit-border-radius: 10em;
811
- -moz-border-radius: 10em;
812
795
  border-radius: 10em;
813
796
  }
814
797
 
815
-
816
798
  /*--------------
817
799
  Attached
818
800
  ---------------*/
@@ -820,44 +802,32 @@
820
802
  .ui.attached.button {
821
803
  display: block;
822
804
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
823
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
824
805
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
825
806
  }
826
- .ui.attached.top.button {
827
807
 
828
- -webkit-border-radius: 0.25em 0.25em 0em 0em;
829
- -moz-border-radius: 0.25em 0.25em 0em 0em;
808
+ .ui.attached.top.button {
830
809
  border-radius: 0.25em 0.25em 0em 0em;
831
810
  }
811
+
832
812
  .ui.attached.bottom.button {
833
- -webkit-border-radius: 0em 0em 0.25em 0.25em;
834
- -moz-border-radius: 0em 0em 0.25em 0.25em;
835
813
  border-radius: 0em 0em 0.25em 0.25em;
836
814
  }
815
+
837
816
  .ui.attached.left.button {
838
817
  display: inline-block;
839
818
  border-left: none;
840
-
841
819
  padding-right: 0.75em;
842
820
  text-align: right;
843
-
844
- -webkit-border-radius: 0.25em 0em 0em 0.25em;
845
- -moz-border-radius: 0.25em 0em 0em 0.25em;
846
821
  border-radius: 0.25em 0em 0em 0.25em;
847
822
  }
823
+
848
824
  .ui.attached.right.button {
849
825
  display: inline-block;
850
-
851
826
  padding-left: 0.75em;
852
827
  text-align: left;
853
-
854
- -webkit-border-radius: 0em 0.25em 0.25em 0em;
855
- -moz-border-radius: 0em 0.25em 0.25em 0em;
856
828
  border-radius: 0em 0.25em 0.25em 0em;
857
829
  }
858
830
 
859
-
860
-
861
831
  /*-------------------
862
832
  Or Buttons
863
833
  --------------------*/
@@ -869,195 +839,188 @@
869
839
  height: 1.1em;
870
840
  z-index: 3;
871
841
  }
842
+
872
843
  .ui.buttons .or:before {
873
844
  position: absolute;
874
845
  top: 50%;
875
846
  left: 50%;
876
847
  content: 'or';
877
848
  background-color: #FFFFFF;
878
-
879
849
  margin-top: -0.1em;
880
850
  margin-left: -0.9em;
881
-
882
851
  width: 1.8em;
883
852
  height: 1.8em;
884
-
885
853
  line-height: 1.55;
886
854
  color: #AAAAAA;
887
855
  font-style: normal;
888
856
  font-weight: normal;
889
857
  text-align: center;
890
-
891
- -moz-border-radius: 500px;
892
- -webkit-border-radius: 500px;
893
858
  border-radius: 500px;
894
-
859
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
895
860
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
896
-
897
861
  -webkit-box-sizing: border-box;
898
862
  -moz-box-sizing: border-box;
899
863
  -ms-box-sizing: border-box;
900
864
  box-sizing: border-box;
901
865
  }
866
+
902
867
  .ui.buttons .or:after {
903
868
  position: absolute;
904
869
  top: 0em;
905
870
  left: 0em;
906
871
  content: ' ';
907
-
908
872
  width: 0.3em;
909
873
  height: 1.7em;
910
-
911
874
  background-color: transparent;
912
875
  border-top: 0.5em solid #FFFFFF;
913
876
  border-bottom: 0.5em solid #FFFFFF;
914
-
915
877
  }
916
878
 
917
879
  /* Fluid Or */
880
+
918
881
  .ui.fluid.buttons .or {
919
882
  width: 0em !important;
920
883
  }
921
- .ui.fluid.buttons .or:after{
884
+
885
+ .ui.fluid.buttons .or:after {
922
886
  display: none;
923
887
  }
924
888
 
925
-
926
889
  /*-------------------
927
890
  Attached
928
891
  --------------------*/
929
892
 
930
893
  /* Plural Attached */
894
+
931
895
  .attached.ui.buttons {
932
896
  margin: 0px;
933
- -webkit-border-radius: 4px 4px 0px 0px;
934
- -moz-border-radius: 4px 4px 0px 0px;
935
897
  border-radius: 4px 4px 0px 0px;
936
898
  }
899
+
937
900
  .attached.ui.buttons .button:first-child {
938
- -webkit-border-radius: 4px 0px 0px 0px;
939
- -moz-border-radius: 4px 0px 0px 0px;
940
901
  border-radius: 4px 0px 0px 0px;
941
902
  }
903
+
942
904
  .attached.ui.buttons .button:last-child {
943
- -webkit-border-radius: 0px 4px 0px 0px;
944
- -moz-border-radius: 0px 4px 0px 0px;
945
905
  border-radius: 0px 4px 0px 0px;
946
906
  }
947
907
 
948
908
  /* Bottom Side */
909
+
949
910
  .bottom.attached.ui.buttons {
950
911
  margin-top: -1px;
951
- -webkit-border-radius: 0px 0px 4px 4px;
952
- -moz-border-radius: 0px 0px 4px 4px;
953
912
  border-radius: 0px 0px 4px 4px;
954
913
  }
914
+
955
915
  .bottom.attached.ui.buttons .button:first-child {
956
- -webkit-border-radius: 0px 0px 0px 4px;
957
- -moz-border-radius: 0px 0px 0px 4px;
958
916
  border-radius: 0px 0px 0px 4px;
959
917
  }
918
+
960
919
  .bottom.attached.ui.buttons .button:last-child {
961
- -webkit-border-radius: 0px 0px 4px 0px;
962
- -moz-border-radius: 0px 0px 4px 0px;
963
920
  border-radius: 0px 0px 4px 0px;
964
921
  }
965
922
 
966
923
  /* Left Side */
924
+
967
925
  .left.attached.ui.buttons {
968
926
  margin-left: -1px;
969
- -webkit-border-radius: 0px 4px 4px 0px;
970
- -moz-border-radius: 0px 4px 4px 0px;
971
927
  border-radius: 0px 4px 4px 0px;
972
928
  }
929
+
973
930
  .left.attached.ui.buttons .button:first-child {
974
931
  margin-left: -1px;
975
- -webkit-border-radius: 0px 4px 0px 0px;
976
- -moz-border-radius: 0px 4px 0px 0px;
977
932
  border-radius: 0px 4px 0px 0px;
978
933
  }
934
+
979
935
  .left.attached.ui.buttons .button:last-child {
980
936
  margin-left: -1px;
981
- -webkit-border-radius: 0px 0px 4px 0px;
982
- -moz-border-radius: 0px 0px 4px 0px;
983
937
  border-radius: 0px 0px 4px 0px;
984
938
  }
939
+
985
940
  /* Right Side */
941
+
986
942
  .right.attached.ui.buttons,
987
943
  .right.attached.ui.buttons .button {
988
944
  margin-right: -1px;
989
- -webkit-border-radius: 4px 0px 0px 4px;
990
- -moz-border-radius: 4px 0px 0px 4px;
991
945
  border-radius: 4px 0px 0px 4px;
992
946
  }
947
+
993
948
  .right.attached.ui.buttons .button:first-child {
994
949
  margin-left: -1px;
995
- -webkit-border-radius: 4px 0px 0px 0px;
996
- -moz-border-radius: 4px 0px 0px 0px;
997
950
  border-radius: 4px 0px 0px 0px;
998
951
  }
952
+
999
953
  .right.attached.ui.buttons .button:last-child {
1000
954
  margin-left: -1px;
1001
- -webkit-border-radius: 0px 0px 0px 4px;
1002
- -moz-border-radius: 0px 0px 0px 4px;
1003
955
  border-radius: 0px 0px 0px 4px;
1004
956
  }
1005
957
 
1006
-
1007
-
1008
958
  /* Fluid */
959
+
1009
960
  .ui.fluid.buttons,
1010
961
  .ui.button.fluid,
1011
962
  .ui.fluid.buttons > .button {
1012
963
  display: block;
1013
964
  width: 100%;
1014
965
  }
966
+
1015
967
  .ui.\32.buttons > .button,
1016
968
  .ui.two.buttons > .button {
1017
969
  width: 50%;
1018
970
  }
971
+
1019
972
  .ui.\33.buttons > .button,
1020
973
  .ui.three.buttons > .button {
1021
974
  width: 33.333%;
1022
975
  }
976
+
1023
977
  .ui.\34.buttons > .button,
1024
978
  .ui.four.buttons > .button {
1025
979
  width: 25%;
1026
980
  }
981
+
1027
982
  .ui.\35.buttons > .button,
1028
983
  .ui.five.buttons > .button {
1029
984
  width: 20%;
1030
985
  }
986
+
1031
987
  .ui.\36.buttons > .button,
1032
988
  .ui.six.buttons > .button {
1033
989
  width: 16.666%;
1034
990
  }
991
+
1035
992
  .ui.\37.buttons > .button,
1036
993
  .ui.seven.buttons > .button {
1037
994
  width: 14.285%;
1038
995
  }
996
+
1039
997
  .ui.\38.buttons > .button,
1040
998
  .ui.eight.buttons > .button {
1041
999
  width: 12.500%;
1042
1000
  }
1001
+
1043
1002
  .ui.\39.buttons > .button,
1044
1003
  .ui.nine.buttons > .button {
1045
1004
  width: 11.11%;
1046
1005
  }
1006
+
1047
1007
  .ui.\31\30.buttons > .button,
1048
1008
  .ui.ten.buttons > .button {
1049
1009
  width: 10%;
1050
1010
  }
1011
+
1051
1012
  .ui.\31\31.buttons > .button,
1052
1013
  .ui.eleven.buttons > .button {
1053
1014
  width: 9.09%;
1054
1015
  }
1016
+
1055
1017
  .ui.\31\32.buttons > .button,
1056
1018
  .ui.twelve.buttons > .button {
1057
1019
  width: 8.3333%;
1058
1020
  }
1059
1021
 
1060
1022
  /* Fluid Vertical Buttons */
1023
+
1061
1024
  .ui.fluid.vertical.buttons,
1062
1025
  .ui.fluid.vertical.buttons > .button {
1063
1026
  display: block;
@@ -1072,64 +1035,75 @@
1072
1035
  .ui.two.vertical.buttons > .button {
1073
1036
  height: 50%;
1074
1037
  }
1038
+
1075
1039
  .ui.\33.vertical.buttons > .button,
1076
1040
  .ui.three.vertical.buttons > .button {
1077
1041
  height: 33.333%;
1078
1042
  }
1043
+
1079
1044
  .ui.\34.vertical.buttons > .button,
1080
1045
  .ui.four.vertical.buttons > .button {
1081
1046
  height: 25%;
1082
1047
  }
1048
+
1083
1049
  .ui.\35.vertical.buttons > .button,
1084
1050
  .ui.five.vertical.buttons > .button {
1085
1051
  height: 20%;
1086
1052
  }
1053
+
1087
1054
  .ui.\36.vertical.buttons > .button,
1088
1055
  .ui.six.vertical.buttons > .button {
1089
1056
  height: 16.666%;
1090
1057
  }
1058
+
1091
1059
  .ui.\37.vertical.buttons > .button,
1092
1060
  .ui.seven.vertical.buttons > .button {
1093
1061
  height: 14.285%;
1094
1062
  }
1063
+
1095
1064
  .ui.\38.vertical.buttons > .button,
1096
1065
  .ui.eight.vertical.buttons > .button {
1097
1066
  height: 12.500%;
1098
1067
  }
1068
+
1099
1069
  .ui.\39.vertical.buttons > .button,
1100
1070
  .ui.nine.vertical.buttons > .button {
1101
1071
  height: 11.11%;
1102
1072
  }
1073
+
1103
1074
  .ui.\31\30.vertical.buttons > .button,
1104
1075
  .ui.ten.vertical.buttons > .button {
1105
1076
  height: 10%;
1106
1077
  }
1078
+
1107
1079
  .ui.\31\31.vertical.buttons > .button,
1108
1080
  .ui.eleven.vertical.buttons > .button {
1109
1081
  height: 9.09%;
1110
1082
  }
1083
+
1111
1084
  .ui.\31\32.vertical.buttons > .button,
1112
1085
  .ui.twelve.vertical.buttons > .button {
1113
1086
  height: 8.3333%;
1114
1087
  }
1115
1088
 
1116
-
1117
1089
  /*-------------------
1118
1090
  Colors
1119
1091
  --------------------*/
1120
1092
 
1121
-
1122
1093
  /*--- Black ---*/
1094
+
1123
1095
  .ui.black.buttons .button,
1124
1096
  .ui.black.button {
1125
1097
  background-color: #5C6166;
1126
1098
  color: #FFFFFF;
1127
1099
  }
1100
+
1128
1101
  .ui.black.buttons .button:hover,
1129
1102
  .ui.black.button:hover {
1130
1103
  background-color: #4C4C4C;
1131
1104
  color: #FFFFFF;
1132
1105
  }
1106
+
1133
1107
  .ui.black.buttons .button:active,
1134
1108
  .ui.black.button:active {
1135
1109
  background-color: #333333;
@@ -1137,11 +1111,13 @@
1137
1111
  }
1138
1112
 
1139
1113
  /*--- Green ---*/
1114
+
1140
1115
  .ui.green.buttons .button,
1141
1116
  .ui.green.button {
1142
1117
  background-color: #5BBD72;
1143
1118
  color: #FFFFFF;
1144
1119
  }
1120
+
1145
1121
  .ui.green.buttons .button:hover,
1146
1122
  .ui.green.button:hover,
1147
1123
  .ui.green.buttons .active.button,
@@ -1149,6 +1125,7 @@
1149
1125
  background-color: #58cb73;
1150
1126
  color: #FFFFFF;
1151
1127
  }
1128
+
1152
1129
  .ui.green.buttons .button:active,
1153
1130
  .ui.green.button:active {
1154
1131
  background-color: #4CB164;
@@ -1156,11 +1133,13 @@
1156
1133
  }
1157
1134
 
1158
1135
  /*--- Red ---*/
1136
+
1159
1137
  .ui.red.buttons .button,
1160
1138
  .ui.red.button {
1161
1139
  background-color: #D95C5C;
1162
1140
  color: #FFFFFF;
1163
1141
  }
1142
+
1164
1143
  .ui.red.buttons .button:hover,
1165
1144
  .ui.red.button:hover,
1166
1145
  .ui.red.buttons .active.button,
@@ -1168,6 +1147,7 @@
1168
1147
  background-color: #E75859;
1169
1148
  color: #FFFFFF;
1170
1149
  }
1150
+
1171
1151
  .ui.red.buttons .button:active,
1172
1152
  .ui.red.button:active {
1173
1153
  background-color: #D24B4C;
@@ -1175,11 +1155,13 @@
1175
1155
  }
1176
1156
 
1177
1157
  /*--- Orange ---*/
1158
+
1178
1159
  .ui.orange.buttons .button,
1179
1160
  .ui.orange.button {
1180
1161
  background-color: #E96633;
1181
1162
  color: #FFFFFF;
1182
1163
  }
1164
+
1183
1165
  .ui.orange.buttons .button:hover,
1184
1166
  .ui.orange.button:hover,
1185
1167
  .ui.orange.buttons .active.button,
@@ -1187,6 +1169,7 @@
1187
1169
  background-color: #FF7038;
1188
1170
  color: #FFFFFF;
1189
1171
  }
1172
+
1190
1173
  .ui.orange.buttons .button:active,
1191
1174
  .ui.orange.button:active {
1192
1175
  background-color: #DA683B;
@@ -1194,11 +1177,13 @@
1194
1177
  }
1195
1178
 
1196
1179
  /*--- Blue ---*/
1180
+
1197
1181
  .ui.blue.buttons .button,
1198
1182
  .ui.blue.button {
1199
1183
  background-color: #6ECFF5;
1200
1184
  color: #FFFFFF;
1201
1185
  }
1186
+
1202
1187
  .ui.blue.buttons .button:hover,
1203
1188
  .ui.blue.button:hover,
1204
1189
  .ui.blue.buttons .active.button,
@@ -1206,6 +1191,7 @@
1206
1191
  background-color: #1AB8F3;
1207
1192
  color: #FFFFFF;
1208
1193
  }
1194
+
1209
1195
  .ui.blue.buttons .button:active,
1210
1196
  .ui.blue.button:active {
1211
1197
  background-color: #0AA5DF;
@@ -1213,11 +1199,13 @@
1213
1199
  }
1214
1200
 
1215
1201
  /*--- Purple ---*/
1202
+
1216
1203
  .ui.purple.buttons .button,
1217
1204
  .ui.purple.button {
1218
1205
  background-color: #564F8A;
1219
1206
  color: #FFFFFF;
1220
1207
  }
1208
+
1221
1209
  .ui.purple.buttons .button:hover,
1222
1210
  .ui.purple.button:hover,
1223
1211
  .ui.purple.buttons .active.button,
@@ -1225,6 +1213,7 @@
1225
1213
  background-color: #3E3773;
1226
1214
  color: #FFFFFF;
1227
1215
  }
1216
+
1228
1217
  .ui.purple.buttons .button:active,
1229
1218
  .ui.purple.button:active {
1230
1219
  background-color: #2E2860;
@@ -1232,11 +1221,13 @@
1232
1221
  }
1233
1222
 
1234
1223
  /*--- Teal ---*/
1224
+
1235
1225
  .ui.teal.buttons .button,
1236
1226
  .ui.teal.button {
1237
1227
  background-color: #00B5AD;
1238
1228
  color: #FFFFFF;
1239
1229
  }
1230
+
1240
1231
  .ui.teal.buttons .button:hover,
1241
1232
  .ui.teal.button:hover,
1242
1233
  .ui.teal.buttons .active.button,
@@ -1244,6 +1235,7 @@
1244
1235
  background-color: #009A93;
1245
1236
  color: #FFFFFF;
1246
1237
  }
1238
+
1247
1239
  .ui.teal.buttons .button:active,
1248
1240
  .ui.teal.button:active {
1249
1241
  background-color: #00847E;
@@ -1259,6 +1251,7 @@
1259
1251
  background-color: #5BBD72 !important;
1260
1252
  color: #FFFFFF;
1261
1253
  }
1254
+
1262
1255
  .ui.positive.buttons .button:hover,
1263
1256
  .ui.positive.button:hover,
1264
1257
  .ui.positive.buttons .active.button,
@@ -1266,21 +1259,23 @@
1266
1259
  background-color: #58CB73 !important;
1267
1260
  color: #FFFFFF;
1268
1261
  }
1262
+
1269
1263
  .ui.positive.buttons .button:active,
1270
1264
  .ui.positive.button:active {
1271
1265
  background-color: #4CB164 !important;
1272
1266
  color: #FFFFFF;
1273
1267
  }
1274
1268
 
1275
-
1276
1269
  /*---------------
1277
1270
  Negative
1278
1271
  ----------------*/
1272
+
1279
1273
  .ui.negative.buttons .button,
1280
1274
  .ui.negative.button {
1281
1275
  background-color: #D95C5C !important;
1282
1276
  color: #FFFFFF;
1283
1277
  }
1278
+
1284
1279
  .ui.negative.buttons .button:hover,
1285
1280
  .ui.negative.button:hover,
1286
1281
  .ui.negative.buttons .active.button,
@@ -1288,13 +1283,13 @@
1288
1283
  background-color: #E75859 !important;
1289
1284
  color: #FFFFFF;
1290
1285
  }
1286
+
1291
1287
  .ui.negative.buttons .button:active,
1292
1288
  .ui.negative.button:active {
1293
1289
  background-color: #D24B4C !important;
1294
1290
  color: #FFFFFF;
1295
1291
  }
1296
1292
 
1297
-
1298
1293
  /*******************************
1299
1294
  Groups
1300
1295
  *******************************/
@@ -1303,6 +1298,7 @@
1303
1298
  display: inline-block;
1304
1299
  vertical-align: middle;
1305
1300
  }
1301
+
1306
1302
  .ui.buttons:after {
1307
1303
  content: ".";
1308
1304
  display: block;
@@ -1310,35 +1306,40 @@
1310
1306
  clear: both;
1311
1307
  visibility: hidden;
1312
1308
  }
1309
+
1313
1310
  .ui.buttons .button:first-child {
1314
1311
  border-left: none;
1315
1312
  }
1316
1313
 
1317
1314
  .ui.buttons .button {
1318
1315
  float: left;
1319
- -webkit-border-radius: 0em;
1320
- -moz-border-radius: 0em;
1321
1316
  border-radius: 0em;
1322
1317
  }
1323
- .ui.buttons .button:first-child {
1318
+
1319
+ .ui.buttons .button:first-child {
1324
1320
  margin-left: 0em;
1325
1321
  border-top-left-radius: 0.25em;
1326
1322
  border-bottom-left-radius: 0.25em;
1327
1323
  }
1324
+
1328
1325
  .ui.buttons .button:last-child {
1329
1326
  border-top-right-radius: 0.25em;
1330
1327
  border-bottom-right-radius: 0.25em;
1331
1328
  }
1332
1329
 
1333
1330
  /* Vertical Style */
1331
+
1334
1332
  .ui.vertical.buttons {
1335
1333
  display: inline-block;
1336
1334
  }
1335
+
1337
1336
  .ui.vertical.buttons .button {
1338
1337
  display: block;
1339
1338
  float: none;
1339
+ -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
1340
1340
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
1341
1341
  }
1342
+
1342
1343
  .ui.vertical.buttons .button:first-child,
1343
1344
  .ui.vertical.buttons .mini.button:first-child,
1344
1345
  .ui.vertical.buttons .tiny.button:first-child,
@@ -1346,10 +1347,9 @@
1346
1347
  .ui.vertical.buttons .massive.button:first-child,
1347
1348
  .ui.vertical.buttons .huge.button:first-child {
1348
1349
  margin-top: 0px;
1349
- -moz-border-radius: 0.25em 0.25em 0px 0px;
1350
- -webkit-border-radius: 0.25em 0.25em 0px 0px;
1351
1350
  border-radius: 0.25em 0.25em 0px 0px;
1352
1351
  }
1352
+
1353
1353
  .ui.vertical.buttons .button:last-child,
1354
1354
  .ui.vertical.buttons .mini.button:last-child,
1355
1355
  .ui.vertical.buttons .tiny.button:last-child,
@@ -1357,7 +1357,5 @@
1357
1357
  .ui.vertical.buttons .massive.button:last-child,
1358
1358
  .ui.vertical.buttons .huge.button:last-child,
1359
1359
  .ui.vertical.buttons .gigantic.button:last-child {
1360
- -moz-border-radius: 0px 0px 0.25em 0.25em;
1361
- -webkit-border-radius: 0px 0px 0.25em 0.25em;
1362
1360
  border-radius: 0px 0px 0.25em 0.25em;
1363
- }
1361
+ }