semantic-ui-sass 2.2.14 → 2.3.0.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 (61) hide show
  1. checksums.yaml +5 -5
  2. data/CHANGELOG.md +5 -1
  3. data/app/assets/fonts/semantic-ui/icons.eot +0 -0
  4. data/app/assets/fonts/semantic-ui/icons.svg +946 -2670
  5. data/app/assets/fonts/semantic-ui/icons.ttf +0 -0
  6. data/app/assets/fonts/semantic-ui/icons.woff +0 -0
  7. data/app/assets/fonts/semantic-ui/icons.woff2 +0 -0
  8. data/app/assets/javascripts/semantic-ui/accordion.js +5 -2
  9. data/app/assets/javascripts/semantic-ui/dimmer.js +2 -0
  10. data/app/assets/javascripts/semantic-ui/form.js +1 -1
  11. data/app/assets/javascripts/semantic-ui/modal.js +34 -42
  12. data/app/assets/javascripts/semantic-ui/popup.js +45 -8
  13. data/app/assets/javascripts/semantic-ui/search.js +71 -18
  14. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +1 -1
  15. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +1 -1
  16. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +1 -1
  17. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +4 -4
  18. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +1 -1
  19. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +6 -1
  20. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +1 -1
  21. data/app/assets/stylesheets/semantic-ui/elements/_container.scss +1 -1
  22. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +1 -1
  23. data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +1 -1
  24. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +1 -1
  25. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +2911 -1842
  26. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +5 -1
  27. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +35 -35
  28. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +1 -1
  29. data/app/assets/stylesheets/semantic-ui/elements/_list.scss +1 -1
  30. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +1 -1
  31. data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +1 -1
  32. data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +1 -1
  33. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +1 -1
  34. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +1 -1
  35. data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +1 -1
  36. data/app/assets/stylesheets/semantic-ui/globals/_site.scss +1 -1
  37. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +1 -1
  38. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +1 -1
  39. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +36 -9
  40. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +1 -1
  41. data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +1 -1
  42. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +49 -48
  43. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +1 -1
  44. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +1 -1
  45. data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +1 -1
  46. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +1 -1
  47. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +34 -18
  48. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +1 -1
  49. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +1 -1
  50. data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +1 -1
  51. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +1 -1
  52. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +97 -2
  53. data/app/assets/stylesheets/semantic-ui/views/_ad.scss +1 -1
  54. data/app/assets/stylesheets/semantic-ui/views/_card.scss +1 -1
  55. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +1 -1
  56. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +1 -1
  57. data/app/assets/stylesheets/semantic-ui/views/_item.scss +1 -1
  58. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +1 -1
  59. data/lib/semantic/ui/sass/version.rb +2 -2
  60. data/tasks/converter.rb +1 -0
  61. metadata +3 -3
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Image
2
+ * # Semantic UI 2.3.0 - Image
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -44,6 +44,10 @@ img.ui.image {
44
44
  display: block;
45
45
  visibility: hidden;
46
46
  }
47
+ .ui.images > .hidden.transition {
48
+ display: inline-block;
49
+ visibility: hidden;
50
+ }
47
51
  .ui.disabled.images,
48
52
  .ui.disabled.image {
49
53
  cursor: default;
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Input
2
+ * # Semantic UI 2.3.0 - Input
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -27,7 +27,7 @@
27
27
  display: inline-flex;
28
28
  color: rgba(0, 0, 0, 0.87);
29
29
  }
