fomantic-ui 2.9.0-beta.28 → 2.9.0-beta.280

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 (312) hide show
  1. package/.all-contributorsrc +224 -3
  2. package/.github/workflows/ci.yml +7 -6
  3. package/.github/workflows/nightly.yml +13 -8
  4. package/.github/workflows/release.yml +31 -0
  5. package/CONTRIBUTORS.md +77 -37
  6. package/README.md +8 -8
  7. package/dist/components/accordion.css +175 -35
  8. package/dist/components/accordion.js +6 -3
  9. package/dist/components/accordion.min.css +2 -2
  10. package/dist/components/accordion.min.js +3 -3
  11. package/dist/components/ad.css +4 -4
  12. package/dist/components/ad.min.css +2 -2
  13. package/dist/components/api.js +88 -29
  14. package/dist/components/api.min.js +3 -3
  15. package/dist/components/breadcrumb.css +1 -1
  16. package/dist/components/breadcrumb.min.css +1 -1
  17. package/dist/components/button.css +195 -148
  18. package/dist/components/button.min.css +2 -2
  19. package/dist/components/calendar.css +18 -1
  20. package/dist/components/calendar.js +84 -67
  21. package/dist/components/calendar.min.css +2 -2
  22. package/dist/components/calendar.min.js +3 -3
  23. package/dist/components/card.css +753 -116
  24. package/dist/components/card.min.css +2 -2
  25. package/dist/components/checkbox.css +92 -91
  26. package/dist/components/checkbox.js +17 -11
  27. package/dist/components/checkbox.min.css +2 -2
  28. package/dist/components/checkbox.min.js +3 -3
  29. package/dist/components/comment.css +12 -12
  30. package/dist/components/comment.min.css +2 -2
  31. package/dist/components/container.css +97 -3
  32. package/dist/components/container.min.css +2 -2
  33. package/dist/components/dimmer.css +29 -14
  34. package/dist/components/dimmer.js +11 -5
  35. package/dist/components/dimmer.min.css +2 -2
  36. package/dist/components/dimmer.min.js +3 -3
  37. package/dist/components/divider.css +31 -31
  38. package/dist/components/divider.min.css +2 -2
  39. package/dist/components/dropdown.css +89 -49
  40. package/dist/components/dropdown.js +95 -49
  41. package/dist/components/dropdown.min.css +2 -2
  42. package/dist/components/dropdown.min.js +3 -3
  43. package/dist/components/embed.css +5 -5
  44. package/dist/components/embed.js +1 -1
  45. package/dist/components/embed.min.css +2 -2
  46. package/dist/components/embed.min.js +3 -3
  47. package/dist/components/emoji.css +10839 -8831
  48. package/dist/components/emoji.min.css +1 -1
  49. package/dist/components/feed.css +29 -29
  50. package/dist/components/feed.min.css +2 -2
  51. package/dist/components/flag.css +1001 -892
  52. package/dist/components/flag.min.css +2 -2
  53. package/dist/components/form.css +158 -81
  54. package/dist/components/form.js +38 -29
  55. package/dist/components/form.min.css +2 -2
  56. package/dist/components/form.min.js +3 -3
  57. package/dist/components/grid.css +25 -21
  58. package/dist/components/grid.min.css +2 -2
  59. package/dist/components/header.css +5 -3
  60. package/dist/components/header.min.css +2 -2
  61. package/dist/components/icon.css +2063 -1984
  62. package/dist/components/icon.min.css +2 -2
  63. package/dist/components/image.css +1 -1
  64. package/dist/components/image.min.css +1 -1
  65. package/dist/components/input.css +758 -21
  66. package/dist/components/input.min.css +2 -2
  67. package/dist/components/item.css +16 -16
  68. package/dist/components/item.min.css +2 -2
  69. package/dist/components/label.css +64 -64
  70. package/dist/components/label.min.css +2 -2
  71. package/dist/components/list.css +30 -30
  72. package/dist/components/list.min.css +2 -2
  73. package/dist/components/loader.css +352 -352
  74. package/dist/components/loader.min.css +2 -2
  75. package/dist/components/menu.css +107 -75
  76. package/dist/components/menu.min.css +1 -1
  77. package/dist/components/message.css +42 -42
  78. package/dist/components/message.min.css +2 -2
  79. package/dist/components/modal.css +13 -1
  80. package/dist/components/modal.js +127 -49
  81. package/dist/components/modal.min.css +2 -2
  82. package/dist/components/modal.min.js +3 -3
  83. package/dist/components/nag.css +1 -1
  84. package/dist/components/nag.js +1 -1
  85. package/dist/components/nag.min.css +1 -1
  86. package/dist/components/nag.min.js +3 -3
  87. package/dist/components/placeholder.css +33 -33
  88. package/dist/components/placeholder.min.css +2 -2
  89. package/dist/components/popup.css +99 -103
  90. package/dist/components/popup.js +2 -2
  91. package/dist/components/popup.min.css +2 -2
  92. package/dist/components/popup.min.js +3 -3
  93. package/dist/components/progress.css +1 -1
  94. package/dist/components/progress.js +4 -1
  95. package/dist/components/progress.min.css +1 -1
  96. package/dist/components/progress.min.js +3 -3
  97. package/dist/components/rail.css +1 -1
  98. package/dist/components/rail.min.css +1 -1
  99. package/dist/components/rating.css +1 -1
  100. package/dist/components/rating.js +1 -1
  101. package/dist/components/rating.min.css +1 -1
  102. package/dist/components/rating.min.js +3 -3
  103. package/dist/components/reset.css +5 -4
  104. package/dist/components/reset.min.css +2 -2
  105. package/dist/components/reveal.css +1 -1
  106. package/dist/components/reveal.min.css +1 -1
  107. package/dist/components/search.css +3 -3
  108. package/dist/components/search.js +2 -2
  109. package/dist/components/search.min.css +2 -2
  110. package/dist/components/search.min.js +3 -3
  111. package/dist/components/segment.css +118 -34
  112. package/dist/components/segment.min.css +2 -2
  113. package/dist/components/shape.css +1 -1
  114. package/dist/components/shape.js +3 -3
  115. package/dist/components/shape.min.css +1 -1
  116. package/dist/components/shape.min.js +3 -3
  117. package/dist/components/sidebar.css +7 -5
  118. package/dist/components/sidebar.js +12 -10
  119. package/dist/components/sidebar.min.css +2 -2
  120. package/dist/components/sidebar.min.js +3 -3
  121. package/dist/components/site.css +65 -39
  122. package/dist/components/site.js +1 -1
  123. package/dist/components/site.min.css +2 -2
  124. package/dist/components/site.min.js +3 -3
  125. package/dist/components/slider.css +17 -17
  126. package/dist/components/slider.js +68 -51
  127. package/dist/components/slider.min.css +1 -1
  128. package/dist/components/slider.min.js +3 -3
  129. package/dist/components/state.js +1 -1
  130. package/dist/components/state.min.js +3 -3
  131. package/dist/components/statistic.css +2 -2
  132. package/dist/components/statistic.min.css +2 -2
  133. package/dist/components/step.css +30 -30
  134. package/dist/components/step.min.css +2 -2
  135. package/dist/components/sticky.css +1 -1
  136. package/dist/components/sticky.js +1 -1
  137. package/dist/components/sticky.min.css +1 -1
  138. package/dist/components/sticky.min.js +3 -3
  139. package/dist/components/tab.css +5 -5
  140. package/dist/components/tab.js +23 -5
  141. package/dist/components/tab.min.css +2 -2
  142. package/dist/components/tab.min.js +3 -3
  143. package/dist/components/table.css +1174 -32
  144. package/dist/components/table.min.css +2 -2
  145. package/dist/components/text.css +1 -1
  146. package/dist/components/text.min.css +1 -1
  147. package/dist/components/toast.css +39 -1
  148. package/dist/components/toast.js +56 -28
  149. package/dist/components/toast.min.css +2 -2
  150. package/dist/components/toast.min.js +3 -3
  151. package/dist/components/transition.css +1 -1
  152. package/dist/components/transition.js +21 -16
  153. package/dist/components/transition.min.css +1 -1
  154. package/dist/components/transition.min.js +3 -3
  155. package/dist/components/visibility.js +1 -1
  156. package/dist/components/visibility.min.js +3 -3
  157. package/dist/semantic.css +19522 -13088
  158. package/dist/semantic.js +666 -369
  159. package/dist/semantic.min.css +3 -3
  160. package/dist/semantic.min.js +3 -3
  161. package/dist/themes/default/assets/fonts/brand-icons.eot +0 -0
  162. package/dist/themes/default/assets/fonts/brand-icons.svg +801 -654
  163. package/dist/themes/default/assets/fonts/brand-icons.ttf +0 -0
  164. package/dist/themes/default/assets/fonts/brand-icons.woff +0 -0
  165. package/dist/themes/default/assets/fonts/brand-icons.woff2 +0 -0
  166. package/dist/themes/default/assets/fonts/icons.eot +0 -0
  167. package/dist/themes/default/assets/fonts/icons.svg +1175 -1079
  168. package/dist/themes/default/assets/fonts/icons.ttf +0 -0
  169. package/dist/themes/default/assets/fonts/icons.woff +0 -0
  170. package/dist/themes/default/assets/fonts/icons.woff2 +0 -0
  171. package/dist/themes/default/assets/fonts/outline-icons.eot +0 -0
  172. package/dist/themes/default/assets/fonts/outline-icons.svg +93 -95
  173. package/dist/themes/default/assets/fonts/outline-icons.ttf +0 -0
  174. package/dist/themes/default/assets/fonts/outline-icons.woff +0 -0
  175. package/dist/themes/default/assets/fonts/outline-icons.woff2 +0 -0
  176. package/examples/assets/library/iframe-content.js +8 -8
  177. package/examples/assets/library/iframe.js +3 -3
  178. package/package.json +16 -14
  179. package/scripts/nightly-version.js +47 -38
  180. package/src/definitions/behaviors/api.js +87 -28
  181. package/src/definitions/behaviors/form.js +37 -28
  182. package/src/definitions/collections/form.less +225 -161
  183. package/src/definitions/collections/grid.less +723 -687
  184. package/src/definitions/collections/menu.less +224 -166
  185. package/src/definitions/collections/message.less +49 -47
  186. package/src/definitions/collections/table.less +855 -268
  187. package/src/definitions/elements/button.less +611 -469
  188. package/src/definitions/elements/container.less +145 -8
  189. package/src/definitions/elements/divider.less +24 -24
  190. package/src/definitions/elements/emoji.less +16 -10
  191. package/src/definitions/elements/flag.less +8 -18
  192. package/src/definitions/elements/header.less +46 -37
  193. package/src/definitions/elements/icon.less +39 -32
  194. package/src/definitions/elements/input.less +268 -26
  195. package/src/definitions/elements/label.less +125 -124
  196. package/src/definitions/elements/list.less +84 -75
  197. package/src/definitions/elements/loader.less +99 -98
  198. package/src/definitions/elements/placeholder.less +32 -32
  199. package/src/definitions/elements/segment.less +174 -55
  200. package/src/definitions/elements/step.less +76 -72
  201. package/src/definitions/elements/text.less +17 -15
  202. package/src/definitions/globals/reset.less +2 -2
  203. package/src/definitions/globals/site.less +23 -2
  204. package/src/definitions/modules/accordion.js +5 -2
  205. package/src/definitions/modules/accordion.less +181 -29
  206. package/src/definitions/modules/calendar.js +83 -66
  207. package/src/definitions/modules/calendar.less +20 -0
  208. package/src/definitions/modules/checkbox.js +16 -10
  209. package/src/definitions/modules/checkbox.less +83 -227
  210. package/src/definitions/modules/dimmer.js +10 -4
  211. package/src/definitions/modules/dimmer.less +21 -8
  212. package/src/definitions/modules/dropdown.js +94 -48
  213. package/src/definitions/modules/dropdown.less +178 -127
  214. package/src/definitions/modules/embed.less +4 -4
  215. package/src/definitions/modules/modal.js +126 -48
  216. package/src/definitions/modules/modal.less +12 -0
  217. package/src/definitions/modules/nag.less +20 -19
  218. package/src/definitions/modules/popup.js +1 -1
  219. package/src/definitions/modules/popup.less +86 -90
  220. package/src/definitions/modules/progress.js +3 -0
  221. package/src/definitions/modules/progress.less +19 -18
  222. package/src/definitions/modules/rating.less +35 -34
  223. package/src/definitions/modules/search.js +1 -1
  224. package/src/definitions/modules/search.less +35 -19
  225. package/src/definitions/modules/shape.js +2 -2
  226. package/src/definitions/modules/sidebar.js +11 -9
  227. package/src/definitions/modules/sidebar.less +36 -22
  228. package/src/definitions/modules/slider.js +67 -50
  229. package/src/definitions/modules/slider.less +48 -47
  230. package/src/definitions/modules/tab.js +22 -4
  231. package/src/definitions/modules/tab.less +4 -4
  232. package/src/definitions/modules/toast.js +55 -27
  233. package/src/definitions/modules/toast.less +48 -16
  234. package/src/definitions/modules/transition.js +20 -15
  235. package/src/definitions/views/ad.less +3 -3
  236. package/src/definitions/views/card.less +519 -374
  237. package/src/definitions/views/comment.less +93 -82
  238. package/src/definitions/views/feed.less +164 -144
  239. package/src/definitions/views/item.less +251 -198
  240. package/src/definitions/views/statistic.less +91 -89
  241. package/src/themes/basic/elements/icon.overrides +149 -149
  242. package/src/themes/basic/elements/step.overrides +2 -2
  243. package/src/themes/bookish/elements/header.overrides +1 -1
  244. package/src/themes/chubby/elements/button.overrides +1 -1
  245. package/src/themes/chubby/elements/header.overrides +1 -1
  246. package/src/themes/default/assets/fonts/brand-icons.eot +0 -0
  247. package/src/themes/default/assets/fonts/brand-icons.svg +801 -654
  248. package/src/themes/default/assets/fonts/brand-icons.ttf +0 -0
  249. package/src/themes/default/assets/fonts/brand-icons.woff +0 -0
  250. package/src/themes/default/assets/fonts/brand-icons.woff2 +0 -0
  251. package/src/themes/default/assets/fonts/icons.eot +0 -0
  252. package/src/themes/default/assets/fonts/icons.svg +1175 -1079
  253. package/src/themes/default/assets/fonts/icons.ttf +0 -0
  254. package/src/themes/default/assets/fonts/icons.woff +0 -0
  255. package/src/themes/default/assets/fonts/icons.woff2 +0 -0
  256. package/src/themes/default/assets/fonts/outline-icons.eot +0 -0
  257. package/src/themes/default/assets/fonts/outline-icons.svg +93 -95
  258. package/src/themes/default/assets/fonts/outline-icons.ttf +0 -0
  259. package/src/themes/default/assets/fonts/outline-icons.woff +0 -0
  260. package/src/themes/default/assets/fonts/outline-icons.woff2 +0 -0
  261. package/src/themes/default/collections/form.variables +4 -0
  262. package/src/themes/default/collections/menu.variables +6 -0
  263. package/src/themes/default/collections/table.variables +52 -0
  264. package/src/themes/default/elements/button.variables +7 -1
  265. package/src/themes/default/elements/container.variables +12 -0
  266. package/src/themes/default/elements/divider.overrides +7 -7
  267. package/src/themes/default/elements/emoji.overrides +1737 -1235
  268. package/src/themes/default/elements/flag.overrides +1641 -986
  269. package/src/themes/default/elements/flag.variables +7 -5
  270. package/src/themes/default/elements/icon.overrides +1975 -1949
  271. package/src/themes/default/elements/icon.variables +1 -0
  272. package/src/themes/default/elements/input.variables +15 -0
  273. package/src/themes/default/elements/segment.variables +8 -0
  274. package/src/themes/default/elements/step.overrides +3 -3
  275. package/src/themes/default/globals/site.variables +6 -0
  276. package/src/themes/default/globals/variation.variables +140 -6
  277. package/src/themes/default/modules/accordion.overrides +6 -5
  278. package/src/themes/default/modules/accordion.variables +49 -2
  279. package/src/themes/default/modules/calendar.variables +3 -0
  280. package/src/themes/default/modules/checkbox.overrides +9 -9
  281. package/src/themes/default/modules/checkbox.variables +5 -5
  282. package/src/themes/default/modules/dimmer.variables +1 -1
  283. package/src/themes/default/modules/dropdown.overrides +5 -5
  284. package/src/themes/default/modules/dropdown.variables +4 -10
  285. package/src/themes/default/modules/modal.variables +13 -0
  286. package/src/themes/default/modules/popup.variables +0 -2
  287. package/src/themes/default/modules/toast.variables +3 -0
  288. package/src/themes/default/views/card.variables +8 -0
  289. package/src/themes/famfamfam/elements/flag.overrides +1026 -0
  290. package/src/themes/famfamfam/elements/flag.variables +13 -0
  291. package/src/themes/github/elements/icon.overrides +206 -206
  292. package/src/themes/github/elements/step.overrides +5 -5
  293. package/src/themes/github/modules/dropdown.overrides +6 -6
  294. package/src/themes/instagram/views/card.overrides +1 -1
  295. package/src/themes/joypixels/elements/emoji.overrides +1762 -1260
  296. package/src/themes/joypixels/elements/emoji.variables +1 -1
  297. package/src/themes/material/collections/menu.overrides +1 -1
  298. package/src/themes/material/elements/button.overrides +1 -1
  299. package/src/themes/material/elements/header.overrides +1 -1
  300. package/src/themes/material/elements/icon.overrides +932 -932
  301. package/src/themes/material/globals/site.variables +0 -1
  302. package/src/themes/material/modules/dropdown.overrides +1 -1
  303. package/src/themes/material/modules/modal.overrides +1 -1
  304. package/src/themes/pulsar/elements/loader.overrides +2 -2
  305. package/src/themes/resetcss/globals/reset.overrides +3 -3
  306. package/src/themes/rtl/globals/site.overrides +1 -1
  307. package/src/themes/striped/modules/progress.overrides +1 -1
  308. package/src/themes/twitter/elements/emoji.overrides +1737 -1235
  309. package/tasks/build/css.js +6 -1
  310. package/tasks/config/project/install.js +15 -13
  311. package/tasks/install.js +1 -0
  312. package/test/helpers/sinon.js +2 -2
