fomantic-ui-sass 2.8.2 → 2.8.3

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 (33) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/fonts/semantic-ui/brand-icons.eot +0 -0
  3. data/app/assets/fonts/semantic-ui/brand-icons.svg +836 -636
  4. data/app/assets/fonts/semantic-ui/brand-icons.ttf +0 -0
  5. data/app/assets/fonts/semantic-ui/brand-icons.woff +0 -0
  6. data/app/assets/fonts/semantic-ui/brand-icons.woff2 +0 -0
  7. data/app/assets/fonts/semantic-ui/icons.eot +0 -0
  8. data/app/assets/fonts/semantic-ui/icons.svg +492 -341
  9. data/app/assets/fonts/semantic-ui/icons.ttf +0 -0
  10. data/app/assets/fonts/semantic-ui/icons.woff +0 -0
  11. data/app/assets/fonts/semantic-ui/icons.woff2 +0 -0
  12. data/app/assets/fonts/semantic-ui/outline-icons.eot +0 -0
  13. data/app/assets/fonts/semantic-ui/outline-icons.svg +14 -10
  14. data/app/assets/fonts/semantic-ui/outline-icons.ttf +0 -0
  15. data/app/assets/fonts/semantic-ui/outline-icons.woff +0 -0
  16. data/app/assets/fonts/semantic-ui/outline-icons.woff2 +0 -0
  17. data/app/assets/javascripts/semantic-ui/checkbox.js +1 -1
  18. data/app/assets/javascripts/semantic-ui/dropdown.js +37 -40
  19. data/app/assets/javascripts/semantic-ui/form.js +19 -9
  20. data/app/assets/javascripts/semantic-ui/popup.js +2 -2
  21. data/app/assets/javascripts/semantic-ui/search.js +2 -2
  22. data/app/assets/javascripts/semantic-ui/slider.js +6 -6
  23. data/app/assets/javascripts/semantic-ui/toast.js +2 -2
  24. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +31 -0
  25. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +16 -6
  26. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +36 -4
  27. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +20 -20
  28. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +9 -9
  29. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +1 -0
  30. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +3 -0
  31. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +34 -7
  32. data/lib/fomantic/ui/sass/version.rb +2 -2
  33. metadata +1 -1
@@ -519,10 +519,9 @@ $.fn.toast = function(parameters) {
519
519
  return string;
520
520
  }
521
521
  var
