semantic-ui-sass 2.3.1.1 → 2.4.3.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (76) hide show
  1. checksums.yaml +4 -4
  2. data/.travis.yml +4 -2
  3. data/CHANGELOG.md +126 -98
  4. data/README.md +56 -2
  5. data/app/assets/fonts/semantic-ui/icons.eot +0 -0
  6. data/app/assets/fonts/semantic-ui/icons.otf +0 -0
  7. data/app/assets/fonts/semantic-ui/icons.svg +1515 -944
  8. data/app/assets/fonts/semantic-ui/icons.ttf +0 -0
  9. data/app/assets/fonts/semantic-ui/icons.woff +0 -0
  10. data/app/assets/fonts/semantic-ui/icons.woff2 +0 -0
  11. data/app/assets/fonts/semantic-ui/outline-icons.eot +0 -0
  12. data/app/assets/fonts/semantic-ui/outline-icons.svg +366 -0
  13. data/app/assets/fonts/semantic-ui/outline-icons.ttf +0 -0
  14. data/app/assets/fonts/semantic-ui/outline-icons.woff +0 -0
  15. data/app/assets/fonts/semantic-ui/outline-icons.woff2 +0 -0
  16. data/app/assets/javascripts/semantic-ui/dimmer.js +27 -4
  17. data/app/assets/javascripts/semantic-ui/dropdown.js +41 -9
  18. data/app/assets/javascripts/semantic-ui/embed.js +11 -1
  19. data/app/assets/javascripts/semantic-ui/modal.js +85 -10
  20. data/app/assets/javascripts/semantic-ui/popup.js +14 -5
  21. data/app/assets/javascripts/semantic-ui/search.js +1 -1
  22. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +1 -1
  23. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +5 -5
  24. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +28 -28
  25. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +11 -11
  26. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +1 -1
  27. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +5 -5
  28. data/app/assets/stylesheets/semantic-ui/elements/_all.scss +2 -0
  29. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +153 -3
  30. data/app/assets/stylesheets/semantic-ui/elements/_container.scss +30 -31
  31. data/app/assets/stylesheets/semantic-ui/elements/_container_variables.scss +48 -0
  32. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +3 -3
  33. data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +2 -1
  34. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +1 -1
  35. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +36 -17
  36. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +1 -1
  37. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +1 -1
  38. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +22 -22
  39. data/app/assets/stylesheets/semantic-ui/elements/_list.scss +3 -1
  40. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +1 -1
  41. data/app/assets/stylesheets/semantic-ui/elements/_placeholder.scss +239 -0
  42. data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +1 -1
  43. data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +1 -1
  44. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +65 -3
  45. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +6 -6
  46. data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +1 -1
  47. data/app/assets/stylesheets/semantic-ui/globals/_site.scss +39 -37
  48. data/app/assets/stylesheets/semantic-ui/globals/_variables.scss +46 -2
  49. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +1 -1
  50. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +1 -1
  51. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +27 -13
  52. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +38 -29
  53. data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +1 -1
  54. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +60 -35
  55. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +1 -1
  56. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +2 -2
  57. data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +1 -1
  58. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +1 -1
  59. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +4 -2
  60. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +1 -1
  61. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +1 -1
  62. data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +1 -1
  63. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +1 -1
  64. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +1 -1
  65. data/app/assets/stylesheets/semantic-ui/views/_ad.scss +2 -2
  66. data/app/assets/stylesheets/semantic-ui/views/_card.scss +4 -4
  67. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +1 -1
  68. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +1 -1
  69. data/app/assets/stylesheets/semantic-ui/views/_item.scss +4 -4
  70. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +23 -26
  71. data/lib/semantic-ui-sass.rb +2 -2
  72. data/lib/semantic/ui/sass/version.rb +2 -2
  73. data/semantic-ui-sass.gemspec +2 -2
  74. data/spec/dummy/app/assets/config/manifest.js +3 -0
  75. data/tasks/converter.rb +29 -2
  76. metadata +21 -13
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - List
2
+ * # Semantic UI 2.4.2 - List
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -141,12 +141,14 @@ ol.ui.list ol li,
141
141
  .ui.list > .item > .image + .content,
142
142
  .ui.list > .item > .icon + .content {
143
143
  display: table-cell;
144
+ width: 100%;
144
145
  padding: 0em 0em 0em 0.5em;
145
146
  vertical-align: top;
146
147
  }