30
- .ui.input input {
30
+ .ui.input > input {
31
31
  margin: 0em;
32
32
  max-width: 100%;
33
33
  -webkit-box-flex: 1;
@@ -57,13 +57,13 @@
57
57
 
58
58
 
59
59
  /* browsers require these rules separate */
60
- .ui.input input::-webkit-input-placeholder {
60
+ .ui.input > input::-webkit-input-placeholder {
61
61
  color: rgba(191, 191, 191, 0.87);
62
62
  }
63
- .ui.input input::-moz-placeholder {
63
+ .ui.input > input::-moz-placeholder {
64
64
  color: rgba(191, 191, 191, 0.87);
65
65
  }
66
- .ui.input input:-ms-input-placeholder {
66
+ .ui.input > input:-ms-input-placeholder {
67
67
  color: rgba(191, 191, 191, 0.87);
68
68
  }
69
69
 
@@ -81,7 +81,7 @@
81
81
  .ui.input:not(.disabled) input[disabled] {
82
82
  opacity: 0.45;
83
83
  }
84
- .ui.disabled.input input,
84
+ .ui.disabled.input > input,
85
85
  .ui.input:not(.disabled) input[disabled] {
86
86
  pointer-events: none;
87
87
  }
@@ -90,7 +90,7 @@
90
90
  Active
91
91
  ---------------------*/
92
92
 
93
- .ui.input input:active,
93
+ .ui.input > input:active,
94
94
  .ui.input.down input {
95
95
  border-color: rgba(0, 0, 0, 0.3);
96
96
  background: #FAFAFA;
@@ -138,24 +138,24 @@
138
138
  Focus
139
139
  ---------------------*/
140
140
 
141
- .ui.input.focus input,
142
- .ui.input input:focus {
141
+ .ui.input.focus > input,
142
+ .ui.input > input:focus {
143
143
  border-color: #85B7D9;
144
144
  background: #FFFFFF;
145
145
  color: rgba(0, 0, 0, 0.8);
146
146
  -webkit-box-shadow: none;
147
147
  box-shadow: none;
148
148
  }
149
- .ui.input.focus input::-webkit-input-placeholder,
150
- .ui.input input:focus::-webkit-input-placeholder {
149
+ .ui.input.focus > input::-webkit-input-placeholder,
150
+ .ui.input > input:focus::-webkit-input-placeholder {
151
151
  color: rgba(115, 115, 115, 0.87);
152
152
  }
153
- .ui.input.focus input::-moz-placeholder,
154
- .ui.input input:focus::-moz-placeholder {
153
+ .ui.input.focus > input::-moz-placeholder,
154
+ .ui.input > input:focus::-moz-placeholder {
155
155
  color: rgba(115, 115, 115, 0.87);
156
156
  }
157
- .ui.input.focus input:-ms-input-placeholder,
158
- .ui.input input:focus:-ms-input-placeholder {
157
+ .ui.input.focus > input:-ms-input-placeholder,
158
+ .ui.input > input:focus:-ms-input-placeholder {
159
159
  color: rgba(115, 115, 115, 0.87);
160
160
  }
161
161
 
@@ -163,7 +163,7 @@
163
163
  Error
164
164
  ---------------------*/
165
165
 
166
- .ui.input.error input {
166
+ .ui.input.error > input {
167
167
  background-color: #FFF6F6;
168
168
  border-color: #E0B4B4;
169
169
  color: #9F3A38;
@@ -172,24 +172,24 @@
172
172
  }
173
173
 
174
174
  /* Error Placeholder */
175
- .ui.input.error input::-webkit-input-placeholder {
175
+ .ui.input.error > input::-webkit-input-placeholder {
176
176
  color: #e7bdbc;
177
177
  }
178
- .ui.input.error input::-moz-placeholder {
178
+ .ui.input.error > input::-moz-placeholder {
179
179
  color: #e7bdbc;
180
180
  }
181
- .ui.input.error input:-ms-input-placeholder {
181
+ .ui.input.error > input:-ms-input-placeholder {
182
182
  color: #e7bdbc !important;
183
183
  }
184
184
 
185
185
  /* Focused Error Placeholder */
186
- .ui.input.error input:focus::-webkit-input-placeholder {
186
+ .ui.input.error > input:focus::-webkit-input-placeholder {
187
187
  color: #da9796;
188
188
  }
189
- .ui.input.error input:focus::-moz-placeholder {
189
+ .ui.input.error > input:focus::-moz-placeholder {
190
190
  color: #da9796;
191
191
  }
192
- .ui.input.error input:focus:-ms-input-placeholder {
192
+ .ui.input.error > input:focus:-ms-input-placeholder {
193
193
  color: #da9796 !important;
194
194
  }
195
195
 
@@ -203,7 +203,7 @@
203
203
  Transparent
204
204
  ---------------------*/
205
205
 
206
- .ui.transparent.input input {
206
+ .ui.transparent.input > input {
207
207
  border-color: transparent !important;
208
208
  background-color: transparent !important;
209
209
  padding: 0em !important;
@@ -229,16 +229,16 @@
229
229
  .ui.transparent.inverted.input {
230
230
  color: #FFFFFF;
231
231
  }
232
- .ui.transparent.inverted.input input {
232
+ .ui.transparent.inverted.input > input {
233
233
  color: inherit;
234
234
  }
235
- .ui.transparent.inverted.input input::-webkit-input-placeholder {
235
+ .ui.transparent.inverted.input > input::-webkit-input-placeholder {
236
236
  color: rgba(255, 255, 255, 0.5);
237
237
  }
238
- .ui.transparent.inverted.input input::-moz-placeholder {
238
+ .ui.transparent.inverted.input > input::-moz-placeholder {
239
239
  color: rgba(255, 255, 255, 0.5);
240
240
  }
241
- .ui.transparent.inverted.input input:-ms-input-placeholder {
241
+ .ui.transparent.inverted.input > input:-ms-input-placeholder {
242
242
  color: rgba(255, 255, 255, 0.5);
243
243
  }
244
244
 
@@ -264,7 +264,7 @@
264
264
  .ui.icon.input > i.icon:not(.link) {
265
265
  pointer-events: none;
266
266
  }
267
- .ui.icon.input input {
267
+ .ui.icon.input > input {
268
268
  padding-right: 2.67142857em !important;
269
269
  }
270
270
  .ui.icon.input > i.icon:before,
@@ -337,16 +337,16 @@
337
337
  }
338
338
 
339
339
  /* Regular Label on Right */
340
- .ui[class*="right labeled"].input input {
340
+ .ui[class*="right labeled"].input > input {
341
341
  border-top-right-radius: 0px !important;
342
342
  border-bottom-right-radius: 0px !important;
343
343
  border-right-color: transparent !important;
344
344
  }
345
- .ui[class*="right labeled"].input input + .label {
345
+ .ui[class*="right labeled"].input > input + .label {
346
346
  border-top-left-radius: 0px;
347
347
  border-bottom-left-radius: 0px;
348
348
  }
349
- .ui[class*="right labeled"].input input:focus {
349
+ .ui[class*="right labeled"].input > input:focus {
350
350
  border-right-color: #85B7D9 !important;
351
351
  }
352
352
 
@@ -359,7 +359,7 @@
359
359
  }
360
360
 
361
361
  /* Spacing with corner label */
362
- .ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input input {
362
+ .ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input > input {
363
363
  padding-right: 2.5em !important;
364
364
  }
365
365
  .ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > input {
@@ -370,7 +370,7 @@
370
370
  }
371
371
 
372
372
  /* Left Labeled */
373
- .ui[class*="left corner labeled"].labeled.input input {
373
+ .ui[class*="left corner labeled"].labeled.input > input {
374
374
  padding-left: 2.5em !important;
375
375
  }
376
376
  .ui[class*="left corner labeled"].icon.input > input {
@@ -431,7 +431,7 @@
431
431
  }
432
432
 
433
433
  /* Input Focus */
434
- .ui.action.input:not([class*="left action"]) input:focus {
434
+ .ui.action.input:not([class*="left action"]) > input:focus {
435
435
  border-right-color: #85B7D9 !important;
436
436
  }
437
437
 
@@ -463,7 +463,7 @@
463
463
 
464
464
 
465
465
  /* Standard */
466
- .ui.inverted.input input {
466
+ .ui.inverted.input > input {
467
467
  border: none;
468
468
  }
469
469
 
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Label
2
+ * # Semantic UI 2.3.0 - Label
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - List
2
+ * # Semantic UI 2.3.0 - List
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Loader
2
+ * # Semantic UI 2.3.0 - Loader
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Rail
2
+ * # Semantic UI 2.3.0 - Rail
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Reveal
2
+ * # Semantic UI 2.3.0 - Reveal
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Segment
2
+ * # Semantic UI 2.3.0 - Segment
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Step
2
+ * # Semantic UI 2.3.0 - Step
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Reset
2
+ * # Semantic UI 2.3.0 - Reset
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Site
2
+ * # Semantic UI 2.3.0 - Site
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Accordion
2
+ * # Semantic UI 2.3.0 - Accordion
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Checkbox
2
+ * # Semantic UI 2.3.0 - Checkbox
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Dimmer
2
+ * # Semantic UI 2.3.0 - Dimmer
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -25,6 +25,7 @@
25
25
  height: 100%;
26
26
  text-align: center;
27
27
  vertical-align: middle;
28
+ padding: 1em;
28
29
  background-color: rgba(0, 0, 0, 0.85);
29
30
  opacity: 0;
30
31
  line-height: 1;
@@ -34,6 +35,16 @@
34
35
  animation-duration: 0.5s;
35
36
  -webkit-transition: background-color 0.5s linear;
36
37
  transition: background-color 0.5s linear;
38
+ -webkit-box-orient: vertical;
39
+ -webkit-box-direction: normal;
40
+ -ms-flex-direction: column;
41
+ flex-direction: column;
42
+ -webkit-box-align: center;
43
+ -ms-flex-align: center;
44
+ align-items: center;
45
+ -webkit-box-pack: center;
46
+ -ms-flex-pack: center;
47
+ justify-content: center;
37
48
  -webkit-user-select: none;
38
49
  -moz-user-select: none;
39
50
  -ms-user-select: none;
@@ -44,17 +55,10 @@
44
55
 
45
56
  /* Dimmer Content */
46
57
  .ui.dimmer > .content {
47
- width: 100%;
48
- height: 100%;
49
- display: table;
50
58
  -webkit-user-select: text;
51
59
  -moz-user-select: text;
52
60
  -ms-user-select: text;
53
61
  user-select: text;
54
- }
55
- .ui.dimmer > .content > * {
56
- display: table-cell;
57
- vertical-align: middle;
58
62
  color: #FFFFFF;
59
63
  }
60
64
 
@@ -82,16 +86,24 @@
82
86
  States
83
87
  *******************************/
84
88
 
89
+
90
+ /* Animating */
85
91
  .animating.dimmable:not(body),
86
92
  .dimmed.dimmable:not(body) {
87
93
  overflow: hidden;
88
94
  }
95
+
96
+ /* Animating / Active / Visible */
89
97
  .dimmed.dimmable > .ui.animating.dimmer,
90
98
  .dimmed.dimmable > .ui.visible.dimmer,
91
99
  .ui.active.dimmer {
92
- display: block;
100
+ display: -webkit-box;
101
+ display: -ms-flexbox;
102
+ display: flex;
93
103
  opacity: 1;
94
104
  }
105
+
106
+ /* Disabled */
95
107
  .ui.disabled.dimmer {
96
108
  width: 0 !important;
97
109
  height: 0 !important;
@@ -103,6 +115,21 @@
103
115
  *******************************/
104
116
 
105
117
 
118
+ /*--------------
119
+ Alignment
120
+ ---------------*/
121
+
122
+ .ui[class*="top aligned"].dimmer {
123
+ -webkit-box-pack: start;
124
+ -ms-flex-pack: start;
125
+ justify-content: flex-start;
126
+ }
127
+ .ui[class*="bottom aligned"].dimmer {
128
+ -webkit-box-pack: end;
129
+ -ms-flex-pack: end;
130
+ justify-content: flex-end;
131
+ }
132
+
106
133
  /*--------------
107
134
  Page
108
135
  ---------------*/
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Dropdown
2
+ * # Semantic UI 2.3.0 - Dropdown
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Video
2
+ * # Semantic UI 2.3.0 - Video
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * # Semantic UI 2.2.14 - Modal
2
+ * # Semantic UI 2.3.0 - Modal
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
@@ -15,10 +15,7 @@
15
15
 
16
16
  .ui.modal {
17
17
  display: none;
18
- position: fixed;
19
18
  z-index: 1001;
20
- top: 50%;
21
- left: 50%;
22
19
  text-align: left;
23
20
  background: #FFFFFF;
24
21
  border: none;
@@ -26,6 +23,9 @@
26
23
  box-shadow: 1px 3px 3px 0px rgba(0, 0, 0, 0.2), 1px 3px 15px 2px rgba(0, 0, 0, 0.2);
27
24
  -webkit-transform-origin: 50% 25%;
28
25
  transform-origin: 50% 25%;
26
+ -webkit-box-flex: 0;
27
+ -ms-flex: 0 0 auto;
28
+ flex: 0 0 auto;
29
29
  border-radius: 0.28571429rem;
30
30
  -webkit-user-select: text;
31
31
  -moz-user-select: text;
@@ -187,31 +187,31 @@
187
187
  @media only screen and (max-width: 767px) {
188
188
  .ui.modal {
189
189
  width: 95%;
190
- margin: 0em 0em 0em -47.5%;
190
+ margin: 0em 0em 0em 0em;
191
191
  }
192
192
  }
193
193
  @media only screen and (min-width: 768px) {
194
194
  .ui.modal {
195
195
  width: 88%;
196
- margin: 0em 0em 0em -44%;
196
+ margin: 0em 0em 0em 0em;
197
197
  }
198
198
  }
199
199
  @media only screen and (min-width: 992px) {
200
200
  .ui.modal {
201
201
  width: 850px;
202
- margin: 0em 0em 0em -425px;
202
+ margin: 0em 0em 0em 0em;
203
203
  }
204
204
  }
205
205
  @media only screen and (min-width: 1200px) {
206
206
  .ui.modal {
207
207
  width: 900px;
208
- margin: 0em 0em 0em -450px;
208
+ margin: 0em 0em 0em 0em;
209
209
  }
210
210
  }
211
211
  @media only screen and (min-width: 1920px) {
212
212
  .ui.modal {
213
213
  width: 950px;
214
- margin: 0em 0em 0em -475px;
214
+ margin: 0em 0em 0em 0em;
215
215
  }
216
216
  }
217
217
 
@@ -347,15 +347,30 @@
347
347
  *******************************/
348
348
 
349
349
 
350
+ /*--------------
351
+ Top Aligned
352
+ ---------------*/
353
+
354
+
355
+ /* Top Aligned Modal */
356
+ .modals.dimmer[class*="top aligned"] .modal {
357
+ margin: 5vh auto;
358
+ }
359
+
350
360
  /*--------------
351
361
  Scrolling
352
362
  ---------------*/
353
363
 
354
364
 
355
- /* A modal that cannot fit on the page */
365
+ /* Scrolling Dimmer */
356
366
  .scrolling.dimmable.dimmed {
357
367
  overflow: hidden;
358
368
  }
369
+ .scrolling.dimmable > .dimmer {
370
+ -webkit-box-pack: start;
371
+ -ms-flex-pack: start;
372
+ justify-content: flex-start;
373
+ }
359
374
  .scrolling.dimmable.dimmed > .dimmer {
360
375
  overflow: auto;
361
376
  -webkit-overflow-scrolling: touch;
@@ -364,13 +379,10 @@
364
379
  position: fixed;
365
380
  }
366
381
  .modals.dimmer .ui.scrolling.modal {
367
- position: relative !important;
368
- left: auto !important;
369
- top: auto !important;
370
- margin: 3.5rem auto !important;
382
+ margin: 1rem auto !important;
371
383
  }
372
384
 
373
- /* undetached scrolling */
385
+ /* Undetached Scrolling */
374
386
  .scrolling.undetached.dimmable.dimmed {
375
387
  overflow: auto;
376
388
  -webkit-overflow-scrolling: touch;
@@ -381,18 +393,7 @@
381
393
  .scrolling.undetached.dimmable .ui.scrolling.modal {
382
394
  position: absolute;
383
395
  left: 50%;
384
- margin-top: 3.5rem !important;
385
- }
386
-
387
- /* Coupling with Sidebar */
388
- .undetached.dimmable.dimmed > .pusher {
389
- z-index: auto;
390
- }
391
- @media only screen and (max-width: 991px) {
392
- .modals.dimmer .ui.scrolling.modal {
393
- margin-top: 1rem !important;
394
- margin-bottom: 1rem !important;
395
- }
396
+ margin-top: 1rem !important;
396
397
  }
397
398
 
398
399
  /* Scrolling Content */
@@ -407,7 +408,7 @@
407
408
 
408
409
  .ui.fullscreen.modal {
409
410
  width: 95% !important;
410
- left: 2.5% !important;
411
+ left: 0em !important;
411
412
  margin: 1em auto;
412
413
  }
413
414
  .ui.fullscreen.scrolling.modal {
@@ -439,31 +440,31 @@
439
440
  @media only screen and (max-width: 767px) {
440
441
  .ui.mini.modal {
441
442
  width: 95%;
442
- margin: 0em 0em 0em -47.5%;
443
+ margin: 0em 0em 0em 0em;
443
444
  }
444
445
  }
445
446
  @media only screen and (min-width: 768px) {
446
447
  .ui.mini.modal {
447
448
  width: 35.2%;
448
- margin: 0em 0em 0em -17.6%;
449
+ margin: 0em 0em 0em 0em;
449
450
  }
450
451
  }
451
452
  @media only screen and (min-width: 992px) {
452
453
  .ui.mini.modal {
453
454
  width: 340px;
454
- margin: 0em 0em 0em -170px;
455
+ margin: 0em 0em 0em 0em;
455
456
  }
456
457
  }
457
458
  @media only screen and (min-width: 1200px) {
458
459
  .ui.mini.modal {
459
460
  width: 360px;
460
- margin: 0em 0em 0em -180px;
461
+ margin: 0em 0em 0em 0em;
461
462
  }
462
463
  }
463
464
  @media only screen and (min-width: 1920px) {
464
465
  .ui.mini.modal {
465
466
  width: 380px;
466
- margin: 0em 0em 0em -190px;
467
+ margin: 0em 0em 0em 0em;
467
468
  }
468
469
  }
469
470
 
@@ -476,31 +477,31 @@
476
477
  @media only screen and (max-width: 767px) {
477
478
  .ui.tiny.modal {
478
479
  width: 95%;
479
- margin: 0em 0em 0em -47.5%;
480
+ margin: 0em 0em 0em 0em;
480
481
  }
481
482
  }
482
483
  @media only screen and (min-width: 768px) {
483
484
  .ui.tiny.modal {
484
485
  width: 52.8%;
485
- margin: 0em 0em 0em -26.4%;
486
+ margin: 0em 0em 0em 0em;
486
487
  }
487
488
  }
488
489
  @media only screen and (min-width: 992px) {
489
490
  .ui.tiny.modal {
490
491
  width: 510px;
491
- margin: 0em 0em 0em -255px;
492
+ margin: 0em 0em 0em 0em;
492
493
  }
493
494
  }
494
495
  @media only screen and (min-width: 1200px) {
495
496
  .ui.tiny.modal {
496
497
  width: 540px;
497
- margin: 0em 0em 0em -270px;
498
+ margin: 0em 0em 0em 0em;
498
499
  }
499
500
  }
500
501
  @media only screen and (min-width: 1920px) {
501
502
  .ui.tiny.modal {
502
503
  width: 570px;
503
- margin: 0em 0em 0em -285px;
504
+ margin: 0em 0em 0em 0em;
504
505
  }
505
506
  }
506
507
 
@@ -513,31 +514,31 @@
513
514
  @media only screen and (max-width: 767px) {
514
515
  .ui.small.modal {
515
516
  width: 95%;
516
- margin: 0em 0em 0em -47.5%;
517
+ margin: 0em 0em 0em 0em;
517
518
  }
518
519
  }
519
520
  @media only screen and (min-width: 768px) {
520
521
  .ui.small.modal {
521
522
  width: 70.4%;
522
- margin: 0em 0em 0em -35.2%;
523
+ margin: 0em 0em 0em 0em;
523
524
  }
524
525
  }
525
526
  @media only screen and (min-width: 992px) {
526
527
  .ui.small.modal {
527
528
  width: 680px;
528
- margin: 0em 0em 0em -340px;
529
+ margin: 0em 0em 0em 0em;
529
530
  }
530
531
  }
531
532
  @media only screen and (min-width: 1200px) {
532
533
  .ui.small.modal {
533
534
  width: 720px;
534
- margin: 0em 0em 0em -360px;
535
+ margin: 0em 0em 0em 0em;
535
536
  }
536
537
  }
537
538
  @media only screen and (min-width: 1920px) {
538
539
  .ui.small.modal {
539
540
  width: 760px;
540
- margin: 0em 0em 0em -380px;
541
+ margin: 0em 0em 0em 0em;
541
542
  }
542
543
  }
543
544
 
@@ -548,31 +549,31 @@
548
549
  @media only screen and (max-width: 767px) {
549
550
  .ui.large.modal {
550
551
  width: 95%;
551
- margin: 0em 0em 0em -47.5%;
552
+ margin: 0em 0em 0em 0em;
552
553
  }
553
554
  }
554
555
  @media only screen and (min-width: 768px) {
555
556
  .ui.large.modal {
556
557
  width: 88%;
557
- margin: 0em 0em 0em -44%;
558
+ margin: 0em 0em 0em 0em;
558
559
  }
559
560
  }
560
561
  @media only screen and (min-width: 992px) {
561
562
  .ui.large.modal {
562
563
  width: 1020px;
563
- margin: 0em 0em 0em -510px;
564
+ margin: 0em 0em 0em 0em;
564
565
  }
565
566
  }
566
567
  @media only screen and (min-width: 1200px) {
567
568
  .ui.large.modal {
568
569
  width: 1080px;
569
- margin: 0em 0em 0em -540px;
570
+ margin: 0em 0em 0em 0em;
570
571
  }
571
572
  }
572
573
  @media only screen and (min-width: 1920px) {
573
574
  .ui.large.modal {
574
575
  width: 1140px;
575
- margin: 0em 0em 0em -570px;
576
+ margin: 0em 0em 0em 0em;
576
577
  }
577
578
  }
578
579