semantic-ui-rails 0.7.2 → 0.8.1

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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 0f00cb7d50ba3a252e9665cdfe830a636584072c
4
- data.tar.gz: d396c6173d8ad35ed69951318c743239b777293e
3
+ metadata.gz: d8c20f9c580c265c14a358d871c04fdc557f7e9d
4
+ data.tar.gz: 608730d33852e5b7347a48afad7a8d5b8932ba6b
5
5
  SHA512:
6
- metadata.gz: 92bde35af206d14de14d769bccfd7d4a0fcac940ea75ca1c84c915b2c60088e38e796ef92eabedf2352413ce9ca955f2dcd2d099765d951d8f21e7ca557358e6
7
- data.tar.gz: b39de8141ba2b346add8c77b7956f2494b1aa0a1a6f9afe467837996b5873f81d06373397e92b18a381fcb4ba100c99e9484fab91419470ac44db0d49b58b08a
6
+ metadata.gz: 7eecfa3f931b38bff568dc4a5e53cd87b1879d6274e632883dfc19333335ed65e71364b5b62a7aacdf943e1aab57bea77210f772dcd028668824d150c20b1b23
7
+ data.tar.gz: 98950787e4db3adb781374cea1d3fe665e40cd1bb44f45c8b9e86e2bc19ca8ee88e80ebb682e0272f63bfd42455af77af84f7c1f1a97354eb1f604114d3686a3
@@ -1,7 +1,7 @@
1
1
  module Semantic
2
2
  module Ui
3
3
  module Rails
4
- VERSION = "0.7.2"
4
+ VERSION = "0.8.1"
5
5
  end
6
6
  end
7
7
  end
@@ -266,7 +266,10 @@ $.fn.dropdown = function(parameters) {
266
266
  },
267
267
 
