rails-active-ui 0.2.2 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (226) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/datatables.css +15 -0
  3. data/app/assets/stylesheets.css +5 -1
  4. data/app/blocks/resource_list_block.rb +153 -0
  5. data/app/components/back_button_component.rb +34 -0
  6. data/app/components/button_component.rb +4 -2
  7. data/app/components/button_to_component.rb +3 -4
  8. data/app/components/column_component.rb +1 -1
  9. data/app/components/container_component.rb +1 -1
  10. data/app/components/dropdown_component.rb +8 -2
  11. data/app/components/grid_component.rb +5 -1
  12. data/app/components/link_to_component.rb +23 -0
  13. data/app/components/menu_item_component.rb +5 -1
  14. data/app/components/message_component.rb +3 -1
  15. data/app/components/modal_component.rb +23 -3
  16. data/app/components/paragraph_component.rb +13 -0
  17. data/app/components/row_component.rb +1 -1
  18. data/app/components/table_row_component.rb +3 -5
  19. data/app/components/template_component.rb +13 -0
  20. data/app/helpers/component_helper.rb +122 -76
  21. data/app/helpers/fui_helper.rb +37 -0
  22. data/app/javascript/datatables.js +10 -0
  23. data/app/javascript/ui/controllers/fui_datatable_controller.js +35 -0
  24. data/app/javascript/ui/controllers/fui_dropdown_controller.js +8 -1
  25. data/app/javascript/ui/controllers/fui_item_list_controller.js +40 -0
  26. data/app/javascript/ui/controllers/navigation_controller.js +23 -0
  27. data/app/javascript/ui/index.js +11 -0
  28. data/app/lib/component.rb +1 -1
  29. data/config/importmap.rb +3 -0
  30. data/config/initializers/ruby_template_handler.rb +4 -1
  31. data/formantic-ui/components/accordion.css +369 -0
  32. data/formantic-ui/components/accordion.js +595 -0
  33. data/formantic-ui/components/accordion.min.css +9 -0
  34. data/formantic-ui/components/accordion.min.js +11 -0
  35. data/formantic-ui/components/ad.css +264 -0
  36. data/formantic-ui/components/ad.min.css +10 -0
  37. data/formantic-ui/components/api.js +1225 -0
  38. data/formantic-ui/components/api.min.js +11 -0
  39. data/formantic-ui/components/breadcrumb.css +135 -0
  40. data/formantic-ui/components/breadcrumb.min.css +9 -0
  41. data/formantic-ui/components/button.css +4058 -0
  42. data/formantic-ui/components/button.min.css +9 -0
  43. data/formantic-ui/components/calendar.css +327 -0
  44. data/formantic-ui/components/calendar.js +2045 -0
  45. data/formantic-ui/components/calendar.min.css +9 -0
  46. data/formantic-ui/components/calendar.min.js +11 -0
  47. data/formantic-ui/components/card.css +1881 -0
  48. data/formantic-ui/components/card.min.css +9 -0
  49. data/formantic-ui/components/checkbox.css +785 -0
  50. data/formantic-ui/components/checkbox.js +888 -0
  51. data/formantic-ui/components/checkbox.min.css +9 -0
  52. data/formantic-ui/components/checkbox.min.js +11 -0
  53. data/formantic-ui/components/comment.css +283 -0
  54. data/formantic-ui/components/comment.min.css +9 -0
  55. data/formantic-ui/components/container.css +300 -0
  56. data/formantic-ui/components/container.min.css +9 -0
  57. data/formantic-ui/components/dimmer.css +367 -0
  58. data/formantic-ui/components/dimmer.js +732 -0
  59. data/formantic-ui/components/dimmer.min.css +9 -0
  60. data/formantic-ui/components/dimmer.min.js +11 -0
  61. data/formantic-ui/components/divider.css +287 -0
  62. data/formantic-ui/components/divider.min.css +9 -0
  63. data/formantic-ui/components/dropdown.css +2087 -0
  64. data/formantic-ui/components/dropdown.js +4432 -0
  65. data/formantic-ui/components/dropdown.min.css +9 -0
  66. data/formantic-ui/components/dropdown.min.js +11 -0
  67. data/formantic-ui/components/embed.css +155 -0
  68. data/formantic-ui/components/embed.js +688 -0
  69. data/formantic-ui/components/embed.min.css +9 -0
  70. data/formantic-ui/components/embed.min.js +11 -0
  71. data/formantic-ui/components/emoji.css +15311 -0
  72. data/formantic-ui/components/emoji.min.css +9 -0
  73. data/formantic-ui/components/feed.css +799 -0
  74. data/formantic-ui/components/feed.min.css +9 -0
  75. data/formantic-ui/components/flag.css +1149 -0
  76. data/formantic-ui/components/flag.min.css +9 -0
  77. data/formantic-ui/components/flyout.css +546 -0
  78. data/formantic-ui/components/flyout.js +1551 -0
  79. data/formantic-ui/components/flyout.min.css +9 -0
  80. data/formantic-ui/components/flyout.min.js +11 -0
  81. data/formantic-ui/components/form.css +1885 -0
  82. data/formantic-ui/components/form.js +2199 -0
  83. data/formantic-ui/components/form.min.css +9 -0
  84. data/formantic-ui/components/form.min.js +11 -0
  85. data/formantic-ui/components/grid.css +1952 -0
  86. data/formantic-ui/components/grid.min.css +9 -0
  87. data/formantic-ui/components/header.css +778 -0
  88. data/formantic-ui/components/header.min.css +9 -0
  89. data/formantic-ui/components/icon.css +7066 -0
  90. data/formantic-ui/components/icon.min.css +9 -0
  91. data/formantic-ui/components/image.css +315 -0
  92. data/formantic-ui/components/image.min.css +9 -0
  93. data/formantic-ui/components/input.css +1566 -0
  94. data/formantic-ui/components/input.min.css +9 -0
  95. data/formantic-ui/components/item.css +534 -0
  96. data/formantic-ui/components/item.min.css +9 -0
  97. data/formantic-ui/components/label.css +2114 -0
  98. data/formantic-ui/components/label.min.css +9 -0
  99. data/formantic-ui/components/list.css +955 -0
  100. data/formantic-ui/components/list.min.css +9 -0
  101. data/formantic-ui/components/loader.css +787 -0
  102. data/formantic-ui/components/loader.min.css +9 -0
  103. data/formantic-ui/components/menu.css +2131 -0
  104. data/formantic-ui/components/menu.min.css +9 -0
  105. data/formantic-ui/components/message.css +619 -0
  106. data/formantic-ui/components/message.min.css +9 -0
  107. data/formantic-ui/components/modal.css +779 -0
  108. data/formantic-ui/components/modal.js +1637 -0
  109. data/formantic-ui/components/modal.min.css +9 -0
  110. data/formantic-ui/components/modal.min.js +11 -0
  111. data/formantic-ui/components/nag.css +290 -0
  112. data/formantic-ui/components/nag.js +566 -0
  113. data/formantic-ui/components/nag.min.css +9 -0
  114. data/formantic-ui/components/nag.min.js +11 -0
  115. data/formantic-ui/components/placeholder.css +228 -0
  116. data/formantic-ui/components/placeholder.min.css +9 -0
  117. data/formantic-ui/components/popup.css +1184 -0
  118. data/formantic-ui/components/popup.js +1561 -0
  119. data/formantic-ui/components/popup.min.css +9 -0
  120. data/formantic-ui/components/popup.min.js +11 -0
  121. data/formantic-ui/components/progress.css +761 -0
  122. data/formantic-ui/components/progress.js +979 -0
  123. data/formantic-ui/components/progress.min.css +9 -0
  124. data/formantic-ui/components/progress.min.js +11 -0
  125. data/formantic-ui/components/rail.css +147 -0
  126. data/formantic-ui/components/rail.min.css +9 -0
  127. data/formantic-ui/components/rating.css +414 -0
  128. data/formantic-ui/components/rating.js +540 -0
  129. data/formantic-ui/components/rating.min.css +9 -0
  130. data/formantic-ui/components/rating.min.js +11 -0
  131. data/formantic-ui/components/reset.css +386 -0
  132. data/formantic-ui/components/reset.min.css +9 -0
  133. data/formantic-ui/components/reveal.css +277 -0
  134. data/formantic-ui/components/reveal.min.css +9 -0
  135. data/formantic-ui/components/search.css +541 -0
  136. data/formantic-ui/components/search.js +1641 -0
  137. data/formantic-ui/components/search.min.css +9 -0
  138. data/formantic-ui/components/search.min.js +11 -0
  139. data/formantic-ui/components/segment.css +1053 -0
  140. data/formantic-ui/components/segment.min.css +9 -0
  141. data/formantic-ui/components/shape.css +144 -0
  142. data/formantic-ui/components/shape.js +797 -0
  143. data/formantic-ui/components/shape.min.css +9 -0
  144. data/formantic-ui/components/shape.min.js +11 -0
  145. data/formantic-ui/components/sidebar.css +539 -0
  146. data/formantic-ui/components/sidebar.js +1054 -0
  147. data/formantic-ui/components/sidebar.min.css +9 -0
  148. data/formantic-ui/components/sidebar.min.js +11 -0
  149. data/formantic-ui/components/site.css +286 -0
  150. data/formantic-ui/components/site.js +455 -0
  151. data/formantic-ui/components/site.min.css +9 -0
  152. data/formantic-ui/components/site.min.js +11 -0
  153. data/formantic-ui/components/slider.css +926 -0
  154. data/formantic-ui/components/slider.js +1546 -0
  155. data/formantic-ui/components/slider.min.css +9 -0
  156. data/formantic-ui/components/slider.min.js +11 -0
  157. data/formantic-ui/components/state.js +697 -0
  158. data/formantic-ui/components/state.min.js +11 -0
  159. data/formantic-ui/components/statistic.css +586 -0
  160. data/formantic-ui/components/statistic.min.css +9 -0
  161. data/formantic-ui/components/step.css +1538 -0
  162. data/formantic-ui/components/step.min.css +9 -0
  163. data/formantic-ui/components/sticky.css +73 -0
  164. data/formantic-ui/components/sticky.js +917 -0
  165. data/formantic-ui/components/sticky.min.css +9 -0
  166. data/formantic-ui/components/sticky.min.js +11 -0
  167. data/formantic-ui/components/tab.css +84 -0
  168. data/formantic-ui/components/tab.js +967 -0
  169. data/formantic-ui/components/tab.min.css +9 -0
  170. data/formantic-ui/components/tab.min.js +11 -0
  171. data/formantic-ui/components/table.css +3473 -0
  172. data/formantic-ui/components/table.min.css +9 -0
  173. data/formantic-ui/components/text.css +155 -0
  174. data/formantic-ui/components/text.min.css +9 -0
  175. data/formantic-ui/components/toast.css +751 -0
  176. data/formantic-ui/components/toast.js +964 -0
  177. data/formantic-ui/components/toast.min.css +9 -0
  178. data/formantic-ui/components/toast.min.js +11 -0
  179. data/formantic-ui/components/transition.css +1148 -0
  180. data/formantic-ui/components/transition.js +1034 -0
  181. data/formantic-ui/components/transition.min.css +9 -0
  182. data/formantic-ui/components/transition.min.js +11 -0
  183. data/formantic-ui/components/visibility.js +1292 -0
  184. data/formantic-ui/components/visibility.min.js +11 -0
  185. data/formantic-ui/semantic.css +78485 -0
  186. data/formantic-ui/semantic.js +31036 -0
  187. data/formantic-ui/semantic.min.css +11 -0
  188. data/formantic-ui/semantic.min.js +11 -0
  189. data/formantic-ui/themes/basic/assets/fonts/LICENSE.txt +91 -0
  190. data/formantic-ui/themes/basic/assets/fonts/icons.woff +0 -0
  191. data/formantic-ui/themes/basic/assets/fonts/icons.woff2 +0 -0
  192. data/formantic-ui/themes/default/assets/fonts/LICENSE_Lato.txt +94 -0
  193. data/formantic-ui/themes/default/assets/fonts/LICENSE_icons.txt +165 -0
  194. data/formantic-ui/themes/default/assets/fonts/Lato-Bold.woff +0 -0
  195. data/formantic-ui/themes/default/assets/fonts/Lato-Bold.woff2 +0 -0
  196. data/formantic-ui/themes/default/assets/fonts/Lato-BoldItalic.woff +0 -0
  197. data/formantic-ui/themes/default/assets/fonts/Lato-BoldItalic.woff2 +0 -0
  198. data/formantic-ui/themes/default/assets/fonts/Lato-Italic.woff +0 -0
  199. data/formantic-ui/themes/default/assets/fonts/Lato-Italic.woff2 +0 -0
  200. data/formantic-ui/themes/default/assets/fonts/Lato-Regular.woff +0 -0
  201. data/formantic-ui/themes/default/assets/fonts/Lato-Regular.woff2 +0 -0
  202. data/formantic-ui/themes/default/assets/fonts/LatoLatin-Bold.woff +0 -0
  203. data/formantic-ui/themes/default/assets/fonts/LatoLatin-Bold.woff2 +0 -0
  204. data/formantic-ui/themes/default/assets/fonts/LatoLatin-BoldItalic.woff +0 -0
  205. data/formantic-ui/themes/default/assets/fonts/LatoLatin-BoldItalic.woff2 +0 -0
  206. data/formantic-ui/themes/default/assets/fonts/LatoLatin-Italic.woff +0 -0
  207. data/formantic-ui/themes/default/assets/fonts/LatoLatin-Italic.woff2 +0 -0
  208. data/formantic-ui/themes/default/assets/fonts/LatoLatin-Regular.woff +0 -0
  209. data/formantic-ui/themes/default/assets/fonts/LatoLatin-Regular.woff2 +0 -0
  210. data/formantic-ui/themes/default/assets/fonts/brand-icons.woff +0 -0
  211. data/formantic-ui/themes/default/assets/fonts/brand-icons.woff2 +0 -0
  212. data/formantic-ui/themes/default/assets/fonts/icons.woff +0 -0
  213. data/formantic-ui/themes/default/assets/fonts/icons.woff2 +0 -0
  214. data/formantic-ui/themes/default/assets/fonts/outline-icons.woff +0 -0
  215. data/formantic-ui/themes/default/assets/fonts/outline-icons.woff2 +0 -0
  216. data/formantic-ui/themes/famfamfam/assets/images/flags.png +0 -0
  217. data/formantic-ui/themes/github/assets/fonts/LICENSE.txt +94 -0
  218. data/formantic-ui/themes/github/assets/fonts/octicons.woff +0 -0
  219. data/formantic-ui/themes/github/assets/fonts/octicons.woff2 +0 -0
  220. data/formantic-ui/themes/material/assets/fonts/LICENSE.txt +202 -0
  221. data/formantic-ui/themes/material/assets/fonts/icons.woff +0 -0
  222. data/formantic-ui/themes/material/assets/fonts/icons.woff2 +0 -0
  223. data/lib/ui/engine.rb +7 -2
  224. data/lib/ui/version.rb +1 -1
  225. metadata +205 -7
  226. data/app/components/link_component.rb +0 -23