147
148
  .ui.list .list > .item > img.image + .content,
148
149
  .ui.list > .item > img.image + .content {
149
150
  display: inline-block;
151
+ width: auto;
150
152
  }
151
153
  .ui.list .list > .item > .content > .list,
152
154
  .ui.list > .item > .content > .list {
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Loader
2
+ * # Semantic UI 2.4.2 - Loader
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -0,0 +1,239 @@
1
+ /*!
2
+ * # Semantic UI 2.4.2 - Loader
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+ /*-------------------
12
+ Content
13
+ --------------------*/
14
+
15
+ .ui.placeholder {
16
+ position: static;
17
+ overflow: hidden;
18
+ -webkit-animation: placeholderShimmer 2s linear;
19
+ animation: placeholderShimmer 2s linear;
20
+ -webkit-animation-iteration-count: infinite;
21
+ animation-iteration-count: infinite;
22
+ background-color: #FFFFFF;
23
+ background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.08)), color-stop(15%, rgba(0, 0, 0, 0.15)), color-stop(30%, rgba(0, 0, 0, 0.08)));
24
+ background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.15) 15%, rgba(0, 0, 0, 0.08) 30%);
25
+ background-image: linear-gradient(to right, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.15) 15%, rgba(0, 0, 0, 0.08) 30%);
26
+ background-size: 1200px 100%;
27
+ max-width: 30rem;
28
+ }
29
+ @-webkit-keyframes placeholderShimmer {
30
+ 0% {
31
+ background-position: -1200px 0;
32
+ }
33
+ 100% {
34
+ background-position: 1200px 0;
35
+ }
36
+ }
37
+ @keyframes placeholderShimmer {
38
+ 0% {
39
+ background-position: -1200px 0;
40
+ }
41
+ 100% {
42
+ background-position: 1200px 0;
43
+ }
44
+ }
45
+ .ui.placeholder + .ui.placeholder {
46
+ margin-top: 2rem;
47
+ }
48
+ .ui.placeholder + .ui.placeholder {
49
+ -webkit-animation-delay: 0.15s;
50
+ animation-delay: 0.15s;
51
+ }
52
+ .ui.placeholder + .ui.placeholder + .ui.placeholder {
53
+ -webkit-animation-delay: 0.3s;
54
+ animation-delay: 0.3s;
55
+ }
56
+ .ui.placeholder + .ui.placeholder + .ui.placeholder + .ui.placeholder {
57
+ -webkit-animation-delay: 0.45s;
58
+ animation-delay: 0.45s;
59
+ }
60
+ .ui.placeholder + .ui.placeholder + .ui.placeholder + .ui.placeholder + .ui.placeholder {
61
+ -webkit-animation-delay: 0.6s;
62
+ animation-delay: 0.6s;
63
+ }
64
+ .ui.placeholder,
65
+ .ui.placeholder > :before,
66
+ .ui.placeholder .image.header:after,
67
+ .ui.placeholder .line,
68
+ .ui.placeholder .line:after {
69
+ background-color: #FFFFFF;
70
+ }
71
+
72
+ /* Image */
73
+ .ui.placeholder .image:not(.header):not(.ui) {
74
+ height: 100px;
75
+ }
76
+ .ui.placeholder .square.image:not(.header) {
77
+ height: 0px;
78
+ overflow: hidden;
79
+
80
+ /* 1/1 aspect ratio */
81
+ padding-top: 100%;
82
+ }
83
+ .ui.placeholder .rectangular.image:not(.header) {
84
+ height: 0px;
85
+ overflow: hidden;
86
+
87
+ /* 4/3 aspect ratio */
88
+ padding-top: 75%;
89
+ }
90
+
91
+ /* Lines */
92
+ .ui.placeholder .line {
93
+ position: relative;
94
+ height: 0.85714286em;
95
+ }
96
+ .ui.placeholder .line:before,
97
+ .ui.placeholder .line:after {
98
+ top: 100%;
99
+ position: absolute;
100
+ content: '';
101
+ background-color: inherit;
102
+ }
103
+ .ui.placeholder .line:before {
104
+ left: 0px;
105
+ }
106
+ .ui.placeholder .line:after {
107
+ right: 0px;
108
+ }
109
+
110
+ /* Any Lines */
111
+ .ui.placeholder .line {
112
+ margin-bottom: 0.5em;
113
+ }
114
+ .ui.placeholder .line:before,
115
+ .ui.placeholder .line:after {
116
+ height: 0.5em;
117
+ }
118
+ .ui.placeholder .line:not(:first-child) {
119
+ margin-top: 0.5em;
120
+ }
121
+
122
+ /* Header Image + 2 Lines */
123
+ .ui.placeholder .header {
124
+ position: relative;
125
+ overflow: hidden;
126
+ }
127
+
128
+ /* Line Outdent */
129
+ .ui.placeholder .line:nth-child(1):after {
130
+ width: 0%;
131
+ }
132
+ .ui.placeholder .line:nth-child(2):after {
133
+ width: 50%;
134
+ }
135
+ .ui.placeholder .line:nth-child(3):after {
136
+ width: 10%;
137
+ }
138
+ .ui.placeholder .line:nth-child(4):after {
139
+ width: 35%;
140
+ }
141
+ .ui.placeholder .line:nth-child(5):after {
142
+ width: 65%;
143
+ }
144
+
145
+ /* Header Line 1 & 2*/
146
+ .ui.placeholder .header .line {
147
+ margin-bottom: 0.64285714em;
148
+ }
149
+ .ui.placeholder .header .line:before,
150
+ .ui.placeholder .header .line:after {
151
+ height: 0.64285714em;
152
+ }
153
+ .ui.placeholder .header .line:not(:first-child) {
154
+ margin-top: 0.64285714em;
155
+ }
156
+ .ui.placeholder .header .line:after {
157
+ width: 20%;
158
+ }
159
+ .ui.placeholder .header .line:nth-child(2):after {
160
+ width: 60%;
161
+ }
162
+ /* Image Header */
163
+ .ui.placeholder .image.header .line {
164
+ margin-left: 3em;
165
+ }
166
+ .ui.placeholder .image.header .line:before {
167
+ width: 0.71428571rem;
168
+ }
169
+ .ui.placeholder .image.header:after {
170
+ display: block;
171
+ height: 0.85714286em;
172
+ content: '';
173
+ margin-left: 3em;
174
+ }
175
+
176
+ /* Spacing */
177
+ .ui.placeholder .image .line:first-child,
178
+ .ui.placeholder .paragraph .line:first-child,
179
+ .ui.placeholder .header .line:first-child {
180
+ height: 0.01px;
181
+ }
182
+ .ui.placeholder .image:not(:first-child):before,
183
+ .ui.placeholder .paragraph:not(:first-child):before,
184
+ .ui.placeholder .header:not(:first-child):before {
185
+ height: 1.42857143em;
186
+ content: '';
187
+ display: block;
188
+ }
189
+
190
+ /* Inverted Content Loader */
191
+ .ui.inverted.placeholder {
192
+ background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.08)), color-stop(15%, rgba(255, 255, 255, 0.14)), color-stop(30%, rgba(255, 255, 255, 0.08)));
193
+ background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.14) 15%, rgba(255, 255, 255, 0.08) 30%);
194
+ background-image: linear-gradient(to right, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.14) 15%, rgba(255, 255, 255, 0.08) 30%);
195
+ }
196
+ .ui.inverted.placeholder,
197
+ .ui.inverted.placeholder > :before,
198
+ .ui.inverted.placeholder .image.header:after,
199
+ .ui.inverted.placeholder .line,
200
+ .ui.inverted.placeholder .line:after {
201
+ background-color: #1B1C1D;
202
+ }
203
+
204
+
205
+ /*******************************
206
+ Variations
207
+ *******************************/
208
+
209
+
210
+ /*-------------------
211
+ Sizes
212
+ --------------------*/
213
+
214
+ .ui.placeholder .full.line.line.line:after {
215
+ width: 0%;
216
+ }
217
+ .ui.placeholder .very.long.line.line.line:after {
218
+ width: 10%;
219
+ }
220
+ .ui.placeholder .long.line.line.line:after {
221
+ width: 35%;
222
+ }
223
+ .ui.placeholder .medium.line.line.line:after {
224
+ width: 50%;
225
+ }
226
+ .ui.placeholder .short.line.line.line:after {
227
+ width: 65%;
228
+ }
229
+ .ui.placeholder .very.short.line.line.line:after {
230
+ width: 80%;
231
+ }
232
+
233
+ /*-------------------
234
+ Fluid
235
+ --------------------*/
236
+
237
+ .ui.fluid.placeholder {
238
+ max-width: none;
239
+ }
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Rail
2
+ * # Semantic UI 2.4.2 - Rail
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Reveal
2
+ * # Semantic UI 2.4.2 - Reveal
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Segment
2
+ * # Semantic UI 2.4.2 - Segment
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -103,6 +103,68 @@
103
103
  *******************************/