package/src/definitions/elements/loader.less CHANGED
@@ -34,7 +34,7 @@
34
34
  }
35
35
 
36
36
  /* Static Shape */
37
- .ui.loader:before {
37
+ .ui.loader::before {
38
38
  position: absolute;
39
39
  content: '';
40
40
  top: 0;
@@ -47,7 +47,7 @@
47
47
  }
48
48
 
49
49
  /* Active Shape */
50
- .ui.loader:after {
50
+ .ui.loader::after {
51
51
  position: absolute;
52
52
  content: '';
53
53
  top: 0;
@@ -65,17 +65,17 @@
65
65
  & when (@variationLoaderSpeeds) {
66
66
  /* Speeds */
67
67
 
68
- .ui.fast.loading.loading:after,
69
- .ui.fast.loading.loading .input > i.icon:after,
70
- .ui.fast.loading.loading > i.icon:after,
71
- .ui.fast.loader:after {
68
+ .ui.fast.loading.loading::after,
69
+ .ui.fast.loading.loading .input > i.icon::after,
70
+ .ui.fast.loading.loading > i.icon::after,
71
+ .ui.fast.loader::after {
72
72
  animation-duration: @loaderSpeedFast;
73
73
  }
74
74
 
75
- .ui.slow.loading.loading:after,
76
- .ui.slow.loading.loading .input > i.icon:after,
77
- .ui.slow.loading.loading > i.icon:after,
78
- .ui.slow.loader:after {
75
+ .ui.slow.loading.loading::after,
76
+ .ui.slow.loading.loading .input > i.icon::after,
77
+ .ui.slow.loading.loading > i.icon::after,
78
+ .ui.slow.loader::after {
79
79
  animation-duration: @loaderSpeedSlow;
80
80
  }
81
81
  }
@@ -100,7 +100,7 @@
100
100
  .ui.dimmer > .ui.loader {
101
101
  color: @invertedLoaderTextColor;
102
102
  }
103
- .ui.dimmer > .ui.loader:not(.elastic):before {
103
+ .ui.dimmer > .ui.loader:not(.elastic)::before {
104
104
  border-color: @invertedLoaderFillColor;
105
105
  }
106
106
 
@@ -108,7 +108,7 @@
108
108
  .ui.inverted.dimmer > .ui.loader {
109
109
  color: @loaderTextColor;
110
110
  }
111
- .ui.inverted.dimmer > .ui.loader:not(.elastic):before {
111
+ .ui.inverted.dimmer > .ui.loader:not(.elastic)::before {
112
112
  border-color: @loaderFillColor;
113
113
  }
114
114
 
@@ -134,7 +134,7 @@
134
134
  States
135
135
  *******************************/
136
136
  & when (@variationLoaderIndeterminate) {
137
- .ui.indeterminate.loader:after {
137
+ .ui.indeterminate.loader::after {
138
138
  animation-direction: @indeterminateDirection;
139
139
  animation-duration: @indeterminateSpeed;
140
140
  }
@@ -163,8 +163,8 @@
163
163
  height: @medium;
164
164
  font-size: @mediumFontSize;
165
165
  }
166
- .ui.loader:before,
167
- .ui.loader:after {
166
+ .ui.loader::before,
167
+ .ui.loader::after {
168
168
  width: @medium;
169
169
  height: @medium;
170
170
  margin: @mediumOffset;
@@ -185,8 +185,8 @@
185
185
  height: @s;
186
186
  font-size: @@f;
187
187
  }
188
- .ui.@{value}.loader:before,
189
- .ui.@{value}.loader:after {
188
+ .ui.@{value}.loader::before,
189
+ .ui.@{value}.loader::after {
190
190
  width: @s;
191
191
  height: @s;
192
192
  margin: @@o;
@@ -203,54 +203,55 @@
203
203
  /*-------------------
204
204
  Colors
205
205
  --------------------*/
206
+ & when not (@variationLoaderColors = false) {
207
+ each(@variationLoaderColors, {
208
+ @color: @value;
209
+ @c: @colors[@@color][color];
210
+ @l: @colors[@@color][light];
211
+
212
+ .ui.@{color}.elastic.loader.loader::before,
213
+ .ui.@{color}.basic.elastic.loading.button::before,
214
+ .ui.@{color}.basic.elastic.loading.button::after,
215
+ .ui.@{color}.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card)::before,
216
+ .ui.@{color}.elastic.loading.loading.loading .input > i.icon::before,
217
+ .ui.@{color}.elastic.loading.loading.loading.loading > i.icon::before,
218
+ .ui.@{color}.loading.loading.loading.loading:not(.usual):not(.button)::after,
219
+ .ui.@{color}.loading.loading.loading.loading .input > i.icon::after,
220
+ .ui.@{color}.loading.loading.loading.loading > i.icon::after,
221
+ .ui.@{color}.loader.loader.loader::after {
222
+ color: @c;
223
+ }
224
+ .ui.inverted.@{color}.elastic.loader::before,
225
+ .ui.inverted.@{color}.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card)::before,
226
+ .ui.inverted.@{color}.elastic.loading.loading.loading .input > i.icon::before,
227
+ .ui.inverted.@{color}.elastic.loading.loading.loading > i.icon::before,
228
+ .ui.inverted.@{color}.loading.loading.loading.loading:not(.usual)::after,
229
+ .ui.inverted.@{color}.loading.loading.loading.loading .input > i.icon::after,
230
+ .ui.inverted.@{color}.loading.loading.loading.loading > i.icon::after,
231
+ .ui.inverted.@{color}.loader.loader.loader::after {
232
+ color: @l;
233
+ }
234
+ })
235
+ }
206
236
 
207
- each(@colors, {
208
- @color: replace(@key, '@', '');
209
- @c: @colors[@@color][color];
210
- @l: @colors[@@color][light];
211
-
212
- .ui.@{color}.elastic.loader.loader:before,
213
- .ui.@{color}.basic.elastic.loading.button:before,
214
- .ui.@{color}.basic.elastic.loading.button:after,
215
- .ui.@{color}.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before,
216
- .ui.@{color}.elastic.loading.loading.loading .input > i.icon:before,
217
- .ui.@{color}.elastic.loading.loading.loading.loading > i.icon:before,
218
- .ui.@{color}.loading.loading.loading.loading:not(.usual):not(.button):after,
219
- .ui.@{color}.loading.loading.loading.loading .input > i.icon:after,
220
- .ui.@{color}.loading.loading.loading.loading > i.icon:after,
221
- .ui.@{color}.loader.loader.loader:after {
222
- color: @c;
223
- }
224
- .ui.inverted.@{color}.elastic.loader:before,
225
- .ui.inverted.@{color}.elastic.loading.loading.loading:not(.segment):not(.segments):not(.card):before,
226
- .ui.inverted.@{color}.elastic.loading.loading.loading .input > i.icon:before,
227
- .ui.inverted.@{color}.elastic.loading.loading.loading > i.icon:before,
228
- .ui.inverted.@{color}.loading.loading.loading.loading:not(.usual):after,
229
- .ui.inverted.@{color}.loading.loading.loading.loading .input > i.icon:after,
230
- .ui.inverted.@{color}.loading.loading.loading.loading > i.icon:after,
231
- .ui.inverted.@{color}.loader.loader.loader:after {
232
- color: @l;
233
- }
234
- })
235
-
236
- .ui.elastic.loader.loader:before,
237
- .ui.elastic.loading.loading.loading:before,
238
- .ui.elastic.loading.loading.loading .input > i.icon:before,
239
- .ui.elastic.loading.loading.loading > i.icon:before,
240
- .ui.loading.loading.loading.loading:not(.usual):after,
241
- .ui.loading.loading.loading.loading .input > i.icon:after,
242
- .ui.loading.loading.loading.loading > i.icon:after,
243
- .ui.loader.loader.loader:after {
237
+ .ui.elastic.loader.loader::before,
238
+ .ui.elastic.loading.loading.loading::before,
239
+ .ui.elastic.loading.loading.loading .input > i.icon::before,
240
+ .ui.elastic.loading.loading.loading > i.icon::before,
241
+ .ui.loading.loading.loading.loading:not(.usual)::after,
242
+ .ui.loading.loading.loading.loading .input > i.icon::after,
243
+ .ui.loading.loading.loading.loading > i.icon::after,
244
+ .ui.loader.loader.loader::after {
244
245
  border-color: currentColor;
245
246
  }
246
- .ui.elastic.loading.loading.loading.loading.button:not(.inverted):not(.basic):before {
247
+ .ui.elastic.loading.loading.loading.loading.button:not(.inverted):not(.basic)::before {
247
248
  color: @invertedLoaderLineColor;
248
249
  }
249
- .ui.elastic.basic.loading.button:before,
250
- .ui.elastic.basic.loading.button:after {
250
+ .ui.elastic.basic.loading.button::before,
251
+ .ui.elastic.basic.loading.button::after {
251
252
  color: @loaderLineColor;
252
253
  }
253
- .ui.double.loading.loading.loading.loading.button:after {
254
+ .ui.double.loading.loading.loading.loading.button::after {
254
255
  border-bottom-color: currentColor;
255
256
  }
256
257
 
@@ -282,30 +283,30 @@ each(@colors, {
282
283
  }
283
284
  }
284
285
 
285
- .ui.loading.loading.loading.loading.loading.loading:after,
286
- .ui.loading.loading.loading.loading.loading.loading .input > i.icon:after,
287
- .ui.loading.loading.loading.loading.loading.loading > i.icon:after,
288
- .ui.loader.loader.loader.loader.loader:after {
286
+ .ui.loading.loading.loading.loading.loading.loading::after,
287
+ .ui.loading.loading.loading.loading.loading.loading .input > i.icon::after,
288
+ .ui.loading.loading.loading.loading.loading.loading > i.icon::after,
289
+ .ui.loader.loader.loader.loader.loader::after {
289
290
  border-left-color:transparent;
290
291
  border-right-color:transparent;
291
292
  }
292
- .ui.loading.loading.loading.loading.loading.loading.loading:not(.double):after,
293
- .ui.loading.loading.loading.loading.loading.loading.loading:not(.double) .input > i.icon:after,
294
- .ui.loading.loading.loading.loading.loading.loading.loading:not(.double) > i.icon:after,
295
- .ui.loader.loader.loader.loader.loader.loader:not(.double):after {
293
+ .ui.loading.loading.loading.loading.loading.loading.loading:not(.double)::after,
294
+ .ui.loading.loading.loading.loading.loading.loading.loading:not(.double) .input > i.icon::after,
295
+ .ui.loading.loading.loading.loading.loading.loading.loading:not(.double) > i.icon::after,
296
+ .ui.loader.loader.loader.loader.loader.loader:not(.double)::after {
296
297
  border-bottom-color: transparent;
297
298
  }
298
- .ui.loading.loading.loading.loading.loading.loading.card:after,
299
- .ui.loading.loading.loading.loading.loading.loading.segments:after,
300
- .ui.loading.loading.loading.loading.loading.loading.segment:after,
301
- .ui.loading.loading.loading.loading.loading.loading.form:after {
299
+ .ui.loading.loading.loading.loading.loading.loading.card::after,
300
+ .ui.loading.loading.loading.loading.loading.loading.segments::after,
301
+ .ui.loading.loading.loading.loading.loading.loading.segment::after,
302
+ .ui.loading.loading.loading.loading.loading.loading.form::after {
302
303
  border-left-color:@loaderFillColor;
303
304
  border-right-color:@loaderFillColor;
304
305
  }
305
- .ui.loading.loading.loading.loading.loading.loading.card:not(.double):after,
306
- .ui.loading.loading.loading.loading.loading.loading.segments:not(.double):after,
307
- .ui.loading.loading.loading.loading.loading.loading.segment:not(.double):after,
308
- .ui.loading.loading.loading.loading.loading.loading.form:not(.double):after {
306
+ .ui.loading.loading.loading.loading.loading.loading.card:not(.double)::after,
307
+ .ui.loading.loading.loading.loading.loading.loading.segments:not(.double)::after,
308
+ .ui.loading.loading.loading.loading.loading.loading.segment:not(.double)::after,
309
+ .ui.loading.loading.loading.loading.loading.loading.form:not(.double)::after {
309
310
  border-bottom-color: @loaderFillColor;
310
311
  }
311
312
 
@@ -320,17 +321,17 @@ each(@colors, {
320
321
  .ui.inverted.dimmer > .ui.elastic.loader {
321
322
  color: @loaderLineColor;
322
323
  }
323
- .ui.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after,
324
- .ui.elastic.loading.loading .input > i.icon:after,
325
- .ui.elastic.loading.loading > i.icon:after,
326
- .ui.elastic.loader.loader:after {
324
+ .ui.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card)::after,
325
+ .ui.elastic.loading.loading .input > i.icon::after,
326
+ .ui.elastic.loading.loading > i.icon::after,
327
+ .ui.elastic.loader.loader::after {
327
328
  animation: loader 1s infinite cubic-bezier(.27, 1.05, .92, .61);
328
329
  animation-delay: 0.3s;
329
330
  }
330
- .ui.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before,
331
- .ui.elastic.loading.loading.loading .input > i.icon:before,
332
- .ui.elastic.loading.loading.loading > i.icon:before,
333
- .ui.elastic.loader.loader:before {
331
+ .ui.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card)::before,
332
+ .ui.elastic.loading.loading.loading .input > i.icon::before,
333
+ .ui.elastic.loading.loading.loading > i.icon::before,
334
+ .ui.elastic.loader.loader::before {
334
335
  animation: elastic-loader 1s infinite cubic-bezier(.27, 1.05, .92, .61);
335
336
  -moz-animation: currentcolor-elastic-loader 1s infinite cubic-bezier(.27, 1.05, .92, .61);
336
337
  border-right-color: transparent;
@@ -341,30 +342,30 @@ each(@colors, {
341
342
  }
342
343
  }
343
344
  & when (@variationLoaderSpeeds) {
344
- .ui.slow.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after,
345
- .ui.slow.elastic.loading.loading .input > i.icon:after,
346
- .ui.slow.elastic.loading.loading > i.icon:after,
347
- .ui.slow.elastic.loader.loader:after {
345
+ .ui.slow.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card)::after,
346
+ .ui.slow.elastic.loading.loading .input > i.icon::after,
347
+ .ui.slow.elastic.loading.loading > i.icon::after,
348
+ .ui.slow.elastic.loader.loader::after {
348
349
  animation-duration: 1.5s;
349
350
  animation-delay: 0.45s;
350
351
  }
351
- .ui.slow.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before,
352
- .ui.slow.elastic.loading.loading.loading .input > i.icon:before,
353
- .ui.slow.elastic.loading.loading.loading > i.icon:before,
354
- .ui.slow.elastic.loader.loader:before {
352
+ .ui.slow.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card)::before,
353
+ .ui.slow.elastic.loading.loading.loading .input > i.icon::before,
354
+ .ui.slow.elastic.loading.loading.loading > i.icon::before,
355
+ .ui.slow.elastic.loader.loader::before {
355
356
  animation-duration: 1.5s;
356
357
  }
357
- .ui.fast.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card):after,
358
- .ui.fast.elastic.loading.loading .input > i.icon:after,
359
- .ui.fast.elastic.loading.loading > i.icon:after,
360
- .ui.fast.elastic.loader.loader:after {
358
+ .ui.fast.elastic.loading.loading:not(.form):not(.segment):not(.segments):not(.card)::after,
359
+ .ui.fast.elastic.loading.loading .input > i.icon::after,
360
+ .ui.fast.elastic.loading.loading > i.icon::after,
361
+ .ui.fast.elastic.loader.loader::after {
361
362
  animation-duration: 0.66s;
362
363
  animation-delay: 0.20s;
363
364
  }
364
- .ui.fast.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card):before,
365
- .ui.fast.elastic.loading.loading.loading .input > i.icon:before,
366
- .ui.fast.elastic.loading.loading.loading > i.icon:before,
367
- .ui.fast.elastic.loader.loader:before {
365
+ .ui.fast.elastic.loading.loading.loading:not(.form):not(.segment):not(.segments):not(.card)::before,
366
+ .ui.fast.elastic.loading.loading.loading .input > i.icon::before,
367
+ .ui.fast.elastic.loading.loading.loading > i.icon::before,
368
+ .ui.fast.elastic.loader.loader::before {
368
369
  animation-duration: 0.66s;
369
370
  }
370
371
  }
package/src/definitions/elements/placeholder.less CHANGED
@@ -57,10 +57,10 @@
57
57
  }
58
58
 
59
59
  .ui.placeholder,
60
- .ui.placeholder > :before,
61
- .ui.placeholder .image.header:after,
60
+ .ui.placeholder > ::before,
61
+ .ui.placeholder .image.header::after,
62
62
  .ui.placeholder .line,
63
- .ui.placeholder .line:after {
63
+ .ui.placeholder .line::after {
64
64
  background-color: @white;
65
65
  }
66
66
 
@@ -93,17 +93,17 @@
93
93
  position: relative;
94
94
  height: @placeholderLineMargin;
95
95
  }
96
- .ui.placeholder .line:before,
97
- .ui.placeholder .line:after {
96
+ .ui.placeholder .line::before,
97
+ .ui.placeholder .line::after {
98
98
  top: 100%;
99
99
  position: absolute;
100
100
  content: '';
101
101
  background-color: inherit;
102
102
  }
103
- .ui.placeholder .line:before {
103
+ .ui.placeholder .line::before {
104
104
  left: 0;
105
105
  }
106
- .ui.placeholder .line:after {
106
+ .ui.placeholder .line::after {
107
107
  right: 0;
108
108
  }
109
109
 
@@ -111,8 +111,8 @@
111
111
  .ui.placeholder .line {
112
112
  margin-bottom: @placeholderLineHeight;
113
113
  }
114
- .ui.placeholder .line:before,
115
- .ui.placeholder .line:after {
114
+ .ui.placeholder .line::before,
115
+ .ui.placeholder .line::after {
116
116
  height: @placeholderLineHeight;
117
117
  }
118
118
  .ui.placeholder .line:not(:first-child) {
@@ -120,19 +120,19 @@
120
120
  }
121
121
 
122
122
  /* Line Outdent */
123
- .ui.placeholder .line:nth-child(1):after {
123
+ .ui.placeholder .line:nth-child(1)::after {
124
124
  width: @placeholderLineOneOutdent;
125
125
  }
126
- .ui.placeholder .line:nth-child(2):after {
126
+ .ui.placeholder .line:nth-child(2)::after {
127
127
  width: @placeholderLineTwoOutdent;
128
128
  }
129
- .ui.placeholder .line:nth-child(3):after {
129
+ .ui.placeholder .line:nth-child(3)::after {
130
130
  width: @placeholderLineThreeOutdent;
131
131
  }
132
- .ui.placeholder .line:nth-child(4):after {
132
+ .ui.placeholder .line:nth-child(4)::after {
133
133
  width: @placeholderLineFourOutdent;
134
134
  }
135
- .ui.placeholder .line:nth-child(5):after {
135
+ .ui.placeholder .line:nth-child(5)::after {
136
136
  width: @placeholderLineFiveOutdent;
137
137
  }
138
138
  }
@@ -147,17 +147,17 @@
147
147
  .ui.placeholder .header .line {
148
148
  margin-bottom: @placeholderHeaderLineHeight;
149
149
  }
150
- .ui.placeholder .header .line:before,
151
- .ui.placeholder .header .line:after {
150
+ .ui.placeholder .header .line::before,
151
+ .ui.placeholder .header .line::after {
152
152
  height: @placeholderHeaderLineHeight;
153
153
  }
154
154
  .ui.placeholder .header .line:not(:first-child) {
155
155
  margin-top: @placeholderHeaderLineHeight;
156
156
  }
157
- .ui.placeholder .header .line:after {
157
+ .ui.placeholder .header .line::after {
158
158
  width: @placeholderHeaderLineOneOutdent;
159
159
  }
160
- .ui.placeholder .header .line:nth-child(2):after {
160
+ .ui.placeholder .header .line:nth-child(2)::after {
161
161
  width: @placeholderHeaderLineTwoOutdent;
162
162
  }
163
163
 
@@ -166,10 +166,10 @@
166
166
  .ui.placeholder .image.header .line {
167
167
  margin-left: @placeholderImageWidth;
168
168
  }
169
- .ui.placeholder .image.header .line:before {
169
+ .ui.placeholder .image.header .line::before {
170
170
  width: @placeholderImageTextIndent;
171
171
  }
172
- .ui.placeholder .image.header:after {
172
+ .ui.placeholder .image.header::after {
173
173
  display: block;
174
174
  height: @placeholderLineMargin;
175
175
  content: '';
@@ -184,9 +184,9 @@
184
184
  .ui.placeholder .header .line:first-child {
185
185
  height: 0.01px;
186
186
  }
187
- .ui.placeholder .image:not(:first-child):before,
188
- .ui.placeholder .paragraph:not(:first-child):before,
189
- .ui.placeholder .header:not(:first-child):before {
187
+ .ui.placeholder .image:not(:first-child)::before,
188
+ .ui.placeholder .paragraph:not(:first-child)::before,
189
+ .ui.placeholder .header:not(:first-child)::before {
190
190
  height: @placeholderSpacing;
191
191
  content: '';
192
192
  display: block;
@@ -198,10 +198,10 @@
198
198
  background-image: @placeholderInvertedLoadingGradient;
199
199
  }
200
200
  .ui.inverted.placeholder,
201
- .ui.inverted.placeholder > :before,
202
- .ui.inverted.placeholder .image.header:after,
201
+ .ui.inverted.placeholder > ::before,
202
+ .ui.inverted.placeholder .image.header::after,
203
203
  .ui.inverted.placeholder .line,
204
- .ui.inverted.placeholder .line:after {
204
+ .ui.inverted.placeholder .line::after {
205
205
  background-color: @black;
206
206
  }
207
207
  }
@@ -215,22 +215,22 @@
215
215
  Sizes
216
216
  --------------------*/
217
217
  & when (@variationPlaceholderLengths) {
218
- .ui.placeholder .full.line.line.line:after {
218
+ .ui.placeholder .full.line.line.line::after {
219
219
  width: @placeholderFullLineOutdent;
220
220
  }
221
- .ui.placeholder .very.long.line.line.line:after {
221
+ .ui.placeholder .very.long.line.line.line::after {
222
222
  width: @placeholderVeryLongLineOutdent;
223
223
  }
224
- .ui.placeholder .long.line.line.line:after {
224
+ .ui.placeholder .long.line.line.line::after {
225
225
  width: @placeholderLongLineOutdent;
226
226
  }
227
- .ui.placeholder .medium.line.line.line:after {
227
+ .ui.placeholder .medium.line.line.line::after {
228
228
  width: @placeholderMediumLineOutdent;
229
229
  }
230
- .ui.placeholder .short.line.line.line:after {
230
+ .ui.placeholder .short.line.line.line::after {
231
231
  width: @placeholderShortLineOutdent;
232
232
  }
233
- .ui.placeholder .very.short.line.line.line:after {
233
+ .ui.placeholder .very.short.line.line.line::after {
234
234
  width: @placeholderVeryShortLineOutdent;
235
235
  }
236
236
  }