@@ -0,0 +1,2114 @@
1
+ /*!
2
+ * # Fomantic-UI 2.9.4 - Label
3
+ * https://github.com/fomantic/Fomantic-UI/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * https://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+
12
+ /*******************************
13
+ Label
14
+ *******************************/
15
+
16
+ .ui.label {
17
+ display: inline-block;
18
+ line-height: 1;
19
+ vertical-align: baseline;
20
+ margin: 0 0.14285714em;
21
+ background-color: #e8e8e8;
22
+ background-image: none;
23
+ padding: 0.5833em 0.833em;
24
+ color: rgba(0, 0, 0, 0.6);
25
+ text-transform: none;
26
+ font-weight: bold;
27
+ border: 0 solid transparent;
28
+ border-radius: 0.28571429rem;
29
+ transition: background 0.1s ease;
30
+ }
31
+ .ui.label:first-child {
32
+ margin-left: 0;
33
+ }
34
+ .ui.label:last-child {
35
+ margin-right: 0;
36
+ }
37
+
38
+ /* Link */
39
+ a.ui.label {
40
+ cursor: pointer;
41
+ }
42
+
43
+ /* Inside Link */
44
+ .ui.label > a {
45
+ cursor: pointer;
46
+ color: inherit;
47
+ opacity: 0.5;
48
+ transition: 0.1s opacity ease;
49
+ }
50
+ .ui.label > a:hover {
51
+ opacity: 1;
52
+ }
53
+
54
+ /* Image */
55
+ .ui.label > img {
56
+ width: auto !important;
57
+ vertical-align: middle;
58
+ height: 2.1666em;
59
+ }
60
+
61
+ /* Icon */
62
+ .ui.ui[class*="left icon"].label > .icon,
63
+ .ui.label > .icon {
64
+ width: auto;
65
+ margin: 0 0.75em 0 0;
66
+ }
67
+
68
+ /* Detail */
69
+ .ui.label > .detail {
70
+ display: inline-block;
71
+ vertical-align: top;
72
+ font-weight: bold;
73
+ margin-left: 1em;
74
+ opacity: 0.8;
75
+ }
76
+ .ui.label > .detail .icon {
77
+ margin: 0 0.25em 0 0;
78
+ }
79
+
80
+ /* Removable label */
81
+ .ui.label > .close.icon,
82
+ .ui.label > .delete.icon {
83
+ cursor: pointer;
84
+ font-size: 0.92857143em;
85
+ opacity: 0.5;
86
+ transition: background 0.1s ease;
87
+ }
88
+ .ui.label > .close.icon:hover,
89
+ .ui.label > .delete.icon:hover {
90
+ opacity: 1;
91
+ }
92
+
93
+ /* Backward compatible positioning */
94
+ .ui.label[class*="left icon"] > .close.icon,
95
+ .ui.label[class*="left icon"] > .delete.icon {
96
+ margin: 0 0.5em 0 0;
97
+ }
98
+ .ui.label[class*="left icon"] > .close.icon.right,
99
+ .ui.label[class*="left icon"] > .delete.icon.right {
100
+ margin: 0 0 0 0.5em;
101
+ }
102
+ .ui.label:not(.icon) > .close.icon,
103
+ .ui.label:not(.icon) > .delete.icon {
104
+ margin: 0 0 0 0.5em;
105
+ }
106
+
107
+ /* Label for only an icon */
108
+ .ui.icon.label > .icon {
109
+ margin: 0 auto;
110
+ }
111
+
112
+ /* Right Side Icon */
113
+ .ui[class*="right icon"].label > .icon {
114
+ margin: 0 0 0 0.75em;
115
+ }
116
+
117
+ /* -------------------
118
+ Group
119
+ -------------------- */
120
+ .ui.labels > .label {
121
+ margin: 0 0.5em 0.5em 0;
122
+ }
123
+
124
+ /* -------------------
125
+ Coupling
126
+ -------------------- */
127
+ .ui.header > .ui.label {
128
+ margin-top: -0.29165em;
129
+ }
130
+
131
+ /* Remove border radius on attached segment */
132
+ .ui.attached.segment > .ui.top.left.attached.label,
133
+ .ui.bottom.attached.segment > .ui.top.left.attached.label {
134
+ border-top-left-radius: 0;
135
+ }
136
+ .ui.attached.segment > .ui.top.right.attached.label,
137
+ .ui.bottom.attached.segment > .ui.top.right.attached.label {
138
+ border-top-right-radius: 0;
139
+ }
140
+ .ui.top.attached.segment > .ui.bottom.left.attached.label {
141
+ border-bottom-left-radius: 0;
142
+ }
143
+ .ui.top.attached.segment > .ui.bottom.right.attached.label {
144
+ border-bottom-right-radius: 0;
145
+ }
146
+
147
+ /* Padding on next content after a label */
148
+ .ui.top.attached.label ~ .ui.bottom.attached.label + :not(.attached),
149
+ .ui.top.attached.label + :not(.attached) {
150
+ margin-top: 2rem !important;
151
+ }
152
+ .ui.bottom.attached.label ~ :last-child:not(.attached) {
153
+ margin-top: 0;
154
+ margin-bottom: 2rem !important;
155
+ }
156
+ .ui.segment:not(.basic) > .ui.top.attached.label {
157
+ margin-top: -1px;
158
+ }
159
+ .ui.segment:not(.basic) > .ui.bottom.attached.label {
160
+ margin-bottom: -1px;
161
+ }
162
+ .ui.segment:not(.basic) > .ui.attached.label:not(.right) {
163
+ margin-left: -1px;
164
+ }
165
+ .ui.segment:not(.basic) > .ui.right.attached.label {
166
+ margin-right: -1px;
167
+ }
168
+ .ui.segment:not(.basic) > .ui.attached.label:not(.left):not(.right) {
169
+ width: calc(100% + 2px);
170
+ }
171
+
172
+
173
+ /*******************************
174
+ Types
175
+ *******************************/
176
+
177
+ .ui.image.labels .label,
178
+ .ui.image.label {
179
+ width: auto;
180
+ margin-top: 0;
181
+ margin-bottom: 0;
182
+ max-width: 9999px;
183
+ vertical-align: baseline;
184
+ text-transform: none;
185
+ background: #e8e8e8;
186
+ padding: 0.5833em 0.833em 0.5833em 0.5em;
187
+ border-radius: 0.28571429rem;
188
+ box-shadow: none;
189
+ }
190
+ .ui.image.labels .label.attached:not(.basic),
191
+ .ui.image.label.attached:not(.basic) {
192
+ padding: 0.5833em 0.833em 0.5833em 0.5em;
193
+ }
194
+ .ui.labels .image.label,
195
+ .ui.image.labels .label {
196
+ margin-bottom: 0.5em;
197
+ }
198
+ .ui.image.label img {
199
+ display: inline-block;
200
+ vertical-align: top;
201
+ height: 2.1666em;
202
+ margin: -0.5833em 0.5em -0.5833em -0.5em;
203
+ border-radius: 0.28571429rem 0 0 0.28571429rem;
204
+ }
205
+ .ui.image.label .detail {
206
+ background: rgba(0, 0, 0, 0.1);
207
+ margin: -0.5833em -0.833em -0.5833em 0.5em;
208
+ padding: 0.5833em 0.833em;
209
+ border-radius: 0 0.28571429rem 0.28571429rem 0;
210
+ }
211
+ .ui.bottom.attached.image.label:not(.right) > img,
212
+ .ui.top.right.attached.image.label > img {
213
+ border-top-left-radius: 0;
214
+ }
215
+ .ui.top.attached.image.label:not(.right) > img,
216
+ .ui.bottom.right.attached.image.label > img {
217
+ border-bottom-left-radius: 0;
218
+ }
219
+
220
+ /* -------------------
221
+ Tag
222
+ -------------------- */
223
+ .ui.tag.labels .label,
224
+ .ui.tag.label {
225
+ margin-left: 1em;
226
+ position: relative;
227
+ padding-left: 1.5em;
228
+ padding-right: 1.5em;
229
+ border-radius: 0 0.28571429rem 0.28571429rem 0;
230
+ transition: none;
231
+ }
232
+ .ui.tag.labels .label::before,
233
+ .ui.tag.label::before {
234
+ position: absolute;
235
+ transform: translateY(-50%) translateX(50%) rotate(-45deg);
236
+ top: 50%;
237
+ right: 100%;
238
+ content: "";
239
+ background-color: inherit;
240
+ background-image: none;
241
+ width: 1.56em;
242
+ height: 1.56em;
243
+ transition: none;
244
+ }
245
+ .ui.tag.labels .label::after,
246
+ .ui.tag.label::after {
247
+ position: absolute;
248
+ content: "";
249
+ top: 50%;
250
+ left: -0.25em;
251
+ margin-top: -0.25em;
252
+ background-color: #fff;
253
+ width: 0.5em;
254
+ height: 0.5em;
255
+ box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3);
256
+ border-radius: 500rem;
257
+ }
258
+ .ui.basic.tag.labels .label::before,
259
+ .ui.basic.tag.label::before {
260
+ border-color: inherit;
261
+ border-width: 1px 0 0 1px;
262
+ border-style: inherit;
263
+ right: calc(100% + 1px);
264
+ }
265
+ .ui.basic.tag.labels .label::after,
266
+ .ui.basic.tag.label::after {
267
+ box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8);
268
+ }
269
+
270
+ /* -------------------
271
+ Corner Label
272
+ -------------------- */
273
+ .ui.corner.label {
274
+ position: absolute;
275
+ top: 0;
276
+ right: 0;
277
+ margin: 0;
278
+ padding: 0;
279
+ text-align: center;
280
+ border-color: #e8e8e8;
281
+ width: 4em;
282
+ height: 4em;
283
+ z-index: 1;
284
+ transition: border-color 0.1s ease;
285
+ }
286
+
287
+ /* Icon Label */
288
+ .ui.corner.label {
289
+ background-color: transparent !important;
290
+ }
291
+ .ui.corner.label::after {
292
+ position: absolute;
293
+ content: "";
294
+ right: 0;
295
+ top: 0;
296
+ z-index: -1;
297
+ width: 0;
298
+ height: 0;
299
+ background-color: transparent;
300
+ border-top: 0 solid transparent;
301
+ border-right: 4em solid transparent;
302
+ border-bottom: 4em solid transparent;
303
+ border-left: 0 solid transparent;
304
+ border-right-color: inherit;
305
+ transition: border-color 0.1s ease;
306
+ }
307
+ .ui.corner.label .icon {
308
+ cursor: inherit;
309
+ position: absolute;
310
+ top: 0.64285714em;
311
+ left: auto;
312
+ right: 0.57142857em;
313
+ font-size: 1.14285714em;
314
+ margin: 0;
315
+ }
316
+
317
+ /* Left Corner */
318
+ .ui.left.corner.label,
319
+ .ui.left.corner.label::after {
320
+ right: auto;
321
+ left: 0;
322
+ }
323
+ .ui.left.corner.label::after {
324
+ border-top: 4em solid transparent;
325
+ border-right: 4em solid transparent;
326
+ border-bottom: 0 solid transparent;
327
+ border-left: 0 solid transparent;
328
+ border-top-color: inherit;
329
+ }
330
+ .ui.left.corner.label .icon {
331
+ left: 0.57142857em;
332
+ right: auto;
333
+ }
334
+
335
+ /* Segment */
336
+ .ui.segment > .ui.corner.label {
337
+ top: -1px;
338
+ right: -1px;
339
+ }
340
+ .ui.segment > .ui.left.corner.label {
341
+ right: auto;
342
+ left: -1px;
343
+ }
344
+
345
+ /* -------------------
346
+ Ribbon
347
+ -------------------- */
348
+ .ui.ribbon.label {
349
+ position: relative;
350
+ margin: 0;
351
+ min-width: max-content;
352
+ border-radius: 0 0.28571429rem 0.28571429rem 0;
353
+ border-color: rgba(0, 0, 0, 0.15);
354
+ }
355
+ .ui.ribbon.label::after {
356
+ position: absolute;
357
+ content: "";
358
+ top: 100%;
359
+ left: 0;
360
+ background-color: transparent;
361
+ border-style: solid;
362
+ border-width: 0 1.2em 1.2em 0;
363
+ border-color: transparent;
364
+ border-right-color: inherit;
365
+ width: 0;
366
+ height: 0;
367
+ }
368
+
369
+ /* Positioning */
370
+ .ui.ribbon.label {
371
+ left: calc(-1rem - 1.2em);
372
+ margin-right: -1.2em;
373
+ padding-left: calc(1rem + 1.2em);
374
+ padding-right: 1.2em;
375
+ }
376
+ .ui[class*="right ribbon"].label {
377
+ left: calc(100% + 1rem + 1.2em);
378
+ padding-left: 1.2em;
379
+ padding-right: calc(1rem + 1.2em);
380
+ }
381
+ .ui.basic.ribbon.label {
382
+ padding-top: calc(0.5833em - 1px);
383
+ padding-bottom: calc(0.5833em - 1px);
384
+ }
385
+ .ui.basic.ribbon.label:not([class*="right ribbon"]) {
386
+ padding-left: calc(1rem + 1.2em - 1px);
387
+ padding-right: calc(1.2em - 1px);
388
+ }
389
+ .ui.basic[class*="right ribbon"].label {
390
+ padding-left: calc(1.2em - 1px);
391
+ padding-right: calc(1rem + 1.2em - 1px);
392
+ }
393
+ .ui.basic.ribbon.label::after {
394
+ top: calc(100% + 1px);
395
+ }
396
+ .ui.basic.ribbon.label:not([class*="right ribbon"])::after {
397
+ left: -1px;
398
+ }
399
+ .ui.basic[class*="right ribbon"].label::after {
400
+ right: -1px;
401
+ }
402
+
403
+ /* Right Ribbon */
404
+ .ui[class*="right ribbon"].label {
405
+ text-align: left;
406
+ transform: translateX(-100%);
407
+ border-radius: 0.28571429rem 0 0 0.28571429rem;
408
+ }
409
+ .ui[class*="right ribbon"].label::after {
410
+ left: auto;
411
+ right: 0;
412
+ border-style: solid;
413
+ border-width: 1.2em 1.2em 0 0;
414
+ border-color: transparent;
415
+ border-top-color: inherit;
416
+ }
417
+ .ui.ui.center.ribbon.label {
418
+ top: calc(50% - 1em);
419
+ z-index: 1;
420
+ }
421
+ .ui.bottom.ribbon.label::after {
422
+ bottom: 100%;
423
+ top: auto;
424
+ border-width: 1.2em 1.2em 0 0;
425
+ }
426
+ .ui.bottom[class*="right ribbon"].label::after {
427
+ border-width: 1.2em 0 0 1.2em;
428
+ border-color: transparent;
429
+ border-left-color: inherit;
430
+ }
431
+
432
+ /* Inside Image */
433
+ .ui.image > .ribbon.label,
434
+ .ui.card .image > .ribbon.label {
435
+ position: absolute;
436
+ top: 1rem;
437
+ }
438
+ .ui.card .image > .ui.ribbon.label,
439
+ .ui.image > .ui.ribbon.label {
440
+ left: calc(0.05rem - 1.2em);
441
+ }
442
+ .ui.card .image > .ui[class*="right ribbon"].label,
443
+ .ui.image > .ui[class*="right ribbon"].label {
444
+ left: calc(100% + -0.05rem + 1.2em);
445
+ padding-left: 0.833em;
446
+ }
447
+ .ui.card .image > .ui.bottom.ribbon.label,
448
+ .ui.image > .ui.bottom.ribbon.label {
449
+ bottom: 1rem;
450
+ top: auto;
451
+ }
452
+
453
+ /* Inside Table */
454
+ .ui.table td > .ui.ribbon.label {
455
+ left: calc(-1em - 1.2em);
456
+ }
457
+ .ui.table td > .ui[class*="right ribbon"].label {
458
+ left: calc(100% + 1em + 1.2em);
459
+ padding-left: 0.833em;
460
+ }
461
+
462
+ /* -------------------
463
+ Attached
464
+ -------------------- */
465
+ .ui[class*="top attached"].label,
466
+ .ui.attached.label {
467
+ width: 100%;
468
+ position: absolute;
469
+ margin: 0;
470
+ top: 0;
471
+ left: 0;
472
+ padding: 0.75em 1em;
473
+ border-radius: 0.21428571rem 0.21428571rem 0 0;
474
+ }
475
+ .ui[class*="bottom attached"].label {
476
+ top: auto;
477
+ bottom: 0;
478
+ border-radius: 0 0 0.21428571rem 0.21428571rem;
479
+ }
480
+ .ui[class*="top left attached"].label {
481
+ width: auto;
482
+ margin-top: 0;
483
+ border-radius: 0.21428571rem 0 0.28571429rem 0;
484
+ }
485
+ .ui[class*="top right attached"].label {
486
+ width: auto;
487
+ left: auto;
488
+ right: 0;
489
+ border-radius: 0 0.21428571rem 0 0.28571429rem;
490
+ }
491
+ .ui[class*="bottom left attached"].label {
492
+ width: auto;
493
+ top: auto;
494
+ bottom: 0;
495
+ border-radius: 0 0.28571429rem 0 0.21428571rem;
496
+ }
497
+ .ui[class*="bottom right attached"].label {
498
+ top: auto;
499
+ bottom: 0;
500
+ left: auto;
501
+ right: 0;
502
+ width: auto;
503
+ border-radius: 0.28571429rem 0 0.21428571rem 0;
504
+ }
505
+
506
+
507
+ /*******************************
508
+ States
509
+ *******************************/
510
+
511
+
512
+ /* -------------------
513
+ Disabled
514
+ -------------------- */
515
+ .ui.disabled.labels .label,
516
+ .ui.label.disabled {
517
+ opacity: 0.45;
518
+ pointer-events: none;
519
+ }
520
+
521
+ /* -------------------
522
+ Hover
523
+ -------------------- */
524
+ .ui.labels a.label:hover,
525
+ a.ui.label:hover {
526
+ background-color: #e0e0e0;
527
+ border-color: #e0e0e0;
528
+ background-image: none;
529
+ color: rgba(0, 0, 0, 0.8);
530
+ }
531
+ .ui.labels a.label:hover::before,
532
+ a.ui.label:hover::before {
533
+ color: rgba(0, 0, 0, 0.8);
534
+ }
535
+
536
+ /* -------------------
537
+ Active
538
+ -------------------- */
539
+ .ui.active.label {
540
+ background-color: #d0d0d0;
541
+ border-color: #d0d0d0;
542
+ background-image: none;
543
+ color: rgba(0, 0, 0, 0.95);
544
+ }
545
+ .ui.active.label::before {
546
+ background-color: #d0d0d0;
547
+ background-image: none;
548
+ color: rgba(0, 0, 0, 0.95);
549
+ }
550
+
551
+ /* -------------------
552
+ Active Hover
553
+ -------------------- */
554
+ .ui.labels a.active.label:hover,
555
+ a.ui.active.label:hover {
556
+ background-color: #c8c8c8;
557
+ border-color: #c8c8c8;
558
+ background-image: none;
559
+ color: rgba(0, 0, 0, 0.95);
560
+ }
561
+ .ui.labels a.active.label:hover::before,
562
+ a.ui.active.label:hover::before {
563
+ background-color: #c8c8c8;
564
+ background-image: none;
565
+ color: rgba(0, 0, 0, 0.95);
566
+ }
567
+
568
+ /* -------------------
569
+ Visible
570
+ -------------------- */
571
+ .ui.labels.visible .label,
572
+ .ui.label.visible:not(.dropdown) {
573
+ display: inline-block !important;
574
+ }
575
+
576
+ /* -------------------
577
+ Hidden
578
+ -------------------- */
579
+ .ui.labels.hidden .label,
580
+ .ui.label.hidden {
581
+ display: none !important;
582
+ }
583
+
584
+
585
+ /*******************************
586
+ Variations
587
+ *******************************/
588
+
589
+
590
+ /* -------------------
591
+ Basic
592
+ -------------------- */
593
+ .ui.basic.labels .label,
594
+ .ui.basic.label {
595
+ background: none #fff;
596
+ border: 1px solid rgba(34, 36, 38, 0.15);
597
+ color: rgba(0, 0, 0, 0.87);
598
+ box-shadow: none;
599
+ padding-top: calc(0.5833em - 1px);
600
+ padding-bottom: calc(0.5833em - 1px);
601
+ padding-right: calc(0.833em - 1px);
602
+ }
603
+ .ui.basic.labels:not(.tag):not(.image):not(.ribbon) .label,
604
+ .ui.basic.label:not(.tag):not(.image):not(.ribbon) {
605
+ padding-left: calc(0.833em - 1px);
606
+ }
607
+ .ui.basic.image.label {
608
+ padding-left: calc(0.5em - 1px);
609
+ }
610
+
611
+ /* Link */
612
+ .ui.basic.labels a.label:hover,
613
+ a.ui.basic.label:hover {
614
+ text-decoration: none;
615
+ background: none #fff;
616
+ color: #1e70bf;
617
+ box-shadow: none;
618
+ }
619
+
620
+ /* Pointing */
621
+ .ui.basic.pointing.label::before {
622
+ border-color: inherit;
623
+ }
624
+
625
+ /* -------------------
626
+ Fluid
627
+ -------------------- */
628
+ .ui.label.fluid,
629
+ .ui.fluid.labels > .label {
630
+ width: 100%;
631
+ box-sizing: border-box;
632
+ }
633
+ .ui.centered.labels .label,
634
+ .ui.centered.label {
635
+ text-align: center;
636
+ }
637
+
638
+ /* -------------------
639
+ Inverted
640
+ -------------------- */
641
+ .ui.inverted.labels .label,
642
+ .ui.inverted.label {
643
+ color: rgba(255, 255, 255, 0.9);
644
+ background-color: #b5b5b5;
645
+ }
646
+ .ui.inverted.corner.label {
647
+ border-color: #b5b5b5;
648
+ }
649
+ .ui.inverted.corner.label:hover {
650
+ border-color: #e8e8e8;
651
+ transition: none;
652
+ }
653
+ .ui.inverted.basic.labels .label,
654
+ .ui.inverted.basic.label,
655
+ .ui.inverted.basic.label:hover {
656
+ border-color: rgba(255, 255, 255, 0.5);
657
+ background: #1b1c1d;
658
+ }
659
+ .ui.inverted.basic.label:hover {
660
+ color: #4183c4;
661
+ }
662
+
663
+ /* -------------------
664
+ Colors
665
+ -------------------- */
666
+ .ui.primary.labels .label,
667
+ .ui.ui.ui.primary.label {
668
+ background-color: #2185d0;
669
+ border-color: #2185d0;
670
+ color: rgba(255, 255, 255, 0.9);
671
+ }
672
+
673
+ /* Link */
674
+ .ui.primary.labels a.label:hover,
675
+ a.ui.ui.ui.primary.label:hover {
676
+ background-color: #1678c2;
677
+ border-color: #1678c2;
678
+ color: #fff;
679
+ }
680
+
681
+ /* Ribbon */
682
+ .ui.ui.ui.primary.ribbon.label {
683
+ border-color: #1a69a4;
684
+ }
685
+
686
+ /* Basic */
687
+ .ui.basic.labels .primary.label,
688
+ .ui.ui.ui.basic.primary.label {
689
+ background: none #fff;
690
+ border-color: #2185d0;
691
+ color: #2185d0;
692
+ }
693
+ .ui.basic.labels a.primary.label:hover,
694
+ a.ui.ui.ui.basic.primary.label:hover {
695
+ background: none #fff;
696
+ border-color: #1678c2;
697
+ color: #1678c2;
698
+ }
699
+
700
+ /* Inverted */
701
+ .ui.inverted.labels .primary.label,
702
+ .ui.ui.ui.inverted.primary.label {
703
+ background-color: #54c8ff;
704
+ border-color: #54c8ff;
705
+ color: #1b1c1d;
706
+ }
707
+
708
+ /* Inverted Link */
709
+ .ui.inverted.labels a.primary.label:hover,
710
+ a.ui.ui.ui.inverted.primary.label:hover {
711
+ background-color: #21b8ff;
712
+ border-color: #21b8ff;
713
+ color: #1b1c1d;
714
+ }
715
+
716
+ /* Inverted Ribbon */
717
+ .ui.ui.ui.inverted.primary.ribbon.label {
718
+ border-color: #21b8ff;
719
+ }
720
+
721
+ /* Inverted Basic */
722
+ .ui.inverted.basic.labels .primary.label,
723
+ .ui.ui.ui.inverted.basic.primary.label {
724
+ background-color: #1b1c1d;
725
+ border-color: #54c8ff;
726
+ color: #54c8ff;
727
+ }
728
+ .ui.inverted.basic.labels a.primary.label:hover,
729
+ a.ui.ui.ui.inverted.basic.primary.label:hover {
730
+ border-color: #21b8ff;
731
+ background-color: #1b1c1d;
732
+ color: #21b8ff;
733
+ }
734
+
735
+ /* Inverted Basic Tags */
736
+ .ui.inverted.basic.tag.labels .primary.label,
737
+ .ui.ui.ui.inverted.primary.basic.tag.label {
738
+ border: 1px solid #54c8ff;
739
+ }
740
+ .ui.inverted.basic.tag.labels .primary.label::before,
741
+ .ui.ui.ui.inverted.primary.basic.tag.label::before {
742
+ border-color: inherit;
743
+ border-width: 1px 0 0 1px;
744
+ border-style: inherit;
745
+ background-color: #1b1c1d;
746
+ right: calc(100% + 1px);
747
+ }
748
+ .ui.secondary.labels .label,
749
+ .ui.ui.ui.secondary.label {
750
+ background-color: #1b1c1d;
751
+ border-color: #1b1c1d;
752
+ color: rgba(255, 255, 255, 0.9);
753
+ }
754
+
755
+ /* Link */
756
+ .ui.secondary.labels a.label:hover,
757
+ a.ui.ui.ui.secondary.label:hover {
758
+ background-color: #27292a;
759
+ border-color: #27292a;
760
+ color: #fff;
761
+ }
762
+
763
+ /* Ribbon */
764
+ .ui.ui.ui.secondary.ribbon.label {
765
+ border-color: #020203;
766
+ }
767
+
768
+ /* Basic */
769
+ .ui.basic.labels .secondary.label,
770
+ .ui.ui.ui.basic.secondary.label {
771
+ background: none #fff;
772
+ border-color: #1b1c1d;
773
+ color: #1b1c1d;
774
+ }
775
+ .ui.basic.labels a.secondary.label:hover,
776
+ a.ui.ui.ui.basic.secondary.label:hover {
777
+ background: none #fff;
778
+ border-color: #27292a;
779
+ color: #27292a;
780
+ }
781
+
782
+ /* Inverted */
783
+ .ui.inverted.labels .secondary.label,
784
+ .ui.ui.ui.inverted.secondary.label {
785
+ background-color: #545454;
786
+ border-color: #545454;
787
+ color: #1b1c1d;
788
+ }
789
+
790
+ /* Inverted Link */
791
+ .ui.inverted.labels a.secondary.label:hover,
792
+ a.ui.ui.ui.inverted.secondary.label:hover {
793
+ background-color: #6e6e6e;
794
+ border-color: #6e6e6e;
795
+ color: #1b1c1d;
796
+ }
797
+
798
+ /* Inverted Ribbon */
799
+ .ui.ui.ui.inverted.secondary.ribbon.label {
800
+ border-color: #3b3b3b;
801
+ }
802
+
803
+ /* Inverted Basic */
804
+ .ui.inverted.basic.labels .secondary.label,
805
+ .ui.ui.ui.inverted.basic.secondary.label {
806
+ background-color: #1b1c1d;
807
+ border-color: #545454;
808
+ color: #545454;
809
+ }
810
+ .ui.inverted.basic.labels a.secondary.label:hover,
811
+ a.ui.ui.ui.inverted.basic.secondary.label:hover {
812
+ border-color: #6e6e6e;
813
+ background-color: #1b1c1d;
814
+ color: #6e6e6e;
815
+ }
816
+
817
+ /* Inverted Basic Tags */
818
+ .ui.inverted.basic.tag.labels .secondary.label,
819
+ .ui.ui.ui.inverted.secondary.basic.tag.label {
820
+ border: 1px solid #545454;
821
+ }
822
+ .ui.inverted.basic.tag.labels .secondary.label::before,
823
+ .ui.ui.ui.inverted.secondary.basic.tag.label::before {
824
+ border-color: inherit;
825
+ border-width: 1px 0 0 1px;
826
+ border-style: inherit;
827
+ background-color: #1b1c1d;
828
+ right: calc(100% + 1px);
829
+ }
830
+ .ui.red.labels .label,
831
+ .ui.ui.ui.red.label {
832
+ background-color: #db2828;
833
+ border-color: #db2828;
834
+ color: #fff;
835
+ }
836
+
837
+ /* Link */
838
+ .ui.red.labels a.label:hover,
839
+ a.ui.ui.ui.red.label:hover {
840
+ background-color: #d01919;
841
+ border-color: #d01919;
842
+ color: #fff;
843
+ }
844
+
845
+ /* Ribbon */
846
+ .ui.ui.ui.red.ribbon.label {
847
+ border-color: #b21e1e;
848
+ }
849
+
850
+ /* Basic */
851
+ .ui.basic.labels .red.label,
852
+ .ui.ui.ui.basic.red.label {
853
+ background: none #fff;
854
+ border-color: #db2828;
855
+ color: #db2828;
856
+ }
857
+ .ui.basic.labels a.red.label:hover,
858
+ a.ui.ui.ui.basic.red.label:hover {
859
+ background: none #fff;
860
+ border-color: #d01919;
861
+ color: #d01919;
862
+ }
863
+
864
+ /* Inverted */
865
+ .ui.inverted.labels .red.label,
866
+ .ui.ui.ui.inverted.red.label {
867
+ background-color: #ff695e;
868
+ border-color: #ff695e;
869
+ color: #1b1c1d;
870
+ }
871
+
872
+ /* Inverted Link */
873
+ .ui.inverted.labels a.red.label:hover,
874
+ a.ui.ui.ui.inverted.red.label:hover {
875
+ background-color: #ff392b;
876
+ border-color: #ff392b;
877
+ color: #1b1c1d;
878
+ }
879
+
880
+ /* Inverted Ribbon */
881
+ .ui.ui.ui.inverted.red.ribbon.label {
882
+ border-color: #ff392b;
883
+ }
884
+
885
+ /* Inverted Basic */
886
+ .ui.inverted.basic.labels .red.label,
887
+ .ui.ui.ui.inverted.basic.red.label {
888
+ background-color: #1b1c1d;
889
+ border-color: #ff695e;
890
+ color: #ff695e;
891
+ }
892
+ .ui.inverted.basic.labels a.red.label:hover,
893
+ a.ui.ui.ui.inverted.basic.red.label:hover {
894
+ border-color: #ff392b;
895
+ background-color: #1b1c1d;
896
+ color: #ff392b;
897
+ }
898
+
899
+ /* Inverted Basic Tags */
900
+ .ui.inverted.basic.tag.labels .red.label,
901
+ .ui.ui.ui.inverted.red.basic.tag.label {
902
+ border: 1px solid #ff695e;
903
+ }
904
+ .ui.inverted.basic.tag.labels .red.label::before,
905
+ .ui.ui.ui.inverted.red.basic.tag.label::before {
906
+ border-color: inherit;
907
+ border-width: 1px 0 0 1px;
908
+ border-style: inherit;
909
+ background-color: #1b1c1d;
910
+ right: calc(100% + 1px);
911
+ }
912
+ .ui.orange.labels .label,
913
+ .ui.ui.ui.orange.label {
914
+ background-color: #f2711c;
915
+ border-color: #f2711c;
916
+ color: #fff;
917
+ }
918
+
919
+ /* Link */
920
+ .ui.orange.labels a.label:hover,
921
+ a.ui.ui.ui.orange.label:hover {
922
+ background-color: #f26202;
923
+ border-color: #f26202;
924
+ color: #fff;
925
+ }
926
+
927
+ /* Ribbon */
928
+ .ui.ui.ui.orange.ribbon.label {
929
+ border-color: #cf590c;
930
+ }
931
+
932
+ /* Basic */
933
+ .ui.basic.labels .orange.label,
934
+ .ui.ui.ui.basic.orange.label {
935
+ background: none #fff;
936
+ border-color: #f2711c;
937
+ color: #f2711c;
938
+ }
939
+ .ui.basic.labels a.orange.label:hover,
940
+ a.ui.ui.ui.basic.orange.label:hover {
941
+ background: none #fff;
942
+ border-color: #f26202;
943
+ color: #f26202;
944
+ }
945
+
946
+ /* Inverted */
947
+ .ui.inverted.labels .orange.label,
948
+ .ui.ui.ui.inverted.orange.label {
949
+ background-color: #ff851b;
950
+ border-color: #ff851b;
951
+ color: #1b1c1d;
952
+ }
953
+
954
+ /* Inverted Link */
955
+ .ui.inverted.labels a.orange.label:hover,
956
+ a.ui.ui.ui.inverted.orange.label:hover {
957
+ background-color: #e76b00;
958
+ border-color: #e76b00;
959
+ color: #1b1c1d;
960
+ }
961
+
962
+ /* Inverted Ribbon */
963
+ .ui.ui.ui.inverted.orange.ribbon.label {
964
+ border-color: #e76b00;
965
+ }
966
+
967
+ /* Inverted Basic */
968
+ .ui.inverted.basic.labels .orange.label,
969
+ .ui.ui.ui.inverted.basic.orange.label {
970
+ background-color: #1b1c1d;
971
+ border-color: #ff851b;
972
+ color: #ff851b;
973
+ }
974
+ .ui.inverted.basic.labels a.orange.label:hover,
975
+ a.ui.ui.ui.inverted.basic.orange.label:hover {
976
+ border-color: #e76b00;
977
+ background-color: #1b1c1d;
978
+ color: #e76b00;
979
+ }
980
+
981
+ /* Inverted Basic Tags */
982
+ .ui.inverted.basic.tag.labels .orange.label,
983
+ .ui.ui.ui.inverted.orange.basic.tag.label {
984
+ border: 1px solid #ff851b;
985
+ }
986
+ .ui.inverted.basic.tag.labels .orange.label::before,
987
+ .ui.ui.ui.inverted.orange.basic.tag.label::before {
988
+ border-color: inherit;
989
+ border-width: 1px 0 0 1px;
990
+ border-style: inherit;
991
+ background-color: #1b1c1d;
992
+ right: calc(100% + 1px);
993
+ }
994
+ .ui.yellow.labels .label,
995
+ .ui.ui.ui.yellow.label {
996
+ background-color: #fbbd08;
997
+ border-color: #fbbd08;
998
+ color: #fff;
999
+ }
1000
+
1001
+ /* Link */
1002
+ .ui.yellow.labels a.label:hover,
1003
+ a.ui.ui.ui.yellow.label:hover {
1004
+ background-color: #eaae00;
1005
+ border-color: #eaae00;
1006
+ color: #fff;
1007
+ }
1008
+
1009
+ /* Ribbon */
1010
+ .ui.ui.ui.yellow.ribbon.label {
1011
+ border-color: #cd9903;
1012
+ }
1013
+
1014
+ /* Basic */
1015
+ .ui.basic.labels .yellow.label,
1016
+ .ui.ui.ui.basic.yellow.label {
1017
+ background: none #fff;
1018
+ border-color: #fbbd08;
1019
+ color: #fbbd08;
1020
+ }
1021
+ .ui.basic.labels a.yellow.label:hover,
1022
+ a.ui.ui.ui.basic.yellow.label:hover {
1023
+ background: none #fff;
1024
+ border-color: #eaae00;
1025
+ color: #eaae00;
1026
+ }
1027
+
1028
+ /* Inverted */
1029
+ .ui.inverted.labels .yellow.label,
1030
+ .ui.ui.ui.inverted.yellow.label {
1031
+ background-color: #ffe21f;
1032
+ border-color: #ffe21f;
1033
+ color: #1b1c1d;
1034
+ }
1035
+
1036
+ /* Inverted Link */
1037
+ .ui.inverted.labels a.yellow.label:hover,
1038
+ a.ui.ui.ui.inverted.yellow.label:hover {
1039
+ background-color: #ebcd00;
1040
+ border-color: #ebcd00;
1041
+ color: #1b1c1d;
1042
+ }
1043
+
1044
+ /* Inverted Ribbon */
1045
+ .ui.ui.ui.inverted.yellow.ribbon.label {
1046
+ border-color: #ebcd00;
1047
+ }
1048
+
1049
+ /* Inverted Basic */
1050
+ .ui.inverted.basic.labels .yellow.label,
1051
+ .ui.ui.ui.inverted.basic.yellow.label {
1052
+ background-color: #1b1c1d;
1053
+ border-color: #ffe21f;
1054
+ color: #ffe21f;
1055
+ }
1056
+ .ui.inverted.basic.labels a.yellow.label:hover,
1057
+ a.ui.ui.ui.inverted.basic.yellow.label:hover {
1058
+ border-color: #ebcd00;
1059
+ background-color: #1b1c1d;
1060
+ color: #ebcd00;
1061
+ }
1062
+
1063
+ /* Inverted Basic Tags */
1064
+ .ui.inverted.basic.tag.labels .yellow.label,
1065
+ .ui.ui.ui.inverted.yellow.basic.tag.label {
1066
+ border: 1px solid #ffe21f;
1067
+ }
1068
+ .ui.inverted.basic.tag.labels .yellow.label::before,
1069
+ .ui.ui.ui.inverted.yellow.basic.tag.label::before {
1070
+ border-color: inherit;
1071
+ border-width: 1px 0 0 1px;
1072
+ border-style: inherit;
1073
+ background-color: #1b1c1d;
1074
+ right: calc(100% + 1px);
1075
+ }
1076
+ .ui.olive.labels .label,
1077
+ .ui.ui.ui.olive.label {
1078
+ background-color: #b5cc18;
1079
+ border-color: #b5cc18;
1080
+ color: #fff;
1081
+ }
1082
+
1083
+ /* Link */
1084
+ .ui.olive.labels a.label:hover,
1085
+ a.ui.ui.ui.olive.label:hover {
1086
+ background-color: #a7bd0d;
1087
+ border-color: #a7bd0d;
1088
+ color: #fff;
1089
+ }
1090
+
1091
+ /* Ribbon */
1092
+ .ui.ui.ui.olive.ribbon.label {
1093
+ border-color: #8d9e13;
1094
+ }
1095
+
1096
+ /* Basic */
1097
+ .ui.basic.labels .olive.label,
1098
+ .ui.ui.ui.basic.olive.label {
1099
+ background: none #fff;
1100
+ border-color: #b5cc18;
1101
+ color: #b5cc18;
1102
+ }
1103
+ .ui.basic.labels a.olive.label:hover,
1104
+ a.ui.ui.ui.basic.olive.label:hover {
1105
+ background: none #fff;
1106
+ border-color: #a7bd0d;
1107
+ color: #a7bd0d;
1108
+ }
1109
+
1110
+ /* Inverted */
1111
+ .ui.inverted.labels .olive.label,
1112
+ .ui.ui.ui.inverted.olive.label {
1113
+ background-color: #d9e778;
1114
+ border-color: #d9e778;
1115
+ color: #1b1c1d;
1116
+ }
1117
+
1118
+ /* Inverted Link */
1119
+ .ui.inverted.labels a.olive.label:hover,
1120
+ a.ui.ui.ui.inverted.olive.label:hover {
1121
+ background-color: #d2e745;
1122
+ border-color: #d2e745;
1123
+ color: #1b1c1d;
1124
+ }
1125
+
1126
+ /* Inverted Ribbon */
1127
+ .ui.ui.ui.inverted.olive.ribbon.label {
1128
+ border-color: #cddf4d;
1129
+ }
1130
+
1131
+ /* Inverted Basic */
1132
+ .ui.inverted.basic.labels .olive.label,
1133
+ .ui.ui.ui.inverted.basic.olive.label {
1134
+ background-color: #1b1c1d;
1135
+ border-color: #d9e778;
1136
+ color: #d9e778;
1137
+ }
1138
+ .ui.inverted.basic.labels a.olive.label:hover,
1139
+ a.ui.ui.ui.inverted.basic.olive.label:hover {
1140
+ border-color: #d2e745;
1141
+ background-color: #1b1c1d;
1142
+ color: #d2e745;
1143
+ }
1144
+
1145
+ /* Inverted Basic Tags */
1146
+ .ui.inverted.basic.tag.labels .olive.label,
1147
+ .ui.ui.ui.inverted.olive.basic.tag.label {
1148
+ border: 1px solid #d9e778;
1149
+ }
1150
+ .ui.inverted.basic.tag.labels .olive.label::before,
1151
+ .ui.ui.ui.inverted.olive.basic.tag.label::before {
1152
+ border-color: inherit;
1153
+ border-width: 1px 0 0 1px;
1154
+ border-style: inherit;
1155
+ background-color: #1b1c1d;
1156
+ right: calc(100% + 1px);
1157
+ }
1158
+ .ui.green.labels .label,
1159
+ .ui.ui.ui.green.label {
1160
+ background-color: #21ba45;
1161
+ border-color: #21ba45;
1162
+ color: #fff;
1163
+ }
1164
+
1165
+ /* Link */
1166
+ .ui.green.labels a.label:hover,
1167
+ a.ui.ui.ui.green.label:hover {
1168
+ background-color: #16ab39;
1169
+ border-color: #16ab39;
1170
+ color: #fff;
1171
+ }
1172
+
1173
+ /* Ribbon */
1174
+ .ui.ui.ui.green.ribbon.label {
1175
+ border-color: #198f35;
1176
+ }
1177
+
1178
+ /* Basic */
1179
+ .ui.basic.labels .green.label,
1180
+ .ui.ui.ui.basic.green.label {
1181
+ background: none #fff;
1182
+ border-color: #21ba45;
1183
+ color: #21ba45;
1184
+ }
1185
+ .ui.basic.labels a.green.label:hover,
1186
+ a.ui.ui.ui.basic.green.label:hover {
1187
+ background: none #fff;
1188
+ border-color: #16ab39;
1189
+ color: #16ab39;
1190
+ }
1191
+
1192
+ /* Inverted */
1193
+ .ui.inverted.labels .green.label,
1194
+ .ui.ui.ui.inverted.green.label {
1195
+ background-color: #2ecc40;
1196
+ border-color: #2ecc40;
1197
+ color: #1b1c1d;
1198
+ }
1199
+
1200
+ /* Inverted Link */
1201
+ .ui.inverted.labels a.green.label:hover,
1202
+ a.ui.ui.ui.inverted.green.label:hover {
1203
+ background-color: #1ea92e;
1204
+ border-color: #1ea92e;
1205
+ color: #1b1c1d;
1206
+ }
1207
+
1208
+ /* Inverted Ribbon */
1209
+ .ui.ui.ui.inverted.green.ribbon.label {
1210
+ border-color: #25a233;
1211
+ }
1212
+
1213
+ /* Inverted Basic */
1214
+ .ui.inverted.basic.labels .green.label,
1215
+ .ui.ui.ui.inverted.basic.green.label {
1216
+ background-color: #1b1c1d;
1217
+ border-color: #2ecc40;
1218
+ color: #2ecc40;
1219
+ }
1220
+ .ui.inverted.basic.labels a.green.label:hover,
1221
+ a.ui.ui.ui.inverted.basic.green.label:hover {
1222
+ border-color: #1ea92e;
1223
+ background-color: #1b1c1d;
1224
+ color: #1ea92e;
1225
+ }
1226
+
1227
+ /* Inverted Basic Tags */
1228
+ .ui.inverted.basic.tag.labels .green.label,
1229
+ .ui.ui.ui.inverted.green.basic.tag.label {
1230
+ border: 1px solid #2ecc40;
1231
+ }
1232
+ .ui.inverted.basic.tag.labels .green.label::before,
1233
+ .ui.ui.ui.inverted.green.basic.tag.label::before {
1234
+ border-color: inherit;
1235
+ border-width: 1px 0 0 1px;
1236
+ border-style: inherit;
1237
+ background-color: #1b1c1d;
1238
+ right: calc(100% + 1px);
1239
+ }
1240
+ .ui.teal.labels .label,
1241
+ .ui.ui.ui.teal.label {
1242
+ background-color: #00b5ad;
1243
+ border-color: #00b5ad;
1244
+ color: #fff;
1245
+ }
1246
+
1247
+ /* Link */
1248
+ .ui.teal.labels a.label:hover,
1249
+ a.ui.ui.ui.teal.label:hover {
1250
+ background-color: #009c95;
1251
+ border-color: #009c95;
1252
+ color: #fff;
1253
+ }
1254
+
1255
+ /* Ribbon */
1256
+ .ui.ui.ui.teal.ribbon.label {
1257
+ border-color: #00827c;
1258
+ }
1259
+
1260
+ /* Basic */
1261
+ .ui.basic.labels .teal.label,
1262
+ .ui.ui.ui.basic.teal.label {
1263
+ background: none #fff;
1264
+ border-color: #00b5ad;
1265
+ color: #00b5ad;
1266
+ }
1267
+ .ui.basic.labels a.teal.label:hover,
1268
+ a.ui.ui.ui.basic.teal.label:hover {
1269
+ background: none #fff;
1270
+ border-color: #009c95;
1271
+ color: #009c95;
1272
+ }
1273
+
1274
+ /* Inverted */
1275
+ .ui.inverted.labels .teal.label,
1276
+ .ui.ui.ui.inverted.teal.label {
1277
+ background-color: #6dffff;
1278
+ border-color: #6dffff;
1279
+ color: #1b1c1d;
1280
+ }
1281
+
1282
+ /* Inverted Link */
1283
+ .ui.inverted.labels a.teal.label:hover,
1284
+ a.ui.ui.ui.inverted.teal.label:hover {
1285
+ background-color: #3affff;
1286
+ border-color: #3affff;
1287
+ color: #1b1c1d;
1288
+ }
1289
+
1290
+ /* Inverted Ribbon */
1291
+ .ui.ui.ui.inverted.teal.ribbon.label {
1292
+ border-color: #3affff;
1293
+ }
1294
+
1295
+ /* Inverted Basic */
1296
+ .ui.inverted.basic.labels .teal.label,
1297
+ .ui.ui.ui.inverted.basic.teal.label {
1298
+ background-color: #1b1c1d;
1299
+ border-color: #6dffff;
1300
+ color: #6dffff;
1301
+ }
1302
+ .ui.inverted.basic.labels a.teal.label:hover,
1303
+ a.ui.ui.ui.inverted.basic.teal.label:hover {
1304
+ border-color: #3affff;
1305
+ background-color: #1b1c1d;
1306
+ color: #3affff;
1307
+ }
1308
+
1309
+ /* Inverted Basic Tags */
1310
+ .ui.inverted.basic.tag.labels .teal.label,
1311
+ .ui.ui.ui.inverted.teal.basic.tag.label {
1312
+ border: 1px solid #6dffff;
1313
+ }
1314
+ .ui.inverted.basic.tag.labels .teal.label::before,
1315
+ .ui.ui.ui.inverted.teal.basic.tag.label::before {
1316
+ border-color: inherit;
1317
+ border-width: 1px 0 0 1px;
1318
+ border-style: inherit;
1319
+ background-color: #1b1c1d;
1320
+ right: calc(100% + 1px);
1321
+ }
1322
+ .ui.blue.labels .label,
1323
+ .ui.ui.ui.blue.label {
1324
+ background-color: #2185d0;
1325
+ border-color: #2185d0;
1326
+ color: #fff;
1327
+ }
1328
+
1329
+ /* Link */
1330
+ .ui.blue.labels a.label:hover,
1331
+ a.ui.ui.ui.blue.label:hover {
1332
+ background-color: #1678c2;
1333
+ border-color: #1678c2;
1334
+ color: #fff;
1335
+ }
1336
+
1337
+ /* Ribbon */
1338
+ .ui.ui.ui.blue.ribbon.label {
1339
+ border-color: #1a69a4;
1340
+ }
1341
+
1342
+ /* Basic */
1343
+ .ui.basic.labels .blue.label,
1344
+ .ui.ui.ui.basic.blue.label {
1345
+ background: none #fff;
1346
+ border-color: #2185d0;
1347
+ color: #2185d0;
1348
+ }
1349
+ .ui.basic.labels a.blue.label:hover,
1350
+ a.ui.ui.ui.basic.blue.label:hover {
1351
+ background: none #fff;
1352
+ border-color: #1678c2;
1353
+ color: #1678c2;
1354
+ }
1355
+
1356
+ /* Inverted */
1357
+ .ui.inverted.labels .blue.label,
1358
+ .ui.ui.ui.inverted.blue.label {
1359
+ background-color: #54c8ff;
1360
+ border-color: #54c8ff;
1361
+ color: #1b1c1d;
1362
+ }
1363
+
1364
+ /* Inverted Link */
1365
+ .ui.inverted.labels a.blue.label:hover,
1366
+ a.ui.ui.ui.inverted.blue.label:hover {
1367
+ background-color: #21b8ff;
1368
+ border-color: #21b8ff;
1369
+ color: #1b1c1d;
1370
+ }
1371
+
1372
+ /* Inverted Ribbon */
1373
+ .ui.ui.ui.inverted.blue.ribbon.label {
1374
+ border-color: #21b8ff;
1375
+ }
1376
+
1377
+ /* Inverted Basic */
1378
+ .ui.inverted.basic.labels .blue.label,
1379
+ .ui.ui.ui.inverted.basic.blue.label {
1380
+ background-color: #1b1c1d;
1381
+ border-color: #54c8ff;
1382
+ color: #54c8ff;
1383
+ }
1384
+ .ui.inverted.basic.labels a.blue.label:hover,
1385
+ a.ui.ui.ui.inverted.basic.blue.label:hover {
1386
+ border-color: #21b8ff;
1387
+ background-color: #1b1c1d;
1388
+ color: #21b8ff;
1389
+ }
1390
+
1391
+ /* Inverted Basic Tags */
1392
+ .ui.inverted.basic.tag.labels .blue.label,
1393
+ .ui.ui.ui.inverted.blue.basic.tag.label {
1394
+ border: 1px solid #54c8ff;
1395
+ }
1396
+ .ui.inverted.basic.tag.labels .blue.label::before,
1397
+ .ui.ui.ui.inverted.blue.basic.tag.label::before {
1398
+ border-color: inherit;
1399
+ border-width: 1px 0 0 1px;
1400
+ border-style: inherit;
1401
+ background-color: #1b1c1d;
1402
+ right: calc(100% + 1px);
1403
+ }
1404
+ .ui.violet.labels .label,
1405
+ .ui.ui.ui.violet.label {
1406
+ background-color: #6435c9;
1407
+ border-color: #6435c9;
1408
+ color: #fff;
1409
+ }
1410
+
1411
+ /* Link */
1412
+ .ui.violet.labels a.label:hover,
1413
+ a.ui.ui.ui.violet.label:hover {
1414
+ background-color: #5829bb;
1415
+ border-color: #5829bb;
1416
+ color: #fff;
1417
+ }
1418
+
1419
+ /* Ribbon */
1420
+ .ui.ui.ui.violet.ribbon.label {
1421
+ border-color: #502aa1;
1422
+ }
1423
+
1424
+ /* Basic */
1425
+ .ui.basic.labels .violet.label,
1426
+ .ui.ui.ui.basic.violet.label {
1427
+ background: none #fff;
1428
+ border-color: #6435c9;
1429
+ color: #6435c9;
1430
+ }
1431
+ .ui.basic.labels a.violet.label:hover,
1432
+ a.ui.ui.ui.basic.violet.label:hover {
1433
+ background: none #fff;
1434
+ border-color: #5829bb;
1435
+ color: #5829bb;
1436
+ }
1437
+
1438
+ /* Inverted */
1439
+ .ui.inverted.labels .violet.label,
1440
+ .ui.ui.ui.inverted.violet.label {
1441
+ background-color: #a291fb;
1442
+ border-color: #a291fb;
1443
+ color: #1b1c1d;
1444
+ }
1445
+
1446
+ /* Inverted Link */
1447
+ .ui.inverted.labels a.violet.label:hover,
1448
+ a.ui.ui.ui.inverted.violet.label:hover {
1449
+ background-color: #745aff;
1450
+ border-color: #745aff;
1451
+ color: #1b1c1d;
1452
+ }
1453
+
1454
+ /* Inverted Ribbon */
1455
+ .ui.ui.ui.inverted.violet.ribbon.label {
1456
+ border-color: #7860f9;
1457
+ }
1458
+
1459
+ /* Inverted Basic */
1460
+ .ui.inverted.basic.labels .violet.label,
1461
+ .ui.ui.ui.inverted.basic.violet.label {
1462
+ background-color: #1b1c1d;
1463
+ border-color: #a291fb;
1464
+ color: #a291fb;
1465
+ }
1466
+ .ui.inverted.basic.labels a.violet.label:hover,
1467
+ a.ui.ui.ui.inverted.basic.violet.label:hover {
1468
+ border-color: #745aff;
1469
+ background-color: #1b1c1d;
1470
+ color: #745aff;
1471
+ }
1472
+
1473
+ /* Inverted Basic Tags */
1474
+ .ui.inverted.basic.tag.labels .violet.label,
1475
+ .ui.ui.ui.inverted.violet.basic.tag.label {
1476
+ border: 1px solid #a291fb;
1477
+ }
1478
+ .ui.inverted.basic.tag.labels .violet.label::before,
1479
+ .ui.ui.ui.inverted.violet.basic.tag.label::before {
1480
+ border-color: inherit;
1481
+ border-width: 1px 0 0 1px;
1482
+ border-style: inherit;
1483
+ background-color: #1b1c1d;
1484
+ right: calc(100% + 1px);
1485
+ }
1486
+ .ui.purple.labels .label,
1487
+ .ui.ui.ui.purple.label {
1488
+ background-color: #a333c8;
1489
+ border-color: #a333c8;
1490
+ color: #fff;
1491
+ }
1492
+
1493
+ /* Link */
1494
+ .ui.purple.labels a.label:hover,
1495
+ a.ui.ui.ui.purple.label:hover {
1496
+ background-color: #9627ba;
1497
+ border-color: #9627ba;
1498
+ color: #fff;
1499
+ }
1500
+
1501
+ /* Ribbon */
1502
+ .ui.ui.ui.purple.ribbon.label {
1503
+ border-color: #82299f;
1504
+ }
1505
+
1506
+ /* Basic */
1507
+ .ui.basic.labels .purple.label,
1508
+ .ui.ui.ui.basic.purple.label {
1509
+ background: none #fff;
1510
+ border-color: #a333c8;
1511
+ color: #a333c8;
1512
+ }
1513
+ .ui.basic.labels a.purple.label:hover,
1514
+ a.ui.ui.ui.basic.purple.label:hover {
1515
+ background: none #fff;
1516
+ border-color: #9627ba;
1517
+ color: #9627ba;
1518
+ }
1519
+
1520
+ /* Inverted */
1521
+ .ui.inverted.labels .purple.label,
1522
+ .ui.ui.ui.inverted.purple.label {
1523
+ background-color: #dc73ff;
1524
+ border-color: #dc73ff;
1525
+ color: #1b1c1d;
1526
+ }
1527
+
1528
+ /* Inverted Link */
1529
+ .ui.inverted.labels a.purple.label:hover,
1530
+ a.ui.ui.ui.inverted.purple.label:hover {
1531
+ background-color: #cf40ff;
1532
+ border-color: #cf40ff;
1533
+ color: #1b1c1d;
1534
+ }
1535
+
1536
+ /* Inverted Ribbon */
1537
+ .ui.ui.ui.inverted.purple.ribbon.label {
1538
+ border-color: #cf40ff;
1539
+ }
1540
+
1541
+ /* Inverted Basic */
1542
+ .ui.inverted.basic.labels .purple.label,
1543
+ .ui.ui.ui.inverted.basic.purple.label {
1544
+ background-color: #1b1c1d;
1545
+ border-color: #dc73ff;
1546
+ color: #dc73ff;
1547
+ }
1548
+ .ui.inverted.basic.labels a.purple.label:hover,
1549
+ a.ui.ui.ui.inverted.basic.purple.label:hover {
1550
+ border-color: #cf40ff;
1551
+ background-color: #1b1c1d;
1552
+ color: #cf40ff;
1553
+ }
1554
+
1555
+ /* Inverted Basic Tags */
1556
+ .ui.inverted.basic.tag.labels .purple.label,
1557
+ .ui.ui.ui.inverted.purple.basic.tag.label {
1558
+ border: 1px solid #dc73ff;
1559
+ }
1560
+ .ui.inverted.basic.tag.labels .purple.label::before,
1561
+ .ui.ui.ui.inverted.purple.basic.tag.label::before {
1562
+ border-color: inherit;
1563
+ border-width: 1px 0 0 1px;
1564
+ border-style: inherit;
1565
+ background-color: #1b1c1d;
1566
+ right: calc(100% + 1px);
1567
+ }
1568
+ .ui.pink.labels .label,
1569
+ .ui.ui.ui.pink.label {
1570
+ background-color: #e03997;
1571
+ border-color: #e03997;
1572
+ color: #fff;
1573
+ }
1574
+
1575
+ /* Link */
1576
+ .ui.pink.labels a.label:hover,
1577
+ a.ui.ui.ui.pink.label:hover {
1578
+ background-color: #e61a8d;
1579
+ border-color: #e61a8d;
1580
+ color: #fff;
1581
+ }
1582
+
1583
+ /* Ribbon */
1584
+ .ui.ui.ui.pink.ribbon.label {
1585
+ border-color: #c71f7e;
1586
+ }
1587
+
1588
+ /* Basic */
1589
+ .ui.basic.labels .pink.label,
1590
+ .ui.ui.ui.basic.pink.label {
1591
+ background: none #fff;
1592
+ border-color: #e03997;
1593
+ color: #e03997;
1594
+ }
1595
+ .ui.basic.labels a.pink.label:hover,
1596
+ a.ui.ui.ui.basic.pink.label:hover {
1597
+ background: none #fff;
1598
+ border-color: #e61a8d;
1599
+ color: #e61a8d;
1600
+ }
1601
+
1602
+ /* Inverted */
1603
+ .ui.inverted.labels .pink.label,
1604
+ .ui.ui.ui.inverted.pink.label {
1605
+ background-color: #ff8edf;
1606
+ border-color: #ff8edf;
1607
+ color: #1b1c1d;
1608
+ }
1609
+
1610
+ /* Inverted Link */
1611
+ .ui.inverted.labels a.pink.label:hover,
1612
+ a.ui.ui.ui.inverted.pink.label:hover {
1613
+ background-color: #ff5bd1;
1614
+ border-color: #ff5bd1;
1615
+ color: #1b1c1d;
1616
+ }
1617
+
1618
+ /* Inverted Ribbon */
1619
+ .ui.ui.ui.inverted.pink.ribbon.label {
1620
+ border-color: #ff5bd1;
1621
+ }
1622
+
1623
+ /* Inverted Basic */
1624
+ .ui.inverted.basic.labels .pink.label,
1625
+ .ui.ui.ui.inverted.basic.pink.label {
1626
+ background-color: #1b1c1d;
1627
+ border-color: #ff8edf;
1628
+ color: #ff8edf;
1629
+ }
1630
+ .ui.inverted.basic.labels a.pink.label:hover,
1631
+ a.ui.ui.ui.inverted.basic.pink.label:hover {
1632
+ border-color: #ff5bd1;
1633
+ background-color: #1b1c1d;
1634
+ color: #ff5bd1;
1635
+ }
1636
+
1637
+ /* Inverted Basic Tags */
1638
+ .ui.inverted.basic.tag.labels .pink.label,
1639
+ .ui.ui.ui.inverted.pink.basic.tag.label {
1640
+ border: 1px solid #ff8edf;
1641
+ }
1642
+ .ui.inverted.basic.tag.labels .pink.label::before,
1643
+ .ui.ui.ui.inverted.pink.basic.tag.label::before {
1644
+ border-color: inherit;
1645
+ border-width: 1px 0 0 1px;
1646
+ border-style: inherit;
1647
+ background-color: #1b1c1d;
1648
+ right: calc(100% + 1px);
1649
+ }
1650
+ .ui.brown.labels .label,
1651
+ .ui.ui.ui.brown.label {
1652
+ background-color: #a5673f;
1653
+ border-color: #a5673f;
1654
+ color: #fff;
1655
+ }
1656
+
1657
+ /* Link */
1658
+ .ui.brown.labels a.label:hover,
1659
+ a.ui.ui.ui.brown.label:hover {
1660
+ background-color: #975b33;
1661
+ border-color: #975b33;
1662
+ color: #fff;
1663
+ }
1664
+
1665
+ /* Ribbon */
1666
+ .ui.ui.ui.brown.ribbon.label {
1667
+ border-color: #805031;
1668
+ }
1669
+
1670
+ /* Basic */
1671
+ .ui.basic.labels .brown.label,
1672
+ .ui.ui.ui.basic.brown.label {
1673
+ background: none #fff;
1674
+ border-color: #a5673f;
1675
+ color: #a5673f;
1676
+ }
1677
+ .ui.basic.labels a.brown.label:hover,
1678
+ a.ui.ui.ui.basic.brown.label:hover {
1679
+ background: none #fff;
1680
+ border-color: #975b33;
1681
+ color: #975b33;
1682
+ }
1683
+
1684
+ /* Inverted */
1685
+ .ui.inverted.labels .brown.label,
1686
+ .ui.ui.ui.inverted.brown.label {
1687
+ background-color: #d67c1c;
1688
+ border-color: #d67c1c;
1689
+ color: #1b1c1d;
1690
+ }
1691
+
1692
+ /* Inverted Link */
1693
+ .ui.inverted.labels a.brown.label:hover,
1694
+ a.ui.ui.ui.inverted.brown.label:hover {
1695
+ background-color: #b0620f;
1696
+ border-color: #b0620f;
1697
+ color: #1b1c1d;
1698
+ }
1699
+
1700
+ /* Inverted Ribbon */
1701
+ .ui.ui.ui.inverted.brown.ribbon.label {
1702
+ border-color: #a96216;
1703
+ }
1704
+
1705
+ /* Inverted Basic */
1706
+ .ui.inverted.basic.labels .brown.label,
1707
+ .ui.ui.ui.inverted.basic.brown.label {
1708
+ background-color: #1b1c1d;
1709
+ border-color: #d67c1c;
1710
+ color: #d67c1c;
1711
+ }
1712
+ .ui.inverted.basic.labels a.brown.label:hover,
1713
+ a.ui.ui.ui.inverted.basic.brown.label:hover {
1714
+ border-color: #b0620f;
1715
+ background-color: #1b1c1d;
1716
+ color: #b0620f;
1717
+ }
1718
+
1719
+ /* Inverted Basic Tags */
1720
+ .ui.inverted.basic.tag.labels .brown.label,
1721
+ .ui.ui.ui.inverted.brown.basic.tag.label {
1722
+ border: 1px solid #d67c1c;
1723
+ }
1724
+ .ui.inverted.basic.tag.labels .brown.label::before,
1725
+ .ui.ui.ui.inverted.brown.basic.tag.label::before {
1726
+ border-color: inherit;
1727
+ border-width: 1px 0 0 1px;
1728
+ border-style: inherit;
1729
+ background-color: #1b1c1d;
1730
+ right: calc(100% + 1px);
1731
+ }
1732
+ .ui.grey.labels .label,
1733
+ .ui.ui.ui.grey.label {
1734
+ background-color: #767676;
1735
+ border-color: #767676;
1736
+ color: #fff;
1737
+ }
1738
+
1739
+ /* Link */
1740
+ .ui.grey.labels a.label:hover,
1741
+ a.ui.ui.ui.grey.label:hover {
1742
+ background-color: #838383;
1743
+ border-color: #838383;
1744
+ color: #fff;
1745
+ }
1746
+
1747
+ /* Ribbon */
1748
+ .ui.ui.ui.grey.ribbon.label {
1749
+ border-color: #5d5d5d;
1750
+ }
1751
+
1752
+ /* Basic */
1753
+ .ui.basic.labels .grey.label,
1754
+ .ui.ui.ui.basic.grey.label {
1755
+ background: none #fff;
1756
+ border-color: #767676;
1757
+ color: #767676;
1758
+ }
1759
+ .ui.basic.labels a.grey.label:hover,
1760
+ a.ui.ui.ui.basic.grey.label:hover {
1761
+ background: none #fff;
1762
+ border-color: #838383;
1763
+ color: #838383;
1764
+ }
1765
+
1766
+ /* Inverted */
1767
+ .ui.inverted.labels .grey.label,
1768
+ .ui.ui.ui.inverted.grey.label {
1769
+ background-color: #dcddde;
1770
+ border-color: #dcddde;
1771
+ color: #1b1c1d;
1772
+ }
1773
+
1774
+ /* Inverted Link */
1775
+ .ui.inverted.labels a.grey.label:hover,
1776
+ a.ui.ui.ui.inverted.grey.label:hover {
1777
+ background-color: #c2c4c5;
1778
+ border-color: #c2c4c5;
1779
+ color: #fff;
1780
+ }
1781
+
1782
+ /* Inverted Ribbon */
1783
+ .ui.ui.ui.inverted.grey.ribbon.label {
1784
+ border-color: #e9eaea;
1785
+ }
1786
+
1787
+ /* Inverted Basic */
1788
+ .ui.inverted.basic.labels .grey.label,
1789
+ .ui.ui.ui.inverted.basic.grey.label {
1790
+ background-color: #1b1c1d;
1791
+ border-color: #dcddde;
1792
+ color: rgba(255, 255, 255, 0.9);
1793
+ }
1794
+ .ui.inverted.basic.labels a.grey.label:hover,
1795
+ a.ui.ui.ui.inverted.basic.grey.label:hover {
1796
+ border-color: #c2c4c5;
1797
+ background-color: #1b1c1d;
1798
+ }
1799
+
1800
+ /* Inverted Basic Tags */
1801
+ .ui.inverted.basic.tag.labels .grey.label,
1802
+ .ui.ui.ui.inverted.grey.basic.tag.label {
1803
+ border: 1px solid #dcddde;
1804
+ }
1805
+ .ui.inverted.basic.tag.labels .grey.label::before,
1806
+ .ui.ui.ui.inverted.grey.basic.tag.label::before {
1807
+ border-color: inherit;
1808
+ border-width: 1px 0 0 1px;
1809
+ border-style: inherit;
1810
+ background-color: #1b1c1d;
1811
+ right: calc(100% + 1px);
1812
+ }
1813
+ .ui.black.labels .label,
1814
+ .ui.ui.ui.black.label {
1815
+ background-color: #1b1c1d;
1816
+ border-color: #1b1c1d;
1817
+ color: #fff;
1818
+ }
1819
+
1820
+ /* Link */
1821
+ .ui.black.labels a.label:hover,
1822
+ a.ui.ui.ui.black.label:hover {
1823
+ background-color: #27292a;
1824
+ border-color: #27292a;
1825
+ color: #fff;
1826
+ }
1827
+
1828
+ /* Ribbon */
1829
+ .ui.ui.ui.black.ribbon.label {
1830
+ border-color: #020203;
1831
+ }
1832
+
1833
+ /* Basic */
1834
+ .ui.basic.labels .black.label,
1835
+ .ui.ui.ui.basic.black.label {
1836
+ background: none #fff;
1837
+ border-color: #1b1c1d;
1838
+ color: #1b1c1d;
1839
+ }
1840
+ .ui.basic.labels a.black.label:hover,
1841
+ a.ui.ui.ui.basic.black.label:hover {
1842
+ background: none #fff;
1843
+ border-color: #27292a;
1844
+ color: #27292a;
1845
+ }
1846
+
1847
+ /* Inverted */
1848
+ .ui.inverted.labels .black.label,
1849
+ .ui.ui.ui.inverted.black.label {
1850
+ background-color: #545454;
1851
+ border-color: #545454;
1852
+ color: #1b1c1d;
1853
+ }
1854
+
1855
+ /* Inverted Link */
1856
+ .ui.inverted.labels a.black.label:hover,
1857
+ a.ui.ui.ui.inverted.black.label:hover {
1858
+ background-color: #000000;
1859
+ border-color: #000000;
1860
+ color: #fff;
1861
+ }
1862
+
1863
+ /* Inverted Ribbon */
1864
+ .ui.ui.ui.inverted.black.ribbon.label {
1865
+ border-color: #616161;
1866
+ }
1867
+
1868
+ /* Inverted Basic */
1869
+ .ui.inverted.basic.labels .black.label,
1870
+ .ui.ui.ui.inverted.basic.black.label {
1871
+ background-color: #1b1c1d;
1872
+ border-color: #545454;
1873
+ color: rgba(255, 255, 255, 0.9);
1874
+ }
1875
+ .ui.inverted.basic.labels a.black.label:hover,
1876
+ a.ui.ui.ui.inverted.basic.black.label:hover {
1877
+ border-color: #000000;
1878
+ background-color: #1b1c1d;
1879
+ }
1880
+
1881
+ /* Inverted Basic Tags */
1882
+ .ui.inverted.basic.tag.labels .black.label,
1883
+ .ui.ui.ui.inverted.black.basic.tag.label {
1884
+ border: 1px solid #545454;
1885
+ }
1886
+ .ui.inverted.basic.tag.labels .black.label::before,
1887
+ .ui.ui.ui.inverted.black.basic.tag.label::before {
1888
+ border-color: inherit;
1889
+ border-width: 1px 0 0 1px;
1890
+ border-style: inherit;
1891
+ background-color: #1b1c1d;
1892
+ right: calc(100% + 1px);
1893
+ }
1894
+
1895
+ /* -------------------
1896
+ Horizontal
1897
+ -------------------- */
1898
+ .ui.horizontal.labels .label,
1899
+ .ui.horizontal.label {
1900
+ margin: 0 0.5em 0 0;
1901
+ padding: 0.4em 0.833em;
1902
+ min-width: 3em;
1903
+ text-align: center;
1904
+ }
1905
+
1906
+ /* -------------------
1907
+ Circular
1908
+ -------------------- */
1909
+ .ui.circular.labels .label,
1910
+ .ui.circular.label {
1911
+ min-width: 2em;
1912
+ min-height: 2em;
1913
+ padding: 0.5em !important;
1914
+ line-height: 1em;
1915
+ text-align: center;
1916
+ border-radius: 500rem;
1917
+ }
1918
+ .ui.empty.circular.labels .label,
1919
+ .ui.empty.circular.label {
1920
+ min-width: 0;
1921
+ min-height: 0;
1922
+ overflow: hidden;
1923
+ width: 0.5em;
1924
+ height: 0.5em;
1925
+ vertical-align: baseline;
1926
+ }
1927
+
1928
+ /* -------------------
1929
+ Pointing
1930
+ -------------------- */
1931
+ .ui.pointing.label {
1932
+ position: relative;
1933
+ }
1934
+ .ui.attached.pointing.label {
1935
+ position: absolute;
1936
+ }
1937
+ .ui.pointing.label::before {
1938
+ background-color: inherit;
1939
+ background-image: inherit;
1940
+ border-width: 0;
1941
+ border-style: solid;
1942
+ border-color: inherit;
1943
+ }
1944
+
1945
+ /* Arrow */
1946
+ .ui.pointing.label::before {
1947
+ position: absolute;
1948
+ content: "";
1949
+ transform: rotate(45deg);
1950
+ background-image: none;
1951
+ z-index: 2;
1952
+ width: 0.6666em;
1953
+ height: 0.6666em;
1954
+ transition: none;
1955
+ }
1956
+
1957
+ /* --- Above --- */
1958
+ .ui.pointing.label,
1959
+ .ui[class*="pointing above"].label {
1960
+ margin-top: 1em;
1961
+ }
1962
+ .ui.pointing.label::before,
1963
+ .ui[class*="pointing above"].label::before {
1964
+ border-width: 1px 0 0 1px;
1965
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
1966
+ top: 0;
1967
+ left: 50%;
1968
+ }
1969
+
1970
+ /* --- Below --- */
1971
+ .ui[class*="bottom pointing"].label,
1972
+ .ui[class*="pointing below"].label {
1973
+ margin-top: 0;
1974
+ margin-bottom: 1em;
1975
+ }
1976
+ .ui[class*="bottom pointing"].label::before,
1977
+ .ui[class*="pointing below"].label::before {
1978
+ border-width: 0 1px 1px 0;
1979
+ right: auto;
1980
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
1981
+ top: 100%;
1982
+ left: 50%;
1983
+ }
1984
+
1985
+ /* --- Left --- */
1986
+ .ui[class*="left pointing"].label {
1987
+ margin-top: 0;
1988
+ margin-left: 0.6666em;
1989
+ }
1990
+ .ui[class*="left pointing"].label::before {
1991
+ border-width: 0 0 1px 1px;
1992
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
1993
+ bottom: auto;
1994
+ right: auto;
1995
+ top: 50%;
1996
+ left: 0;
1997
+ }
1998
+
1999
+ /* --- Right --- */
2000
+ .ui[class*="right pointing"].label {
2001
+ margin-top: 0;
2002
+ margin-right: 0.6666em;
2003
+ }
2004
+ .ui[class*="right pointing"].label::before {
2005
+ border-width: 1px 1px 0 0;
2006
+ transform: translateX(50%) translateY(-50%) rotate(45deg);
2007
+ top: 50%;
2008
+ right: 0;
2009
+ bottom: auto;
2010
+ left: auto;
2011
+ }
2012
+
2013
+ /* Basic Pointing */
2014
+
2015
+ /* --- Above --- */
2016
+ .ui.basic.pointing.label::before,
2017
+ .ui.basic[class*="pointing above"].label::before {
2018
+ margin-top: -1px;
2019
+ }
2020
+
2021
+ /* --- Below --- */
2022
+ .ui.basic[class*="bottom pointing"].label::before,
2023
+ .ui.basic[class*="pointing below"].label::before {
2024
+ bottom: auto;
2025
+ top: 100%;
2026
+ margin-top: 1px;
2027
+ }
2028
+
2029
+ /* --- Left --- */
2030
+ .ui.basic[class*="left pointing"].label::before {
2031
+ top: 50%;
2032
+ left: -1px;
2033
+ }
2034
+
2035
+ /* --- Right --- */
2036
+ .ui.basic[class*="right pointing"].label::before {
2037
+ top: 50%;
2038
+ right: -1px;
2039
+ }
2040
+
2041
+ /* ------------------
2042
+ Floating Label
2043
+ ------------------- */
2044
+ .ui.floating.label {
2045
+ position: absolute;
2046
+ z-index: 100;
2047
+ top: -1em;
2048
+ right: 0;
2049
+ white-space: nowrap;
2050
+ transform: translateX(50%);
2051
+ }
2052
+ .ui.right.aligned.floating.label {
2053
+ transform: translateX(1.2em);
2054
+ }
2055
+ .ui.left.floating.label {
2056
+ left: 0;
2057
+ right: auto;
2058
+ transform: translateX(-50%);
2059
+ }
2060
+ .ui.left.aligned.floating.label {
2061
+ transform: translateX(-1.2em);
2062
+ }
2063
+ .ui.bottom.floating.label {
2064
+ top: auto;
2065
+ bottom: -1em;
2066
+ }
2067
+
2068
+ /* -------------------
2069
+ Sizes
2070
+ -------------------- */
2071
+ .ui.labels .label,
2072
+ .ui.label {
2073
+ font-size: 0.85714286rem;
2074
+ }
2075
+ .ui.mini.labels .label,
2076
+ .ui.mini.label {
2077
+ font-size: 0.64285714rem;
2078
+ }
2079
+ .ui.tiny.labels .label,
2080
+ .ui.tiny.label {
2081
+ font-size: 0.71428571rem;
2082
+ }
2083
+ .ui.small.labels .label,
2084
+ .ui.small.label {
2085
+ font-size: 0.78571429rem;
2086
+ }
2087
+ .ui.large.labels .label,
2088
+ .ui.large.label {
2089
+ font-size: 1rem;
2090
+ }
2091
+ .ui.big.labels .label,
2092
+ .ui.big.label {
2093
+ font-size: 1.28571429rem;
2094
+ }
2095
+ .ui.huge.labels .label,
2096
+ .ui.huge.label {
2097
+ font-size: 1.42857143rem;
2098
+ }
2099
+ .ui.massive.labels .label,
2100
+ .ui.massive.label {
2101
+ font-size: 1.71428571rem;
2102
+ }
2103
+
2104
+
2105
+ /*******************************
2106
+ Theme Overrides
2107
+ *******************************/
2108
+
2109
+
2110
+
2111
+ /*******************************
2112
+ Site Overrides
2113
+ *******************************/
2114
+