104
104
 
105
105
 
106
+ /*-------------------
107
+ Placeholder
108
+ --------------------*/
109
+
110
+ .ui.placeholder.segment {
111
+ display: -webkit-box;
112
+ display: -ms-flexbox;
113
+ display: flex;
114
+ -webkit-box-orient: vertical;
115
+ -webkit-box-direction: normal;
116
+ -ms-flex-direction: column;
117
+ flex-direction: column;
118
+ -webkit-box-pack: center;
119
+ -ms-flex-pack: center;
120
+ justify-content: center;
121
+ -webkit-box-align: stretch;
122
+ -ms-flex-align: stretch;
123
+ align-items: stretch;
124
+ max-width: initial;
125
+ -webkit-animation: none;
126
+ animation: none;
127
+ overflow: visible;
128
+ padding: 1em 1em;
129
+ min-height: 18rem;
130
+ background: #F9FAFB;
131
+ border-color: rgba(34, 36, 38, 0.15);
132
+ -webkit-box-shadow: 0px 2px 25px 0 rgba(34, 36, 38, 0.05) inset;
133
+ box-shadow: 0px 2px 25px 0 rgba(34, 36, 38, 0.05) inset;
134
+ }
135
+ .ui.placeholder.segment .button,
136
+ .ui.placeholder.segment textarea {
137
+ display: block;
138
+ }
139
+ .ui.placeholder.segment .field,
140
+ .ui.placeholder.segment textarea,
141
+ .ui.placeholder.segment > .ui.input,
142
+ .ui.placeholder.segment .button {
143
+ max-width: 15rem;
144
+ margin-left: auto;
145
+ margin-right: auto;
146
+ }
147
+ .ui.placeholder.segment .column .button,
148
+ .ui.placeholder.segment .column .field,
149
+ .ui.placeholder.segment .column textarea,
150
+ .ui.placeholder.segment .column > .ui.input {
151
+ max-width: 15rem;
152
+ margin-left: auto;
153
+ margin-right: auto;
154
+ }
155
+ .ui.placeholder.segment > .inline {
156
+ -ms-flex-item-align: center;
157
+ align-self: center;
158
+ }
159
+ .ui.placeholder.segment > .inline > .button {
160
+ display: inline-block;
161
+ width: auto;
162
+ margin: 0px 0.35714286rem 0px 0px;
163
+ }
164
+ .ui.placeholder.segment > .inline > .button:last-child {
165
+ margin-right: 0px;
166
+ }
167
+
106
168
  /*-------------------
107
169
  Piled
108
170
  --------------------*/