522
- badChars = /[&<>"'`]/g,
522
+ badChars = /[<>"'`]/g,
523
523
  shouldEscape = /[&<>"'`]/,
524
524
  escape = {
525
- "&": "&amp;",
526
525
  "<": "&lt;",
527
526
  ">": "&gt;",
528
527
  '"': "&quot;",
@@ -534,6 +533,7 @@ $.fn.toast = function(parameters) {
534
533
  }
535
534
  ;
536
535
  if(shouldEscape.test(string)) {
536
+ string = string.replace(/&(?![a-z0-9#]{1,6};)/, "&amp;");
537
537
  return string.replace(badChars, escapedChar);
538
538
  }
539
539
  return string;
@@ -39,6 +39,7 @@
39
39
  clear: both;
40
40
  margin: 0 0 1em;
41
41
  }
42
+ .ui.form .fields .fields,
42
43
  .ui.form .field:last-child,
43
44
  .ui.form .fields:last-child .field {
44
45
  margin-bottom: 0;
@@ -405,6 +406,36 @@
405
406
  -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset;
406
407
  box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset;
407
408
  }
409
+ .ui.form .ui.action.input:not(.left) input:not([type]):focus,
410
+ .ui.form .ui.action.input:not(.left) input[type="date"]:focus,
411
+ .ui.form .ui.action.input:not(.left) input[type="datetime-local"]:focus,
412
+ .ui.form .ui.action.input:not(.left) input[type="email"]:focus,
413
+ .ui.form .ui.action.input:not(.left) input[type="number"]:focus,
414
+ .ui.form .ui.action.input:not(.left) input[type="password"]:focus,
415
+ .ui.form .ui.action.input:not(.left) input[type="search"]:focus,
416
+ .ui.form .ui.action.input:not(.left) input[type="tel"]:focus,
417
+ .ui.form .ui.action.input:not(.left) input[type="time"]:focus,
418
+ .ui.form .ui.action.input:not(.left) input[type="text"]:focus,
419
+ .ui.form .ui.action.input:not(.left) input[type="file"]:focus,
420
+ .ui.form .ui.action.input:not(.left) input[type="url"]:focus {
421
+ border-top-right-radius: 0;
422
+ border-bottom-right-radius: 0;
423
+ }
424
+ .ui.form .ui.action.input.left input:not([type]),
425
+ .ui.form .ui.action.input.left input[type="date"],
426
+ .ui.form .ui.action.input.left input[type="datetime-local"],
427
+ .ui.form .ui.action.input.left input[type="email"],
428
+ .ui.form .ui.action.input.left input[type="number"],
429
+ .ui.form .ui.action.input.left input[type="password"],
430
+ .ui.form .ui.action.input.left input[type="search"],
431
+ .ui.form .ui.action.input.left input[type="tel"],
432
+ .ui.form .ui.action.input.left input[type="time"],
433
+ .ui.form .ui.action.input.left input[type="text"],
434
+ .ui.form .ui.action.input.left input[type="file"],
435
+ .ui.form .ui.action.input.left input[type="url"] {
436
+ border-bottom-left-radius: 0;
437
+ border-top-left-radius: 0;
438
+ }
408
439
  .ui.form textarea:focus {
409
440
  color: rgba(0, 0, 0, 0.95);
410
441
  border-color: #85B7D9;
@@ -1899,39 +1899,49 @@
1899
1899
  color: rgba(40, 40, 40, 0.3);
1900
1900
  }
1901
1901
  .ui.sortable.table > thead > tr > th:hover {
1902
- background: rgba(0, 0, 0, 0.05);
1903
1902
  color: rgba(0, 0, 0, 0.8);
1904
1903
  }
1904
+ .ui.sortable.table:not(.basic) > thead > tr > th:hover {
1905
+ background: rgba(0, 0, 0, 0.05);
1906
+ }
1905
1907
 
1906
1908
  /* Sorted */
1907
1909
  .ui.sortable.table thead th.sorted {
1908
- background: rgba(0, 0, 0, 0.05);
1909
1910
  color: rgba(0, 0, 0, 0.95);
1910
1911
  }
1912
+ .ui.sortable.table:not(.basic) thead th.sorted {
1913
+ background: rgba(0, 0, 0, 0.05);
1914
+ }
1911
1915
  .ui.sortable.table thead th.sorted:after {
1912
1916
  display: inline-block;
1913
1917
  }
1914
1918
 
1915
1919
  /* Sorted Hover */
1916
1920
  .ui.sortable.table thead th.sorted:hover {
1917
- background: rgba(0, 0, 0, 0.05);
1918
1921
  color: rgba(0, 0, 0, 0.95);
1919
1922
  }
1923
+ .ui.sortable.table:not(.basic) thead th.sorted:hover {
1924
+ background: rgba(0, 0, 0, 0.05);
1925
+ }
1920
1926
 
1921
1927
  /* Inverted */
1922
1928
  .ui.inverted.sortable.table thead th.sorted {
1929
+ color: #ffffff;
1930
+ }
1931
+ .ui.inverted.sortable.table:not(.basic) thead th.sorted {
1923
1932
  background: rgba(255, 255, 255, 0.15) -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
1924
1933
  background: rgba(255, 255, 255, 0.15) -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
1925
1934
  background: rgba(255, 255, 255, 0.15) linear-gradient(transparent, rgba(0, 0, 0, 0.05));
1926
- color: #ffffff;
1927
1935
  }
1928
1936
  .ui.inverted.sortable.table > thead > tr > th:hover {
1937
+ color: #ffffff;
1938
+ }
1939
+ .ui.inverted.sortable.table:not(.basic) > thead > tr > th:hover {
1929
1940
  background: rgba(255, 255, 255, 0.08) -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
1930
1941
  background: rgba(255, 255, 255, 0.08) -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
1931
1942
  background: rgba(255, 255, 255, 0.08) linear-gradient(transparent, rgba(0, 0, 0, 0.05));
1932
- color: #ffffff;
1933
1943
  }
1934
- .ui.inverted.sortable.table > thead > tr > th {
1944
+ .ui.inverted.sortable.table:not(.basic) > thead > tr > th {
1935
1945
  border-left-color: transparent;
1936
1946
  border-right-color: transparent;
1937
1947
  }
@@ -521,7 +521,7 @@ i.icons .inverted.corner.icon {
521
521
  text-shadow: -1px -1px 0 #1B1C1D, 1px -1px 0 #1B1C1D, -1px 1px 0 #1B1C1D, 1px 1px 0 #1B1C1D;
522
522
  }
523
523
  /*
524
- * Font Awesome 5.11.2 by @fontawesome [https://fontawesome.com]
524
+ * Font Awesome 5.12.0 by @fontawesome [https://fontawesome.com]
525
525
  * License - https://fontawesome.com/license (Icons: CC BY 4.0 License, Fonts: SIL OFL 1.1 License, CSS: MIT License)
526
526
  */
527
527
 
@@ -743,6 +743,9 @@ i.icon.backward:before {
743
743
  i.icon.bacon:before {
744
744
  content: "\f7e5";
745
745
  }
746
+ i.icon.bahai:before {
747
+ content: "\f666";
748
+ }
746
749
  i.icon.balance.scale:before {
747
750
  content: "\f24e";
748
751
  }
@@ -995,6 +998,9 @@ i.icon.car.crash:before {
995
998
  i.icon.car.side:before {
996
999
  content: "\f5e4";
997
1000
  }
1001
+ i.icon.caravan:before {
1002
+ content: "\f8ff";
1003
+ }
998
1004
  i.icon.caret.down:before {
999
1005
  content: "\f0d7";
1000
1006
  }
@@ -1247,6 +1253,9 @@ i.icon.compass:before {
1247
1253
  i.icon.compress:before {
1248
1254
  content: "\f066";
1249
1255
  }
1256
+ i.icon.compress.alternate:before {
1257
+ content: "\f422";
1258
+ }
1250
1259
  i.icon.compress.arrows.alternate:before {
1251
1260
  content: "\f78c";
1252
1261
  }
@@ -1475,6 +1484,9 @@ i.icon.exclamation.triangle:before {
1475
1484
  i.icon.expand:before {
1476
1485
  content: "\f065";
1477
1486
  }
1487
+ i.icon.expand.alternate:before {
1488
+ content: "\f424";
1489
+ }
1478
1490
  i.icon.expand.arrows.alternate:before {
1479
1491
  content: "\f31e";
1480
1492
  }
@@ -1883,9 +1895,6 @@ i.icon.hat.cowboy.side:before {
1883
1895
  i.icon.hat.wizard:before {
1884
1896
  content: "\f6e8";
1885
1897
  }
1886
- i.icon.haykal:before {
1887
- content: "\f666";
1888
- }
1889
1898
  i.icon.hdd:before {
1890
1899
  content: "\f0a0";
1891
1900
  }
@@ -3179,6 +3188,9 @@ i.icon.trademark:before {
3179
3188
  i.icon.traffic.light:before {
3180
3189
  content: "\f637";
3181
3190
  }
3191
+ i.icon.trailer:before {
3192
+ content: "\f941";
3193
+ }
3182
3194
  i.icon.train:before {
3183
3195
  content: "\f238";
3184
3196
  }
@@ -5386,6 +5398,10 @@ i.icon.firefox:before {
5386
5398
  content: "\f269";
5387
5399
  font-family: 'brand-icons';
5388
5400
  }
5401
+ i.icon.firefox.browser:before {
5402
+ content: "\f907";
5403
+ font-family: 'brand-icons';
5404
+ }
5389
5405
  i.icon.first.order:before {
5390
5406
  content: "\f2b0";
5391
5407
  font-family: 'brand-icons';
@@ -5626,6 +5642,10 @@ i.icon.hubspot:before {
5626
5642
  content: "\f3b2";
5627
5643
  font-family: 'brand-icons';
5628
5644
  }
5645
+ i.icon.ideal:before {
5646
+ content: "\f913";
5647
+ font-family: 'brand-icons';
5648
+ }
5629
5649
  i.icon.imdb:before {
5630
5650
  content: "\f2d8";
5631
5651
  font-family: 'brand-icons';
@@ -5822,6 +5842,10 @@ i.icon.mendeley:before {
5822
5842
  content: "\f7b3";
5823
5843
  font-family: 'brand-icons';
5824
5844
  }
5845
+ i.icon.microblog:before {
5846
+ content: "\f91a";
5847
+ font-family: 'brand-icons';
5848
+ }
5825
5849
  i.icon.microsoft:before {
5826
5850
  content: "\f3ca";
5827
5851
  font-family: 'brand-icons';
@@ -5974,6 +5998,10 @@ i.icon.pied.piper.pp:before {
5974
5998
  content: "\f1a7";
5975
5999
  font-family: 'brand-icons';
5976
6000
  }
6001
+ i.icon.pied.piper.square:before {
6002
+ content: "\f91e";
6003
+ font-family: 'brand-icons';
6004
+ }
5977
6005
  i.icon.pinterest:before {
5978
6006
  content: "\f0d2";
5979
6007
  font-family: 'brand-icons';
@@ -6370,6 +6398,10 @@ i.icon.uniregistry:before {
6370
6398
  content: "\f404";
6371
6399
  font-family: 'brand-icons';
6372
6400
  }
6401
+ i.icon.unity:before {
6402
+ content: "\f949";
6403
+ font-family: 'brand-icons';
6404
+ }
6373
6405
  i.icon.untappd:before {
6374
6406
  content: "\f405";
6375
6407
  font-family: 'brand-icons';
@@ -496,93 +496,93 @@
496
496
  .ui.form > .field.error > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
497
497
  .ui.action.input.error > .ui.button,
498
498
  .ui.labeled.input.error:not([class*="corner labeled"]) > .ui.label {
499
- border-top: 1px solid #9F3A38;
500
- border-bottom: 1px solid #9F3A38;
499
+ border-top: 1px solid #E0B4B4;
500
+ border-bottom: 1px solid #E0B4B4;
501
501
  }
502
502
  .ui.form > .field.error > .ui.left.action.input > .ui.button,
503
503
  .ui.form > .field.error > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
504
504
  .ui.left.action.input.error > .ui.button,
505
505
  .ui.labeled.input.error:not(.right):not([class*="corner labeled"]) > .ui.label {
506
- border-left: 1px solid #9F3A38;
506
+ border-left: 1px solid #E0B4B4;
507
507
  }
508
508
  .ui.form > .field.error > .ui.action.input:not(.left) > input + .ui.button,
509
509
  .ui.form > .field.error > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
510
510
  .ui.action.input.error:not(.left) > input + .ui.button,
511
511
  .ui.right.labeled.input.error:not([class*="corner labeled"]) > input + .ui.label {
512
- border-right: 1px solid #9F3A38;
512
+ border-right: 1px solid #E0B4B4;
513
513
  }
514
514
  .ui.form > .field.error > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
515
515
  .ui.right.labeled.input.error:not([class*="corner labeled"]) > .ui.label:first-child {
516
- border-left: 1px solid #9F3A38;
516
+ border-left: 1px solid #E0B4B4;
517
517
  }
518
518
  .ui.form > .field.info > .ui.action.input > .ui.button,
519
519
  .ui.form > .field.info > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
520
520
  .ui.action.input.info > .ui.button,
521
521
  .ui.labeled.input.info:not([class*="corner labeled"]) > .ui.label {
522
- border-top: 1px solid #276F86;
523
- border-bottom: 1px solid #276F86;
522
+ border-top: 1px solid #A9D5DE;
523
+ border-bottom: 1px solid #A9D5DE;
524
524
  }
525
525
  .ui.form > .field.info > .ui.left.action.input > .ui.button,
526
526
  .ui.form > .field.info > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
527
527
  .ui.left.action.input.info > .ui.button,
528
528
  .ui.labeled.input.info:not(.right):not([class*="corner labeled"]) > .ui.label {
529
- border-left: 1px solid #276F86;
529
+ border-left: 1px solid #A9D5DE;
530
530
  }
531
531
  .ui.form > .field.info > .ui.action.input:not(.left) > input + .ui.button,
532
532
  .ui.form > .field.info > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
533
533
  .ui.action.input.info:not(.left) > input + .ui.button,
534
534
  .ui.right.labeled.input.info:not([class*="corner labeled"]) > input + .ui.label {
535
- border-right: 1px solid #276F86;
535
+ border-right: 1px solid #A9D5DE;
536
536
  }
537
537
  .ui.form > .field.info > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
538
538
  .ui.right.labeled.input.info:not([class*="corner labeled"]) > .ui.label:first-child {
539
- border-left: 1px solid #276F86;
539
+ border-left: 1px solid #A9D5DE;
540
540
  }
541
541
  .ui.form > .field.success > .ui.action.input > .ui.button,
542
542
  .ui.form > .field.success > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
543
543
  .ui.action.input.success > .ui.button,
544
544
  .ui.labeled.input.success:not([class*="corner labeled"]) > .ui.label {
545
- border-top: 1px solid #2C662D;
546
- border-bottom: 1px solid #2C662D;
545
+ border-top: 1px solid #A3C293;
546
+ border-bottom: 1px solid #A3C293;
547
547
  }
548
548
  .ui.form > .field.success > .ui.left.action.input > .ui.button,
549
549
  .ui.form > .field.success > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
550
550
  .ui.left.action.input.success > .ui.button,
551
551
  .ui.labeled.input.success:not(.right):not([class*="corner labeled"]) > .ui.label {
552
- border-left: 1px solid #2C662D;
552
+ border-left: 1px solid #A3C293;
553
553
  }
554
554
  .ui.form > .field.success > .ui.action.input:not(.left) > input + .ui.button,
555
555
  .ui.form > .field.success > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
556
556
  .ui.action.input.success:not(.left) > input + .ui.button,
557
557
  .ui.right.labeled.input.success:not([class*="corner labeled"]) > input + .ui.label {
558
- border-right: 1px solid #2C662D;
558
+ border-right: 1px solid #A3C293;
559
559
  }
560
560
  .ui.form > .field.success > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
561
561
  .ui.right.labeled.input.success:not([class*="corner labeled"]) > .ui.label:first-child {
562
- border-left: 1px solid #2C662D;
562
+ border-left: 1px solid #A3C293;
563
563
  }
564
564
  .ui.form > .field.warning > .ui.action.input > .ui.button,
565
565
  .ui.form > .field.warning > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
566
566
  .ui.action.input.warning > .ui.button,
567
567
  .ui.labeled.input.warning:not([class*="corner labeled"]) > .ui.label {
568
- border-top: 1px solid #573A08;
569
- border-bottom: 1px solid #573A08;
568
+ border-top: 1px solid #C9BA9B;
569
+ border-bottom: 1px solid #C9BA9B;
570
570
  }
571
571
  .ui.form > .field.warning > .ui.left.action.input > .ui.button,
572
572
  .ui.form > .field.warning > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
573
573
  .ui.left.action.input.warning > .ui.button,
574
574
  .ui.labeled.input.warning:not(.right):not([class*="corner labeled"]) > .ui.label {
575
- border-left: 1px solid #573A08;
575
+ border-left: 1px solid #C9BA9B;
576
576
  }
577
577
  .ui.form > .field.warning > .ui.action.input:not(.left) > input + .ui.button,
578
578
  .ui.form > .field.warning > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
579
579
  .ui.action.input.warning:not(.left) > input + .ui.button,
580
580
  .ui.right.labeled.input.warning:not([class*="corner labeled"]) > input + .ui.label {
581
- border-right: 1px solid #573A08;
581
+ border-right: 1px solid #C9BA9B;
582
582
  }
583
583
  .ui.form > .field.warning > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
584
584
  .ui.right.labeled.input.warning:not([class*="corner labeled"]) > .ui.label:first-child {
585
- border-left: 1px solid #573A08;
585
+ border-left: 1px solid #C9BA9B;
586
586
  }
587
587
 
588
588
  /*--------------------
@@ -64,7 +64,7 @@
64
64
 
65
65
  /* Loose Coupling */
66
66
  .ui.segment > .ui.dimmer:not(.page) {
67
- border-radius: inherit !important;
67
+ border-radius: inherit;
68
68
  }
69
69
 
70
70
  /* Scrollbars */
@@ -287,16 +287,16 @@ body.dimmable > .dimmer {
287
287
  transform: translateY(-50%);
288
288
  -webkit-transform: translateY(calc(-50% - 0.5px));
289
289
  }
290
- .ui.segment > .ui[class*="top dimmer"] {
291
- border-bottom-left-radius: 0 !important;
292
- border-bottom-right-radius: 0 !important;
290
+ .ui.segment > .ui.ui[class*="top dimmer"] {
291
+ border-bottom-left-radius: 0;
292
+ border-bottom-right-radius: 0;
293
293
  }
294
- .ui.segment > .ui[class*="center dimmer"] {
295
- border-radius: 0 !important;
294
+ .ui.segment > .ui.ui[class*="center dimmer"] {
295
+ border-radius: 0;
296
296
  }
297
- .ui.segment > .ui[class*="bottom dimmer"] {
298
- border-top-left-radius: 0 !important;
299
- border-top-right-radius: 0 !important;
297
+ .ui.segment > .ui.ui[class*="bottom dimmer"] {
298
+ border-top-left-radius: 0;
299
+ border-top-right-radius: 0;
300
300
  }
301
301
  .ui[class*="center dimmer"].transition[class*="fade up"].in {
302
302
  -webkit-animation-name: fadeInUpCenter;
@@ -116,6 +116,7 @@
116
116
  display: block;
117
117
  border: none;
118
118
  height: auto;
119
+ min-height: 2.57142857rem;
119
120
  text-align: left;
120
121
  border-top: none;
121
122
  line-height: 1em;
@@ -463,9 +463,11 @@
463
463
  top: 0;
464
464
  border-radius: 0;
465
465
  }
466
+ .ui.modal > .close.inside + .header,
466
467
  .ui.fullscreen.modal > .header {
467
468
  padding-right: 2.25rem;
468
469
  }
470
+ .ui.modal > .close.inside,
469
471
  .ui.fullscreen.modal > .close {
470
472
  top: 1.0535rem;
471
473
  right: 1rem;
@@ -740,6 +742,7 @@
740
742
  color: #FFFFFF;
741
743
  }
742
744
  }
745
+ .ui.inverted.modal > .close.inside,
743
746
  .ui.inverted.fullscreen.modal > .close {
744
747
  color: #FFFFFF;
745
748
  }
@@ -137,32 +137,31 @@
137
137
  [data-tooltip]:after {
138
138
  pointer-events: none;
139
139
  visibility: hidden;
140
+ opacity: 0;
141
+ -webkit-transition: opacity 0.1s ease, -webkit-transform 0.1s ease;
142
+ transition: opacity 0.1s ease, -webkit-transform 0.1s ease;
143
+ transition: transform 0.1s ease, opacity 0.1s ease;
144
+ transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease;
140
145
  }
141
146
  [data-tooltip]:before {
142
- opacity: 0;
143
147
  -webkit-transform: rotate(45deg) scale(0) !important;
144
148
  transform: rotate(45deg) scale(0) !important;
145
149
  -webkit-transform-origin: center top;
146
150
  transform-origin: center top;
147
- -webkit-transition: all 0.1s ease;
148
- transition: all 0.1s ease;
149
151
  }
150
152
  [data-tooltip]:after {
151
- opacity: 1;
152
153
  -webkit-transform-origin: center bottom;
153
154
  transform-origin: center bottom;
154
- -webkit-transition: all 0.1s ease;
155
- transition: all 0.1s ease;
156
155
  }
157
156
  [data-tooltip]:hover:before,
158
157
  [data-tooltip]:hover:after {
159
158
  visibility: visible;
160
159
  pointer-events: auto;
160
+ opacity: 1;
161
161
  }
162
162
  [data-tooltip]:hover:before {
163
163
  -webkit-transform: rotate(45deg) scale(1) !important;
164
164
  transform: rotate(45deg) scale(1) !important;
165
- opacity: 1;
166
165
  }
167
166
 
168
167
  /* Animation Position */
@@ -201,6 +200,21 @@
201
200
  -webkit-transform: scale(1) !important;
202
201
  transform: scale(1) !important;
203
202
  }
203
+ [data-tooltip][data-variation~="fixed"]:after {
204
+ white-space: normal;
205
+ width: 250px;
206
+ }
207
+ [data-tooltip][data-variation*="wide fixed"]:after {
208
+ width: 350px;
209
+ }
210
+ [data-tooltip][data-variation*="very wide fixed"]:after {
211
+ width: 550px;
212
+ }
213
+ @media only screen and (max-width: 767.98px) {
214
+ [data-tooltip][data-variation~="fixed"]:after {
215
+ width: 250px;
216
+ }
217
+ }
204
218
 
205
219
  /*--------------
206
220
  Inverted
@@ -660,6 +674,9 @@
660
674
  .ui.basic.popup:before {
661
675
  display: none;
662
676
  }
677
+ .ui.fixed.popup {
678
+ width: 250px;
679
+ }
663
680
 
664
681
  /*--------------
665
682
  Wide
@@ -668,14 +685,24 @@
668
685
  .ui.wide.popup {
669
686
  max-width: 350px;
670
687
  }
688
+ .ui.wide.popup.fixed {
689
+ width: 350px;
690
+ }
671
691
  .ui[class*="very wide"].popup {
672
692
  max-width: 550px;
673
693
  }
694
+ .ui[class*="very wide"].popup.fixed {
695
+ width: 550px;
696
+ }
674
697
  @media only screen and (max-width: 767.98px) {
675
698
  .ui.wide.popup,
676
699
  .ui[class*="very wide"].popup {
677
700
  max-width: 250px;
678
701
  }
702
+ .ui.wide.popup.fixed,
703
+ .ui[class*="very wide"].popup.fixed {
704
+ width: 250px;
705
+ }
679
706
  }
680
707
 
681
708
  /*--------------