268
268
  activate: function(text, value) {
269
- value = value || text;
269
+ value = (value !== undefined)
270
+ ? value
271
+ : text
272
+ ;
270
273
  module.set.selected(value);
271
274
  module.set.value(value);
272
275
  module.hide();
@@ -274,7 +277,10 @@ $.fn.dropdown = function(parameters) {
274
277
 
275
278
  /* Deprecated */
276
279
  auto: function(text, value) {
277
- value = value || text;
280
+ value = (value !== undefined)
281
+ ? value
282
+ : text
283
+ ;
278
284
  module.set.selected(value);
279
285
  module.set.value(value);
280
286
  module.hide();
@@ -282,14 +288,20 @@ $.fn.dropdown = function(parameters) {
282
288
 
283
289
  /* Deprecated */
284
290
  changeText: function(text, value) {
285
- value = value || text;
291
+ value = (value !== undefined)
292
+ ? value
293
+ : text
294
+ ;
286
295
  module.set.selected(value);
287
296
  module.hide();
288
297
  },
289
298
 
290
299
  /* Deprecated */
291
300
  updateForm: function(text, value) {
292
- value = value || text;
301
+ value = (value !== undefined)
302
+ ? value
303
+ : text
304
+ ;
293
305
  module.set.selected(value);
294
306
  module.set.value(value);
295
307
  module.hide();
@@ -308,7 +320,10 @@ $.fn.dropdown = function(parameters) {
308
320
  var
309
321
  $selectedItem
310
322
  ;
311
- value = value || module.get.value() || module.get.text();
323
+ value = (value !== undefined)
324
+ ? value
325
+ : ( module.get.value() || module.get.text() )
326
+ ;
312
327
  if(value) {
313
328
  $item
314
329
  .each(function() {
@@ -98,24 +98,205 @@
98
98
  ;
99
99
  }
100
100
 
101
+
102
+
103
+
104
+ /*******************************
105
+ States
106
+ *******************************/
107
+
108
+
101
109
  /*--------------
102
- Count
110
+ Active
103
111
  ---------------*/
104
112
 
105
- .ui.count.button {
106
- -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
107
- -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
108
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important;
113
+ .ui.buttons .active.button,
114
+ .ui.active.button {
115
+ background-color: #EAEAEA;
116
+ background-image: none;
117
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
118
+ color: rgba(0, 0, 0, 0.7);
119
+ }
120
+
121
+
122
+ /*--------------
123
+ Hover
124
+ ---------------*/
125
+
126
+ .ui.button:not(.loading):hover {
127
+ background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08));
128
+ color: rgba(0, 0, 0, 0.7);
129
+ }
130
+ .ui.button.active:hover {
131
+ background-image: none;
132
+ }
133
+
134
+ .ui.button:hover .icon,
135
+ .ui.button.hover .icon {
136
+ opacity: 0.85;
109
137
  }
110
138
 
111
- .ui.count.button > .count {
139
+ /*--------------
140
+ Down
141
+ ---------------*/
142
+
143
+ .ui.button:not(.loading):active,
144
+ .ui.active.button:not(.loading):active {
145
+ background-color: #F1F1F1;
146
+ color: rgba(0, 0, 0, 0.7);
147
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
148
+ }
149
+
150
+ /*--------------
151
+ Loading
152
+ ---------------*/
153
+
154
+ .ui.loading.button {
155
+ position: relative;
156
+ cursor: default;
157
+
158
+ background-color: #FFFFFF !important;
159
+ color: transparent !important;
160
+
161
+ -webkit-transition: all 0s linear;
162
+ -moz-transition: all 0s linear;
163
+ -o-transition: all 0s linear;
164
+ -ms-transition: all 0s linear;
165
+ transition: all 0s linear;
166
+ }
167
+ .ui.loading.button:after {
112
168
  position: absolute;
113
- background-color: #FFFFFF;
114
- border: 1px solid #F0F0F0;
115
- margin: -0.8em -1.5em;
116
- padding: 0.8em 1.5em;
169
+ top: 0em;
170
+ left: 0em;
171
+ width: 100%;
172
+ height: 100%;
173
+ content: '';
174
+ background: transparent url(../loader-mini.gif) no-repeat 50% 50%;
175
+ }
176
+
177
+ .ui.labeled.icon.loading.button .icon {
178
+ background-color: transparent;
179
+ -webkit-box-shadow: none;
180
+ -moz-box-shadow: none;
181
+ box-shadow: none;
182
+ }
183
+
184
+ /*-------------------
185
+ Disabled
186
+ --------------------*/
187
+
188
+ .ui.disabled.button,
189
+ .ui.disabled.button:hover,
190
+ .ui.disabled.button.active {
191
+ background-color: #DDDDDD !important;
192
+ cursor: default;
193
+ color: rgba(0, 0, 0, 0.5) !important;
194
+ opacity: 0.3 !important;
195
+ background-image: none !important;
196
+ -webkit-box-shadow: none !important;
197
+ -moz-box-shadow: none !important;
198
+ box-shadow: none !important;
199
+ }
200
+
201
+ /*******************************
202
+ Types
203
+ *******************************/
204
+
205
+ /*-------------------
206
+ Animated
207
+ --------------------*/
208
+
209
+ .ui.animated.button {
210
+ position: relative;
211
+ overflow: hidden;
212
+ }
213
+
214
+ .ui.animated.button .visible.content {
215
+ position: relative;
216
+ }
217
+ .ui.animated.button .hidden.content {
218
+ position: absolute;
219
+ width: 100%;
117
220
  }
118
221
 
222
+ /* Horizontal */
223
+ .ui.animated.button .visible.content,
224
+ .ui.animated.button .hidden.content {
225
+ transition: right 0.3s ease 0s;
226
+ }
227
+ .ui.animated.button .visible.content {
228
+ left: auto;
229
+ right: 0%;
230
+ }
231
+ .ui.animated.button .hidden.content {
232
+ top: 50%;
233
+ left: auto;
234
+ right: -100%;
235
+ margin-top: -0.55em;
236
+ }
237
+ .ui.animated.button:hover .visible.content {
238
+ left: auto;
239
+ right: 200%;
240
+ }
241
+ .ui.animated.button:hover .hidden.content {
242
+ left: auto;
243
+ right: 0%;
244
+ }
245
+
246
+ /* Vertical */
247
+ .ui.vertical.animated.button .visible.content,
248
+ .ui.vertical.animated.button .hidden.content {
249
+ transition: top 0.3s ease 0s, transform 0.3s ease 0s;
250
+ }
251
+ .ui.vertical.animated.button .visible.content {
252
+ transform: translateY(0%);
253
+ right: auto;
254
+ }
255
+ .ui.vertical.animated.button .hidden.content {
256
+ top: -100%;
257
+ left: 0%;
258
+ right: auto;
259
+ }
260
+ .ui.vertical.animated.button:hover .visible.content {
261
+ transform: translateY(200%);
262
+ right: auto;
263
+ }
264
+ .ui.vertical.animated.button:hover .hidden.content {
265
+ top: 50%;
266
+ right: auto;
267
+ }
268
+
269
+ /* Fade */
270
+ .ui.fade.animated.button .visible.content,
271
+ .ui.fade.animated.button .hidden.content {
272
+ transition: opacity 0.3s ease 0s, transform 0.3s ease 0s;
273
+ }
274
+ .ui.fade.animated.button .visible.content {
275
+ left: auto;
276
+ right: auto;
277
+ opacity: 1;
278
+ transform: scale(1);
279
+ }
280
+ .ui.fade.animated.button .hidden.content {
281
+ opacity: 0;
282
+ left: 0%;
283
+ right: auto;
284
+ transform: scale(1.2);
285
+ }
286
+ .ui.fade.animated.button:hover .visible.content {
287
+ left: auto;
288
+ right: auto;
289
+ opacity: 0;
290
+ transform: scale(0.7);
291
+ }
292
+ .ui.fade.animated.button:hover .hidden.content {
293
+ left: 0%;
294
+ right: auto;
295
+ opacity: 1;
296
+ transform: scale(1);
297
+ }
298
+
299
+
119
300
  /*-------------------
120
301
  Primary
121
302
  --------------------*/
@@ -123,17 +304,19 @@
123
304
  .ui.primary.buttons .button,
124
305
  .ui.primary.button {
125
306
  background-color: #D95C5C;
126
- color: #FFFFFF !important;
307
+ color: #FFFFFF;
127
308
  }
128
309
  .ui.primary.buttons .button:hover,
129
310
  .ui.primary.button:hover,
130
311
  .ui.primary.buttons .active.button,
131
312
  .ui.primary.button.active {
132
313
  background-color: #E75859;
314
+ color: #FFFFFF;
133
315
  }
134
316
  .ui.primary.buttons .button:active,
135
317
  .ui.primary.button:active {
136
318
  background-color: #D24B4C;
319
+ color: #FFFFFF;
137
320
  }
138
321
 
139
322
  /*-------------------
@@ -143,17 +326,19 @@
143
326
  .ui.secondary.buttons .button,
144
327
  .ui.secondary.button {
145
328
  background-color: #00B5AD;
146
- color: #FFFFFF !important;
329
+ color: #FFFFFF;
147
330
  }
148
331
  .ui.secondary.buttons .button:hover,
149
332
  .ui.secondary.button:hover,
150
333
  .ui.secondary.buttons .active.button,
151
334
  .ui.secondary.button.active {
152
335
  background-color: #009A93;
336
+ color: #FFFFFF;
153
337
  }
154
338
  .ui.secondary.buttons .button:active,
155
339
  .ui.secondary.button:active {
156
340
  background-color: #00847E;
341
+ color: #FFFFFF;
157
342
  }
158
343
 
159
344
  /*-------------------
@@ -163,86 +348,100 @@
163
348
  /* Facebook */
164
349
  .ui.facebook.button {
165
350
  background-color: #3B579D;
166
- color: #FFFFFF !important;
351
+ color: #FFFFFF;
167
352
  }
168
353
  .ui.facebook.button:hover {
169
354
  background-color: #3A59A9;
355
+ color: #FFFFFF;
170
356
  }
171
357
  .ui.facebook.button:active {
172
358
  background-color: #334F95;
359
+ color: #FFFFFF;
173
360
  }
174
361
 
175
362
  /* Twitter */
176
363
  .ui.twitter.button {
177
364
  background-color: #4092CC;
178
- color: #FFFFFF !important;
365
+ color: #FFFFFF;
179
366
  }
180
367
  .ui.twitter.button:hover {
181
368
  background-color: #399ADE;
369
+ color: #FFFFFF;
182
370
  }
183
371
  .ui.twitter.button:active {
184
372
  background-color: #3283BC;
373
+ color: #FFFFFF;
185
374
  }
186
375
 
187
376
  /* Google Plus */
188
377
  .ui.google.plus.button {
189
378
  background-color: #D34836;
190
- color: #FFFFFF !important;
379
+ color: #FFFFFF;
191
380
  }
192
381
  .ui.google.plus.button:hover {
193
382
  background-color: #E3432E;
383
+ color: #FFFFFF;
194
384
  }
195
385
  .ui.google.plus.button:active {
196
386
  background-color: #CA3A27;
387
+ color: #FFFFFF;
197
388
  }
198
389
 
199
390
  /* Linked In */
200
391
  .ui.linkedin.button {
201
392
  background-color: #1F88BE;
202
- color: #FFFFFF !important;
393
+ color: #FFFFFF;
203
394
  }
204
395
  .ui.linkedin.button:hover {
205
396
  background-color: #1394D6;
397
+ color: #FFFFFF;
206
398
  }
207
399
  .ui.linkedin.button:active {
208
400
  background-color: #1179AE;
401
+ color: #FFFFFF;
209
402
  }
210
403
 
211
404
  /* YouTube */
212
405
  .ui.youtube.button {
213
406
  background-color: #CC181E;
214
- color: #FFFFFF !important;
407
+ color: #FFFFFF;
215
408
  }
216
409
  .ui.youtube.button:hover {
217
410
  background-color: #DF0209;
411
+ color: #FFFFFF;
218
412
  }
219
413
  .ui.youtube.button:active {
220
414
  background-color: #A50006;
415
+ color: #FFFFFF;
221
416
  }
222
417
 
223
418
  /* Instagram */
224
419
  .ui.instagram.button {
225
420
  background-color: #49769C;
226
- color: #FFFFFF !important;
421
+ color: #FFFFFF;
227
422
  }
228
423
  .ui.instagram.button:hover {
229
424
  background-color: #4781B1;
425
+ color: #FFFFFF;
230
426
  }
231
427
  .ui.instagram.button:active {
232
428
  background-color: #38658A;
429
+ color: #FFFFFF;
233
430
  }
234
431
 
235
432
 
236
433
  /* Pinterest */
237
434
  .ui.pinterest.button {
238
435
  background-color: #00ACED;
239
- color: #FFFFFF !important;
436
+ color: #FFFFFF;
240
437
  }
241
438
  .ui.pinterest.button:hover {
242
439
  background-color: #00B9FF;
440
+ color: #FFFFFF;
243
441
  }
244
442
  .ui.pinterest.button:active {
245
443
  background-color: #009EDA;
444
+ color: #FFFFFF;
246
445
  }
247
446
 
248
447
  /*--------------
@@ -272,112 +471,11 @@
272
471
  }
273
472
 
274
473
 
275
-
276
- /*******************************
277
- States
278
- *******************************/
279
-
280
-
281
- /*--------------
282
- Active
283
- ---------------*/
284
-
285
- .ui.buttons .active.button,
286
- .ui.active.button {
287
- background-color: #EAEAEA;
288
- background-image: none;
289
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
290
- color: rgba(0, 0, 0, 0.7);
291
- }
292
-
293
-
294
- /*--------------
295
- Hover
296
- ---------------*/
297
-
298
- .ui.button:hover {
299
- background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08));
300
- color: rgba(0, 0, 0, 0.7);
301
- }
302
- .ui.button.active:hover {
303
- background-image: none;
304
- }
305
-
306
- .ui.button:hover .icon,
307
- .ui.button.hover .icon {
308
- opacity: 0.85;
309
- }
310
-
311
- /*--------------
312
- Down
313
- ---------------*/
314
-
315
- .ui.button:active,
316
- .ui.active.button:active {
317
- background-color: #F1F1F1;
318
- color: rgba(0, 0, 0, 0.7);
319
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important;
320
- }
321
-
322
- /*--------------
323
- Loading
324
- ---------------*/
325
-
326
- .ui.loading.button {
327
- position: relative;
328
- cursor: default;
329
-
330
- background-color: #F3F3F3 !important;
331
- color: transparent !important;
332
- background-image: none !important;
333
-
334
- -webkit-box-shadow: none !important;
335
- -moz-box-shadow: none !important;
336
- box-shadow: none !important;
337
-
338
- -webkit-transition: all 0s linear;
339
- -moz-transition: all 0s linear;
340
- -o-transition: all 0s linear;
341
- -ms-transition: all 0s linear;
342
- transition: all 0s linear;
343
- }
344
- .ui.loading.button:after {
345
- position: absolute;
346
- top: 0em;
347
- left: 0em;
348
- width: 100%;
349
- height: 100%;
350
- content: '';
351
- background: transparent url(../loader-mini.gif) no-repeat 50% 50%;
352
- }
353
-
354
- .ui.labeled.icon.loading.button .icon {
355
- background-color: transparent;
356
- -webkit-box-shadow: none;
357
- -moz-box-shadow: none;
358
- box-shadow: none;
359
- }
360
-
361
- /*-------------------
362
- Disabled
363
- --------------------*/
364
-
365
- .ui.disabled.button {
366
- cursor: default;
367
- color: #DDDDDD !important;
368
- background-color: rgba(50, 50, 50, 0.05) !important;
369
- background-image: none !important;
370
-
371
- -webkit-box-shadow: none !important;
372
- -moz-box-shadow: none !important;
373
- box-shadow: none !important;
374
- }
375
-
376
-
377
474
  /*******************************
378
475
  Variations
379
476
  *******************************/
380
477
 
478
+
381
479
  /*-------------------
382
480
  Floated
383
481
  --------------------*/
@@ -404,39 +502,77 @@
404
502
  font-size: 1rem;
405
503
  }
406
504
 
407
- .ui.buttons.mini .button,
505
+ .ui.mini.buttons .button,
506
+ .ui.mini.buttons .or,
507
+ .ui.mini.button {
508
+ font-size: 0.8rem;
509
+ }
510
+ .ui.mini.buttons .button,
408
511
  .ui.mini.button {
409
- font-size: 0.8125rem;
410
512
  padding: 0.6em 0.8em 0.73em;
411
513
  }
514
+ .ui.mini.icon.buttons .button,
515
+ .ui.mini.buttons .icon.button {
516
+ padding: 0.6em 0.6em 0.73em;
517
+ }
518
+
412
519
  .ui.tiny.buttons .button,
520
+ .ui.tiny.buttons .or,
413
521
  .ui.tiny.button {
414
522
  font-size: 0.875rem;
523
+ }
524
+ .ui.tiny.buttons .button,
525
+ .ui.tiny.buttons .button,
526
+ .ui.tiny.button {
415
527
  padding: 0.6em 0.8em 0.73em;
416
528
  }
529
+ .ui.tiny.icon.buttons .button,
530
+ .ui.tiny.buttons .icon.button {
531
+ padding: 0.6em 0.6em 0.73em;
532
+ }
533
+
417
534
  .ui.small.buttons .button,
535
+ .ui.small.buttons .or,
418
536
  .ui.small.button {
419
537
  font-size: 0.875rem;
420
538
  }
421
539
 
422
540
  .ui.large.buttons .button,
541
+ .ui.large.buttons .or,
423
542
  .ui.large.button {
424
543
  font-size: 1.125rem;
425
544
  }
426
545
  .ui.big.buttons .button,
546
+ .ui.big.buttons .or,
427
547
  .ui.big.button {
428
548
  font-size: 1.25rem;
429
549
  }
430
550
  .ui.huge.buttons .button,
551
+ .ui.huge.buttons .or,
431
552
  .ui.huge.button {
432
553
  font-size: 1.375rem;
433
554
  }
434
555
  .ui.massive.buttons .button,
556
+ .ui.massive.buttons .or,
435
557
  .ui.massive.button {
436
558
  font-size: 1.5rem;
437
559
  font-weight: bold;
438
560
  }
439
561
 
562
+ /* Or resize */
563
+ .ui.tiny.buttons .or:before,
564
+ .ui.mini.buttons .or:before {
565
+ width: 1.45em;
566
+ height: 1.55em;
567
+ line-height: 1.4;
568
+ margin-left: -0.725em;
569
+ margin-top: -0.25em;
570
+ }
571
+ .ui.tiny.buttons .or:after,
572
+ .ui.mini.buttons .or:after {
573
+ height: 1.45em;
574
+ }
575
+
440
576
  /* loading */
441
577
  .ui.huge.loading.button:after {
442
578
  background-image: url(../loader-small.gif);
@@ -473,9 +609,8 @@
473
609
  }
474
610
  .ui.icon.buttons .button > .icon,
475
611
  .ui.icon.button > .icon {
476
- opacity: 1;
612
+ opacity: 0.9;
477
613
  margin: 0em;
478
- vertical-align: top;
479
614
  }
480
615
 
481
616
 
@@ -508,6 +643,7 @@
508
643
 
509
644
  .ui.basic.buttons .button:hover,
510
645
  .ui.basic.button:hover {
646
+ background-image: none;
511
647
  color: #7F7F7F !important;
512
648
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset;
513
649
  -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset;
@@ -730,7 +866,7 @@
730
866
  position: relative;
731
867
  float: left;
732
868
  width: 0.3em;
733
- height: 1em;
869
+ height: 1.1em;
734
870
  z-index: 3;
735
871
  }
736
872
  .ui.buttons .or:before {
@@ -740,13 +876,13 @@
740
876
  content: 'or';
741
877
  background-color: #FFFFFF;
742
878
 
743
- margin-top: -0.15em;
879
+ margin-top: -0.1em;
744
880
  margin-left: -0.9em;
745
881
 
746
882
  width: 1.8em;
747
883
  height: 1.8em;
748
884
 
749
- line-height: 1.66;
885
+ line-height: 1.55;
750
886
  color: #AAAAAA;
751
887
  font-style: normal;
752
888
  font-weight: normal;
@@ -756,6 +892,8 @@
756
892
  -webkit-border-radius: 500px;
757
893
  border-radius: 500px;
758
894
 
895
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
896
+
759
897
  -webkit-box-sizing: border-box;
760
898
  -moz-box-sizing: border-box;
761
899
  -ms-box-sizing: border-box;
@@ -768,11 +906,12 @@
768
906
  content: ' ';
769
907
 
770
908
  width: 0.3em;
771
- height: 1.8em;
909
+ height: 1.7em;
772
910
 
773
911
  background-color: transparent;
774
- border-top: 0.6em solid #FFFFFF;
775
- border-bottom: 0.6em solid #FFFFFF;
912
+ border-top: 0.5em solid #FFFFFF;
913
+ border-bottom: 0.5em solid #FFFFFF;
914
+
776
915
  }
777
916
 
778
917
  /* Fluid Or */
@@ -873,36 +1012,47 @@
873
1012
  display: block;
874
1013
  width: 100%;
875
1014
  }
1015
+ .ui.\32.buttons > .button,
876
1016
  .ui.two.buttons > .button {
877
1017
  width: 50%;
878
1018
  }
1019
+ .ui.\33.buttons > .button,
879
1020
  .ui.three.buttons > .button {
880
1021
  width: 33.333%;
881
1022
  }
1023
+ .ui.\34.buttons > .button,
882
1024
  .ui.four.buttons > .button {
883
1025
  width: 25%;
884
1026
  }
1027
+ .ui.\35.buttons > .button,
885
1028
  .ui.five.buttons > .button {
886
1029
  width: 20%;
887
1030
  }
1031
+ .ui.\36.buttons > .button,
888
1032
  .ui.six.buttons > .button {
889
1033
  width: 16.666%;
890
1034
  }
1035
+ .ui.\37.buttons > .button,
891
1036
  .ui.seven.buttons > .button {
892
1037
  width: 14.285%;
893
1038
  }
1039
+ .ui.\38.buttons > .button,
894
1040
  .ui.eight.buttons > .button {
895
1041
  width: 12.500%;
896
1042
  }
1043
+ .ui.\39.buttons > .button,
897
1044
  .ui.nine.buttons > .button {
898
1045
  width: 11.11%;
899
1046
  }
1047
+ .ui.\31\30.buttons > .button,
900
1048
  .ui.ten.buttons > .button {
901
1049
  width: 10%;
902
1050
  }
1051
+ .ui.\31\31.buttons > .button,
903
1052
  .ui.eleven.buttons > .button {
904
1053
  width: 9.09%;
905
1054
  }
1055
+ .ui.\31\32.buttons > .button,
906
1056
  .ui.twelve.buttons > .button {
907
1057
  width: 8.3333%;
908
1058
  }
@@ -917,36 +1067,48 @@
917
1067
  -ms-box-sizing: border-box;
918
1068
  box-sizing: border-box;
919
1069
  }
1070
+
1071
+ .ui.\32.vertical.buttons > .button,
920
1072
  .ui.two.vertical.buttons > .button {
921
1073
  height: 50%;
922
1074
  }
1075
+ .ui.\33.vertical.buttons > .button,
923
1076
  .ui.three.vertical.buttons > .button {
924
1077
  height: 33.333%;
925
1078
  }
1079
+ .ui.\34.vertical.buttons > .button,
926
1080
  .ui.four.vertical.buttons > .button {
927
1081
  height: 25%;
928
1082
  }
1083
+ .ui.\35.vertical.buttons > .button,
929
1084
  .ui.five.vertical.buttons > .button {
930
1085
  height: 20%;
931
1086
  }
1087
+ .ui.\36.vertical.buttons > .button,
932
1088
  .ui.six.vertical.buttons > .button {
933
1089
  height: 16.666%;
934
1090
  }
1091
+ .ui.\37.vertical.buttons > .button,
935
1092
  .ui.seven.vertical.buttons > .button {
936
1093
  height: 14.285%;
937
1094
  }
1095
+ .ui.\38.vertical.buttons > .button,
938
1096
  .ui.eight.vertical.buttons > .button {
939
1097
  height: 12.500%;
940
1098
  }
1099
+ .ui.\39.vertical.buttons > .button,
941
1100
  .ui.nine.vertical.buttons > .button {
942
1101
  height: 11.11%;
943
1102
  }
1103
+ .ui.\31\30.vertical.buttons > .button,
944
1104
  .ui.ten.vertical.buttons > .button {
945
1105
  height: 10%;
946
1106
  }
1107
+ .ui.\31\31.vertical.buttons > .button,
947
1108
  .ui.eleven.vertical.buttons > .button {
948
1109
  height: 9.09%;
949
1110
  }
1111
+ .ui.\31\32.vertical.buttons > .button,
950
1112
  .ui.twelve.vertical.buttons > .button {
951
1113
  height: 8.3333%;
952
1114
  }
@@ -961,117 +1123,131 @@
961
1123
  .ui.black.buttons .button,
962
1124
  .ui.black.button {
963
1125
  background-color: #5C6166;
964
- color: #FFFFFF !important;
1126
+ color: #FFFFFF;
965
1127
  }
966
1128
  .ui.black.buttons .button:hover,
967
1129
  .ui.black.button:hover {
968
1130
  background-color: #4C4C4C;
1131
+ color: #FFFFFF;
969
1132
  }
970
1133
  .ui.black.buttons .button:active,
971
1134
  .ui.black.button:active {
972
1135
  background-color: #333333;
1136
+ color: #FFFFFF;
973
1137
  }
974
1138
 
975
1139
  /*--- Green ---*/
976
1140
  .ui.green.buttons .button,
977
1141
  .ui.green.button {
978
1142
  background-color: #5BBD72;
979
- color: #FFFFFF !important;
1143
+ color: #FFFFFF;
980
1144
  }
981
1145
  .ui.green.buttons .button:hover,
982
1146
  .ui.green.button:hover,
983
1147
  .ui.green.buttons .active.button,
984
1148
  .ui.green.button.active {
985
1149
  background-color: #58cb73;
1150
+ color: #FFFFFF;
986
1151
  }
987
1152
  .ui.green.buttons .button:active,
988
1153
  .ui.green.button:active {
989
1154
  background-color: #4CB164;
1155
+ color: #FFFFFF;
990
1156
  }
991
1157
 
992
1158
  /*--- Red ---*/
993
1159
  .ui.red.buttons .button,
994
1160
  .ui.red.button {
995
1161
  background-color: #D95C5C;
996
- color: #FFFFFF !important;
1162
+ color: #FFFFFF;
997
1163
  }
998
1164
  .ui.red.buttons .button:hover,
999
1165
  .ui.red.button:hover,
1000
1166
  .ui.red.buttons .active.button,
1001
1167
  .ui.red.button.active {
1002
1168
  background-color: #E75859;
1169
+ color: #FFFFFF;
1003
1170
  }
1004
1171
  .ui.red.buttons .button:active,
1005
1172
  .ui.red.button:active {
1006
1173
  background-color: #D24B4C;
1174
+ color: #FFFFFF;
1007
1175
  }
1008
1176
 
1009
1177
  /*--- Orange ---*/
1010
1178
  .ui.orange.buttons .button,
1011
1179
  .ui.orange.button {
1012
1180
  background-color: #E96633;
1013
- color: #FFFFFF !important;
1181
+ color: #FFFFFF;
1014
1182
  }
1015
1183
  .ui.orange.buttons .button:hover,
1016
1184
  .ui.orange.button:hover,
1017
1185
  .ui.orange.buttons .active.button,
1018
1186
  .ui.orange.button.active {
1019
1187
  background-color: #FF7038;
1188
+ color: #FFFFFF;
1020
1189
  }
1021
1190
  .ui.orange.buttons .button:active,
1022
1191
  .ui.orange.button:active {
1023
1192
  background-color: #DA683B;
1193
+ color: #FFFFFF;
1024
1194
  }
1025
1195
 
1026
1196
  /*--- Blue ---*/
1027
1197
  .ui.blue.buttons .button,
1028
1198
  .ui.blue.button {
1029
1199
  background-color: #6ECFF5;
1030
- color: #FFFFFF !important;
1200
+ color: #FFFFFF;
1031
1201
  }
1032
1202
  .ui.blue.buttons .button:hover,
1033
1203
  .ui.blue.button:hover,
1034
1204
  .ui.blue.buttons .active.button,
1035
1205
  .ui.blue.button.active {
1036
1206
  background-color: #1AB8F3;
1207
+ color: #FFFFFF;
1037
1208
  }
1038
1209
  .ui.blue.buttons .button:active,
1039
1210
  .ui.blue.button:active {
1040
1211
  background-color: #0AA5DF;
1212
+ color: #FFFFFF;
1041
1213
  }
1042
1214
 
1043
1215
  /*--- Purple ---*/
1044
1216
  .ui.purple.buttons .button,
1045
1217
  .ui.purple.button {
1046
1218
  background-color: #564F8A;
1047
- color: #FFFFFF !important;
1219
+ color: #FFFFFF;
1048
1220
  }
1049
1221
  .ui.purple.buttons .button:hover,
1050
1222
  .ui.purple.button:hover,
1051
1223
  .ui.purple.buttons .active.button,
1052
1224
  .ui.purple.button.active {
1053
1225
  background-color: #3E3773;
1226
+ color: #FFFFFF;
1054
1227
  }
1055
1228
  .ui.purple.buttons .button:active,
1056
1229
  .ui.purple.button:active {
1057
1230
  background-color: #2E2860;
1231
+ color: #FFFFFF;
1058
1232
  }
1059
1233
 
1060
1234
  /*--- Teal ---*/
1061
1235
  .ui.teal.buttons .button,
1062
1236
  .ui.teal.button {
1063
1237
  background-color: #00B5AD;
1064
- color: #FFFFFF !important;
1238
+ color: #FFFFFF;
1065
1239
  }
1066
1240
  .ui.teal.buttons .button:hover,
1067
1241
  .ui.teal.button:hover,
1068
1242
  .ui.teal.buttons .active.button,
1069
1243
  .ui.teal.button.active {
1070
1244
  background-color: #009A93;
1245
+ color: #FFFFFF;
1071
1246
  }
1072
1247
  .ui.teal.buttons .button:active,
1073
1248
  .ui.teal.button:active {
1074
1249
  background-color: #00847E;
1250
+ color: #FFFFFF;
1075
1251
  }
1076
1252
 
1077
1253
  /*---------------
@@ -1081,17 +1257,19 @@
1081
1257
  .ui.positive.buttons .button,
1082
1258
  .ui.positive.button {
1083
1259
  background-color: #5BBD72 !important;
1084
- color: #FFFFFF !important;
1260
+ color: #FFFFFF;
1085
1261
  }
1086
1262
  .ui.positive.buttons .button:hover,
1087
1263
  .ui.positive.button:hover,
1088
1264
  .ui.positive.buttons .active.button,
1089
1265
  .ui.positive.button.active {
1090
1266
  background-color: #58CB73 !important;
1267
+ color: #FFFFFF;
1091
1268
  }
1092
1269
  .ui.positive.buttons .button:active,
1093
1270
  .ui.positive.button:active {
1094
1271
  background-color: #4CB164 !important;
1272
+ color: #FFFFFF;
1095
1273
  }
1096
1274
 
1097
1275
 
@@ -1101,17 +1279,19 @@
1101
1279
  .ui.negative.buttons .button,
1102
1280
  .ui.negative.button {
1103
1281
  background-color: #D95C5C !important;
1104
- color: #FFFFFF !important;
1282
+ color: #FFFFFF;
1105
1283
  }
1106
1284
  .ui.negative.buttons .button:hover,
1107
1285
  .ui.negative.button:hover,
1108
1286
  .ui.negative.buttons .active.button,
1109
1287
  .ui.negative.button.active {
1110
1288
  background-color: #E75859 !important;
1289
+ color: #FFFFFF;
1111
1290
  }
1112
1291
  .ui.negative.buttons .button:active,
1113
1292
  .ui.negative.button:active {
1114
1293
  background-color: #D24B4C !important;
1294
+ color: #FFFFFF;
1115
1295
  }
1116
1296
 
1117
1297