@@ -731,8 +793,8 @@
731
793
  bottom: 0px;
732
794
  border-radius: 0px;
733
795
  margin: 0em -1px;
734
- width: calc(100% + 2px );
735
- max-width: calc(100% + 2px );
796
+ width: calc(100% - (-1px * 2));
797
+ max-width: calc(100% - (-1px * 2));
736
798
  -webkit-box-shadow: none;
737
799
  box-shadow: none;
738
800
  border: 1px solid #D4D4D5;
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Step
2
+ * # Semantic UI 2.4.2 - Step
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -283,7 +283,7 @@
283
283
 
284
284
 
285
285
  /* Mobile (Default) */
286
- @media only screen and (max-width: 767px) {
286
+ @media only screen and (max-width: $largest-mobile-screen) {
287
287
  .ui.steps:not(.unstackable) {
288
288
  display: -webkit-inline-box;
289
289
  display: -ms-inline-flexbox;
@@ -425,7 +425,7 @@
425
425
 
426
426
 
427
427
  /* Tablet Or Below */
428
- @media only screen and (max-width: 991px) {
428
+ @media only screen and (max-width: $largest-tablet-screen) {
429
429
  .ui[class*="tablet stackable"].steps {
430
430
  display: -webkit-inline-box;
431
431
  display: -ms-inline-flexbox;
@@ -491,9 +491,9 @@
491
491
 
492
492
  /* Top */
493
493
  .ui.attached.steps {
494
- width: calc(100% + 2px ) !important;
494
+ width: calc(100% + (--1px * 2)) !important;
495
495
  margin: 0em -1px 0;
496
- max-width: calc(100% + 2px );
496
+ max-width: calc(100% + (--1px * 2));
497
497
  border-radius: 0.28571429rem 0.28571429rem 0em 0em;
498
498
  }
499
499
  .ui.attached.steps .step:first-child {
@@ -562,7 +562,7 @@
562
562
  width: 14.285%;
563
563
  }
564
564
  .ui.eight.steps > .step {
565
- width: 12.500%;
565
+ width: 12.5%;
566
566
  }
567
567
 
568
568
  /*-------------------
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Reset
2
+ * # Semantic UI 2.4.2 - Reset
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.3.1 - Site
2
+ * # Semantic UI 2.4.2 - Site
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -155,42 +155,44 @@ input::selection {
155
155
  color: rgba(0, 0, 0, 0.87);
156
156
  }
157
157
 
158
- /* Force Simple Scrollbars */
159
- body ::-webkit-scrollbar {
160
- -webkit-appearance: none;
161
- width: 10px;
162
- height: 10px;
163
- }
164
- body ::-webkit-scrollbar-track {
165
- background: rgba(0, 0, 0, 0.1);
166
- border-radius: 0px;
167
- }
168
- body ::-webkit-scrollbar-thumb {
169
- cursor: pointer;
170
- border-radius: 5px;
171
- background: rgba(0, 0, 0, 0.25);
172
- -webkit-transition: color 0.2s ease;
173
- transition: color 0.2s ease;
174
- }
175
- body ::-webkit-scrollbar-thumb:window-inactive {
176
- background: rgba(0, 0, 0, 0.15);
177
- }
178
- body ::-webkit-scrollbar-thumb:hover {
179
- background: rgba(128, 135, 139, 0.8);
180
- }
181
-
182
- /* Inverted UI */
183
- body .ui.inverted::-webkit-scrollbar-track {
184
- background: rgba(255, 255, 255, 0.1);
185
- }
186
- body .ui.inverted::-webkit-scrollbar-thumb {
187
- background: rgba(255, 255, 255, 0.25);
188
- }
189
- body .ui.inverted::-webkit-scrollbar-thumb:window-inactive {
190
- background: rgba(255, 255, 255, 0.15);
191
- }
192
- body .ui.inverted::-webkit-scrollbar-thumb:hover {
193
- background: rgba(255, 255, 255, 0.35);
158
+ @if $use-custom-scrollbars {
159
+ /* Force Simple Scrollbars */
160
+ body ::-webkit-scrollbar {
161
+ -webkit-appearance: none;
162
+ width: 10px;
163
+ height: 10px;
164
+ }
165
+ body ::-webkit-scrollbar-track {
166
+ background: rgba(0, 0, 0, 0.1);
167
+ border-radius: 0px;
168
+ }
169
+ body ::-webkit-scrollbar-thumb {
170
+ cursor: pointer;
171
+ border-radius: 5px;
172
+ background: rgba(0, 0, 0, 0.25);
173
+ -webkit-transition: color 0.2s ease;
174
+ transition: color 0.2s ease;
175
+ }
176
+ body ::-webkit-scrollbar-thumb:window-inactive {
177
+ background: rgba(0, 0, 0, 0.15);
178
+ }
179
+ body ::-webkit-scrollbar-thumb:hover {
180
+ background: rgba(128, 135, 139, 0.8);
181
+ }
182
+
183
+ /* Inverted UI */
184
+ body .ui.inverted::-webkit-scrollbar-track {
185
+ background: rgba(255, 255, 255, 0.1);
186
+ }
187
+ body .ui.inverted::-webkit-scrollbar-thumb {
188
+ background: rgba(255, 255, 255, 0.25);
189
+ }
190
+ body .ui.inverted::-webkit-scrollbar-thumb:window-inactive {
191
+ background: rgba(255, 255, 255, 0.15);
192
+ }
193
+ body .ui.inverted::-webkit-scrollbar-thumb:hover {
194
+ background: rgba(255, 255, 255, 0.35);
195
+ }
194
196
  }
195
197
 
196
198