fomantic-ui-sass 2.6.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (165) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +27 -0
  3. data/.rspec +1 -0
  4. data/.travis.yml +5 -0
  5. data/CHANGELOG.md +370 -0
  6. data/Gemfile +4 -0
  7. data/LICENSE.txt +22 -0
  8. data/README.md +177 -0
  9. data/Rakefile +8 -0
  10. data/app/assets/fonts/semantic-ui/brand-icons.eot +0 -0
  11. data/app/assets/fonts/semantic-ui/brand-icons.svg +1008 -0
  12. data/app/assets/fonts/semantic-ui/brand-icons.ttf +0 -0
  13. data/app/assets/fonts/semantic-ui/brand-icons.woff +0 -0
  14. data/app/assets/fonts/semantic-ui/brand-icons.woff2 +0 -0
  15. data/app/assets/fonts/semantic-ui/icons.eot +0 -0
  16. data/app/assets/fonts/semantic-ui/icons.otf +0 -0
  17. data/app/assets/fonts/semantic-ui/icons.svg +1518 -0
  18. data/app/assets/fonts/semantic-ui/icons.ttf +0 -0
  19. data/app/assets/fonts/semantic-ui/icons.woff +0 -0
  20. data/app/assets/fonts/semantic-ui/icons.woff2 +0 -0
  21. data/app/assets/fonts/semantic-ui/outline-icons.eot +0 -0
  22. data/app/assets/fonts/semantic-ui/outline-icons.svg +366 -0
  23. data/app/assets/fonts/semantic-ui/outline-icons.ttf +0 -0
  24. data/app/assets/fonts/semantic-ui/outline-icons.woff +0 -0
  25. data/app/assets/fonts/semantic-ui/outline-icons.woff2 +0 -0
  26. data/app/assets/images/semantic-ui/flags.png +0 -0
  27. data/app/assets/javascripts/semantic-ui.js +27 -0
  28. data/app/assets/javascripts/semantic-ui/accordion.js +613 -0
  29. data/app/assets/javascripts/semantic-ui/api.js +1167 -0
  30. data/app/assets/javascripts/semantic-ui/calendar.js +1476 -0
  31. data/app/assets/javascripts/semantic-ui/checkbox.js +828 -0
  32. data/app/assets/javascripts/semantic-ui/colorize.js +280 -0
  33. data/app/assets/javascripts/semantic-ui/dimmer.js +735 -0
  34. data/app/assets/javascripts/semantic-ui/dropdown.js +4030 -0
  35. data/app/assets/javascripts/semantic-ui/embed.js +706 -0
  36. data/app/assets/javascripts/semantic-ui/form.js +1707 -0
  37. data/app/assets/javascripts/semantic-ui/modal.js +1090 -0
  38. data/app/assets/javascripts/semantic-ui/nag.js +507 -0
  39. data/app/assets/javascripts/semantic-ui/popup.js +1532 -0
  40. data/app/assets/javascripts/semantic-ui/progress.js +923 -0
  41. data/app/assets/javascripts/semantic-ui/range.js +278 -0
  42. data/app/assets/javascripts/semantic-ui/rating.js +511 -0
  43. data/app/assets/javascripts/semantic-ui/search.js +1515 -0
  44. data/app/assets/javascripts/semantic-ui/shape.js +921 -0
  45. data/app/assets/javascripts/semantic-ui/sidebar.js +1033 -0
  46. data/app/assets/javascripts/semantic-ui/site.js +490 -0
  47. data/app/assets/javascripts/semantic-ui/state.js +708 -0
  48. data/app/assets/javascripts/semantic-ui/sticky.js +959 -0
  49. data/app/assets/javascripts/semantic-ui/tab.js +952 -0
  50. data/app/assets/javascripts/semantic-ui/toast.js +592 -0
  51. data/app/assets/javascripts/semantic-ui/transition.js +1106 -0
  52. data/app/assets/javascripts/semantic-ui/video.js +532 -0
  53. data/app/assets/javascripts/semantic-ui/visibility.js +1311 -0
  54. data/app/assets/javascripts/semantic-ui/visit.js +525 -0
  55. data/app/assets/stylesheets/semantic-ui.scss +5 -0
  56. data/app/assets/stylesheets/semantic-ui/collections/_all.scss +6 -0
  57. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +124 -0
  58. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +1158 -0
  59. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +2093 -0
  60. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +2193 -0
  61. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +606 -0
  62. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +1117 -0
  63. data/app/assets/stylesheets/semantic-ui/elements/_all.scss +16 -0
  64. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +4530 -0
  65. data/app/assets/stylesheets/semantic-ui/elements/_container.scss +145 -0
  66. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +259 -0
  67. data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +1036 -0
  68. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +762 -0
  69. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +6330 -0
  70. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +310 -0
  71. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +519 -0
  72. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +1395 -0
  73. data/app/assets/stylesheets/semantic-ui/elements/_list.scss +959 -0
  74. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +458 -0
  75. data/app/assets/stylesheets/semantic-ui/elements/_placeholder.scss +242 -0
  76. data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +152 -0
  77. data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +295 -0
  78. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +884 -0
  79. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +675 -0
  80. data/app/assets/stylesheets/semantic-ui/globals/_all.scss +3 -0
  81. data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +485 -0
  82. data/app/assets/stylesheets/semantic-ui/globals/_site.scss +206 -0
  83. data/app/assets/stylesheets/semantic-ui/globals/_variables.scss +4 -0
  84. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +247 -0
  85. data/app/assets/stylesheets/semantic-ui/modules/_all.scss +20 -0
  86. data/app/assets/stylesheets/semantic-ui/modules/_calendar.scss +165 -0
  87. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +718 -0
  88. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +464 -0
  89. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +1745 -0
  90. data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +165 -0
  91. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +646 -0
  92. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +148 -0
  93. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +789 -0
  94. data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +523 -0
  95. data/app/assets/stylesheets/semantic-ui/modules/_range.scss +192 -0
  96. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +263 -0
  97. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +445 -0
  98. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +154 -0
  99. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +626 -0
  100. data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +78 -0
  101. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +92 -0
  102. data/app/assets/stylesheets/semantic-ui/modules/_toast.scss +291 -0
  103. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +2059 -0
  104. data/app/assets/stylesheets/semantic-ui/modules/_video.scss +125 -0
  105. data/app/assets/stylesheets/semantic-ui/views/_ad.scss +275 -0
  106. data/app/assets/stylesheets/semantic-ui/views/_all.scss +6 -0
  107. data/app/assets/stylesheets/semantic-ui/views/_card.scss +1124 -0
  108. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +296 -0
  109. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +314 -0
  110. data/app/assets/stylesheets/semantic-ui/views/_item.scss +555 -0
  111. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +583 -0
  112. data/app/helpers/semantic_breadcrumbs_helper.rb +10 -0
  113. data/app/helpers/semantic_flash_helper.rb +22 -0
  114. data/app/helpers/semantic_icon_helper.rb +8 -0
  115. data/app/views/semantic/_breadcrumbs.html.erb +12 -0
  116. data/fomantic-ui-sass.gemspec +31 -0
  117. data/lib/fomantic-ui-sass.rb +62 -0
  118. data/lib/fomantic/ui/sass/breadcrumbs.rb +41 -0
  119. data/lib/fomantic/ui/sass/engine.rb +23 -0
  120. data/lib/fomantic/ui/sass/version.rb +8 -0
  121. data/spec/dummy/README.rdoc +28 -0
  122. data/spec/dummy/Rakefile +6 -0
  123. data/spec/dummy/app/assets/images/.keep +0 -0
  124. data/spec/dummy/app/assets/javascripts/application.js +13 -0
  125. data/spec/dummy/app/assets/stylesheets/application.css +13 -0
  126. data/spec/dummy/app/controllers/application_controller.rb +5 -0
  127. data/spec/dummy/app/controllers/concerns/.keep +0 -0
  128. data/spec/dummy/app/helpers/application_helper.rb +2 -0
  129. data/spec/dummy/app/mailers/.keep +0 -0
  130. data/spec/dummy/app/models/.keep +0 -0
  131. data/spec/dummy/app/models/concerns/.keep +0 -0
  132. data/spec/dummy/app/views/layouts/application.html.erb +14 -0
  133. data/spec/dummy/bin/bundle +3 -0
  134. data/spec/dummy/bin/rails +4 -0
  135. data/spec/dummy/bin/rake +4 -0
  136. data/spec/dummy/config.ru +4 -0
  137. data/spec/dummy/config/application.rb +28 -0
  138. data/spec/dummy/config/boot.rb +5 -0
  139. data/spec/dummy/config/environment.rb +5 -0
  140. data/spec/dummy/config/environments/development.rb +29 -0
  141. data/spec/dummy/config/environments/production.rb +80 -0
  142. data/spec/dummy/config/environments/test.rb +36 -0
  143. data/spec/dummy/config/initializers/backtrace_silencers.rb +7 -0
  144. data/spec/dummy/config/initializers/filter_parameter_logging.rb +4 -0
  145. data/spec/dummy/config/initializers/inflections.rb +16 -0
  146. data/spec/dummy/config/initializers/mime_types.rb +5 -0
  147. data/spec/dummy/config/initializers/secret_token.rb +12 -0
  148. data/spec/dummy/config/initializers/session_store.rb +3 -0
  149. data/spec/dummy/config/initializers/wrap_parameters.rb +14 -0
  150. data/spec/dummy/config/locales/en.yml +23 -0
  151. data/spec/dummy/config/routes.rb +2 -0
  152. data/spec/dummy/lib/assets/.keep +0 -0
  153. data/spec/dummy/log/.keep +0 -0
  154. data/spec/dummy/public/404.html +58 -0
  155. data/spec/dummy/public/422.html +58 -0
  156. data/spec/dummy/public/500.html +57 -0
  157. data/spec/dummy/public/favicon.ico +0 -0
  158. data/spec/helpers/semantic_breadcrumbs_helper_spec.rb +38 -0
  159. data/spec/helpers/semantic_flash_helper_spec.rb +36 -0
  160. data/spec/helpers/semantic_icon_helper_spec.rb +48 -0
  161. data/spec/spec_helper.rb +17 -0
  162. data/tasks/converter.rb +216 -0
  163. data/templates/project/manifest.rb +29 -0
  164. data/templates/project/styles.scss +1 -0
  165. metadata +390 -0
@@ -0,0 +1,2193 @@
1
+ /*
2
+ * # Semantic - Menu
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Copyright 2015 Contributor
7
+ * Released under the MIT license
8
+ * http://opensource.org/licenses/MIT
9
+ *
10
+ */
11
+
12
+
13
+ /*******************************
14
+ Standard
15
+ *******************************/
16
+
17
+
18
+ /*--------------
19
+ Menu
20
+ ---------------*/
21
+
22
+ .ui.menu {
23
+ display: -webkit-box;
24
+ display: -ms-flexbox;
25
+ display: flex;
26
+ margin: 1rem 0em;
27
+ font-family: $font-family;
28
+ background: #FFFFFF;
29
+ font-weight: normal;
30
+ border: 1px solid rgba(34, 36, 38, 0.15);
31
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
32
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
33
+ border-radius: 0.28571429rem;
34
+ min-height: 2.85714286em;
35
+ }
36
+ .ui.menu:after {
37
+ content: '';
38
+ display: block;
39
+ height: 0px;
40
+ clear: both;
41
+ visibility: hidden;
42
+ }
43
+ .ui.menu:first-child {
44
+ margin-top: 0rem;
45
+ }
46
+ .ui.menu:last-child {
47
+ margin-bottom: 0rem;
48
+ }
49
+
50
+ /*--------------
51
+ Sub-Menu
52
+ ---------------*/
53
+
54
+ .ui.menu .menu {
55
+ margin: 0em;
56
+ }
57
+ .ui.menu:not(.vertical) > .menu {
58
+ display: -webkit-box;
59
+ display: -ms-flexbox;
60
+ display: flex;
61
+ }
62
+
63
+ /*--------------
64
+ Item
65
+ ---------------*/
66
+
67
+ .ui.menu:not(.vertical) .item {
68
+ display: -webkit-box;
69
+ display: -ms-flexbox;
70
+ display: flex;
71
+ -webkit-box-align: center;
72
+ -ms-flex-align: center;
73
+ align-items: center;
74
+ }
75
+ .ui.menu .item {
76
+ position: relative;
77
+ vertical-align: middle;
78
+ line-height: 1;
79
+ text-decoration: none;
80
+ -webkit-tap-highlight-color: transparent;
81
+ -webkit-box-flex: 0;
82
+ -ms-flex: 0 0 auto;
83
+ flex: 0 0 auto;
84
+ -webkit-user-select: none;
85
+ -moz-user-select: none;
86
+ -ms-user-select: none;
87
+ user-select: none;
88
+ background: none;
89
+ padding: 0.92857143em 1.14285714em;
90
+ text-transform: none;
91
+ color: rgba(0, 0, 0, 0.87);
92
+ font-weight: normal;
93
+ -webkit-transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
94
+ transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
95
+ transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease;
96
+ transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
97
+ }
98
+ .ui.menu > .item:first-child {
99
+ border-radius: 0.28571429rem 0px 0px 0.28571429rem;
100
+ }
101
+
102
+ /* Border */
103
+ .ui.menu .item:before {
104
+ position: absolute;
105
+ content: '';
106
+ top: 0%;
107
+ right: 0px;
108
+ height: 100%;
109
+ width: 1px;
110
+ background: rgba(34, 36, 38, 0.1);
111
+ }
112
+
113
+ /*--------------
114
+ Text Content
115
+ ---------------*/
116
+
117
+ .ui.menu .text.item > *,
118
+ .ui.menu .item > a:not(.ui),
119
+ .ui.menu .item > p:only-child {
120
+ -webkit-user-select: text;
121
+ -moz-user-select: text;
122
+ -ms-user-select: text;
123
+ user-select: text;
124
+ line-height: 1.3;
125
+ }
126
+ .ui.menu .item > p:first-child {
127
+ margin-top: 0;
128
+ }
129
+ .ui.menu .item > p:last-child {
130
+ margin-bottom: 0;
131
+ }
132
+
133
+ /*--------------
134
+ Icons
135
+ ---------------*/
136
+
137
+ .ui.menu .item > i.icon {
138
+ opacity: 0.9;
139
+ float: none;
140
+ margin: 0em 0.35714286em 0em 0em;
141
+ }
142
+
143
+ /*--------------
144
+ Button
145
+ ---------------*/
146
+
147
+ .ui.menu:not(.vertical) .item > .button {
148
+ position: relative;
149
+ top: 0em;
150
+ margin: -0.5em 0em;
151
+ padding-bottom: 0.78571429em;
152
+ padding-top: 0.78571429em;
153
+ font-size: 1em;
154
+ }
155
+
156
+ /*----------------
157
+ Grid / Container
158
+ -----------------*/
159
+
160
+ .ui.menu > .grid,
161
+ .ui.menu > .container {
162
+ display: -webkit-box;
163
+ display: -ms-flexbox;
164
+ display: flex;
165
+ -webkit-box-align: inherit;
166
+ -ms-flex-align: inherit;
167
+ align-items: inherit;
168
+ -webkit-box-orient: inherit;
169
+ -webkit-box-direction: inherit;
170
+ -ms-flex-direction: inherit;
171
+ flex-direction: inherit;
172
+ }
173
+
174
+ /*--------------
175
+ Inputs
176
+ ---------------*/
177
+
178
+ .ui.menu .item > .input {
179
+ width: 100%;
180
+ }
181
+ .ui.menu:not(.vertical) .item > .input {
182
+ position: relative;
183
+ top: 0em;
184
+ margin: -0.5em 0em;
185
+ }
186
+ .ui.menu .item > .input input {
187
+ font-size: 1em;
188
+ padding-top: 0.57142857em;
189
+ padding-bottom: 0.57142857em;
190
+ }
191
+
192
+ /*--------------
193
+ Header
194
+ ---------------*/
195
+
196
+ .ui.menu .header.item,
197
+ .ui.vertical.menu .header.item {
198
+ margin: 0em;
199
+ background: '';
200
+ text-transform: normal;
201
+ font-weight: bold;
202
+ }
203
+ .ui.vertical.menu .item > .header:not(.ui) {
204
+ margin: 0em 0em 0.5em;
205
+ font-size: 1em;
206
+ font-weight: bold;
207
+ }
208
+
209
+ /*--------------
210
+ Dropdowns
211
+ ---------------*/
212
+
213
+
214
+ /* Dropdown Icon */
215
+ .ui.menu .item > i.dropdown.icon {
216
+ padding: 0em;
217
+ float: right;
218
+ margin: 0em 0em 0em 1em;
219
+ }
220
+
221
+ /* Menu */
222
+ .ui.menu .dropdown.item .menu {
223
+ min-width: calc(100% - 1px);
224
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
225
+ background: #FFFFFF;
226
+ margin: 0em 0px 0px;
227
+ -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
228
+ box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
229
+ -webkit-box-orient: vertical !important;
230
+ -webkit-box-direction: normal !important;
231
+ -ms-flex-direction: column !important;
232
+ flex-direction: column !important;
233
+ }
234
+
235
+ /* Menu Items */
236
+ .ui.menu .ui.dropdown .menu > .item {
237
+ margin: 0;
238
+ text-align: left;
239
+ font-size: 1em !important;
240
+ padding: 0.78571429em 1.14285714em !important;
241
+ background: transparent !important;
242
+ color: rgba(0, 0, 0, 0.87) !important;
243
+ text-transform: none !important;
244
+ font-weight: normal !important;
245
+ -webkit-box-shadow: none !important;
246
+ box-shadow: none !important;
247
+ -webkit-transition: none !important;
248
+ transition: none !important;
249
+ }
250
+ .ui.menu .ui.dropdown .menu > .item:hover {
251
+ background: rgba(0, 0, 0, 0.05) !important;
252
+ color: rgba(0, 0, 0, 0.95) !important;
253
+ }
254
+ .ui.menu .ui.dropdown .menu > .selected.item {
255
+ background: rgba(0, 0, 0, 0.05) !important;
256
+ color: rgba(0, 0, 0, 0.95) !important;
257
+ }
258
+ .ui.menu .ui.dropdown .menu > .active.item {
259
+ background: rgba(0, 0, 0, 0.03) !important;
260
+ font-weight: bold !important;
261
+ color: rgba(0, 0, 0, 0.95) !important;
262
+ }
263
+ .ui.menu .ui.dropdown.item .menu .item:not(.filtered) {
264
+ display: block;
265
+ }
266
+ .ui.menu .ui.dropdown .menu > .item .icon:not(.dropdown) {
267
+ display: inline-block;
268
+ font-size: 1em !important;
269
+ float: none;
270
+ margin: 0em 0.75em 0em 0em !important;
271
+ }
272
+
273
+ /* Secondary */
274
+ .ui.secondary.menu .dropdown.item > .menu,
275
+ .ui.text.menu .dropdown.item > .menu {
276
+ border-radius: 0.28571429rem;
277
+ margin-top: 0.35714286em;
278
+ }
279
+
280
+ /* Pointing */
281
+ .ui.menu .pointing.dropdown.item .menu {
282
+ margin-top: 0.75em;
283
+ }
284
+
285
+ /* Inverted */
286
+ .ui.inverted.menu .search.dropdown.item > .search,
287
+ .ui.inverted.menu .search.dropdown.item > .text {
288
+ color: rgba(255, 255, 255, 0.9);
289
+ }
290
+
291
+ /* Vertical */
292
+ .ui.vertical.menu .dropdown.item > .icon {
293
+ float: right;
294
+ content: "\f0da";
295
+ margin-left: 1em;
296
+ }
297
+ .ui.vertical.menu .dropdown.item .menu {
298
+ left: 100%;
299
+ min-width: 0;
300
+ margin: 0em 0em 0em 0em;
301
+ -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08);
302
+ box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08);
303
+ border-radius: 0em 0.28571429rem 0.28571429rem 0.28571429rem;
304
+ }
305
+ .ui.vertical.menu .dropdown.item.upward .menu {
306
+ bottom: 0;
307
+ }
308
+ .ui.vertical.menu .dropdown.item:not(.upward) .menu {
309
+ top: 0;
310
+ }
311
+ .ui.vertical.menu .active.dropdown.item {
312
+ border-top-right-radius: 0em;
313
+ border-bottom-right-radius: 0em;
314
+ }
315
+ .ui.vertical.menu .dropdown.active.item {
316
+ -webkit-box-shadow: none;
317
+ box-shadow: none;
318
+ }
319
+
320
+ /* Evenly Divided */
321
+ .ui.item.menu .dropdown .menu .item {
322
+ width: 100%;
323
+ }
324
+
325
+ /*--------------
326
+ Labels
327
+ ---------------*/
328
+
329
+ .ui.menu .item > .label {
330
+ background: #999999;
331
+ color: #FFFFFF;
332
+ margin-left: 1em;
333
+ padding: 0.3em 0.78571429em;
334
+ }
335
+ .ui.vertical.menu .item > .label {
336
+ background: #999999;
337
+ color: #FFFFFF;
338
+ margin-top: -0.15em;
339
+ margin-bottom: -0.15em;
340
+ padding: 0.3em 0.78571429em;
341
+ }
342
+ .ui.menu .item > .floating.label {
343
+ padding: 0.3em 0.78571429em;
344
+ }
345
+
346
+ /*--------------
347
+ Images
348
+ ---------------*/
349
+
350
+ .ui.menu .item > img:not(.ui) {
351
+ display: inline-block;
352
+ vertical-align: middle;
353
+ margin: -0.3em 0em;
354
+ width: 2.5em;
355
+ }
356
+ .ui.vertical.menu .item > img:not(.ui):only-child {
357
+ display: block;
358
+ max-width: 100%;
359
+ width: auto;
360
+ }
361
+
362
+
363
+ /*******************************
364
+ Coupling
365
+ *******************************/
366
+
367
+
368
+ /*--------------
369
+ List
370
+ ---------------*/
371
+
372
+
373
+ /* Menu divider shouldnt apply */
374
+ .ui.menu .list .item:before {
375
+ background: none !important;
376
+ }
377
+
378
+ /*--------------
379
+ Sidebar
380
+ ---------------*/
381
+
382
+
383
+ /* Show vertical dividers below last */
384
+ .ui.vertical.sidebar.menu > .item:first-child:before {
385
+ display: block !important;
386
+ }
387
+ .ui.vertical.sidebar.menu > .item::before {
388
+ top: auto;
389
+ bottom: 0px;
390
+ }
391
+
392
+ /*--------------
393
+ Container
394
+ ---------------*/
395
+
396
+ @media only screen and (max-width: 767px) {
397
+ .ui.menu > .ui.container {
398
+ width: 100% !important;
399
+ margin-left: 0em !important;
400
+ margin-right: 0em !important;
401
+ }
402
+ }
403
+ @media only screen and (min-width: 768px) {
404
+ .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .item:not(.right):not(.borderless):first-child {
405
+ border-left: 1px solid rgba(34, 36, 38, 0.1);
406
+ }
407
+ }
408
+
409
+
410
+ /*******************************
411
+ States
412
+ *******************************/
413
+
414
+
415
+ /*--------------
416
+ Hover
417
+ ---------------*/
418
+
419
+ .ui.link.menu .item:hover,
420
+ .ui.menu .dropdown.item:hover,
421
+ .ui.menu .link.item:hover,
422
+ .ui.menu a.item:hover {
423
+ cursor: pointer;
424
+ background: rgba(0, 0, 0, 0.03);
425
+ color: rgba(0, 0, 0, 0.95);
426
+ }
427
+
428
+ /*--------------
429
+ Pressed
430
+ ---------------*/
431
+
432
+ .ui.link.menu .item:active,
433
+ .ui.menu .link.item:active,
434
+ .ui.menu a.item:active {
435
+ background: rgba(0, 0, 0, 0.03);
436
+ color: rgba(0, 0, 0, 0.95);
437
+ }
438
+
439
+ /*--------------
440
+ Active
441
+ ---------------*/
442
+
443
+ .ui.menu .active.item {
444
+ background: rgba(0, 0, 0, 0.05);
445
+ color: rgba(0, 0, 0, 0.95);
446
+ font-weight: normal;
447
+ -webkit-box-shadow: none;
448
+ box-shadow: none;
449
+ }
450
+ .ui.menu .active.item > i.icon {
451
+ opacity: 1;
452
+ }
453
+
454
+ /*--------------
455
+ Active Hover
456
+ ---------------*/
457
+
458
+ .ui.menu .active.item:hover,
459
+ .ui.vertical.menu .active.item:hover {
460
+ background-color: rgba(0, 0, 0, 0.05);
461
+ color: rgba(0, 0, 0, 0.95);
462
+ }
463
+
464
+ /*--------------
465
+ Disabled
466
+ ---------------*/
467
+
468
+ .ui.menu .item.disabled,
469
+ .ui.menu .item.disabled:hover {
470
+ cursor: default !important;
471
+ background-color: transparent !important;
472
+ color: rgba(40, 40, 40, 0.3) !important;
473
+ }
474
+
475
+
476
+ /*******************************
477
+ Types
478
+ *******************************/
479
+
480
+
481
+ /*------------------
482
+ Floated Menu / Item
483
+ -------------------*/
484
+
485
+
486
+ /* Left Floated */
487
+ .ui.menu:not(.vertical) .left.item,
488
+ .ui.menu:not(.vertical) :not(.dropdown) > .left.menu {
489
+ display: -webkit-box;
490
+ display: -ms-flexbox;
491
+ display: flex;
492
+ margin-right: auto !important;
493
+ }
494
+
495
+ /* Right Floated */
496
+ .ui.menu:not(.vertical) .right.item,
497
+ .ui.menu:not(.vertical) .right.menu {
498
+ display: -webkit-box;
499
+ display: -ms-flexbox;
500
+ display: flex;
501
+ margin-left: auto !important;
502
+ }
503
+
504
+ /* Center */
505
+ .ui.menu:not(.vertical) .center.item,
506
+ .ui.menu:not(.vertical) .center.menu {
507
+ display: -webkit-box;
508
+ display: -ms-flexbox;
509
+ display: flex;
510
+ margin-left: auto !important;
511
+ margin-right: auto !important;
512
+ }
513
+
514
+ /* Swapped Borders */
515
+ .ui.menu .right.item::before,
516
+ .ui.menu .right.menu > .item::before {
517
+ right: auto;
518
+ left: 0;
519
+ }
520
+
521
+ /* Remove Outer Borders */
522
+ .ui.menu .center.item:last-child::before,
523
+ .ui.menu .center.menu > .item:last-child::before {
524
+ display: none;
525
+ }
526
+
527
+ /*--------------
528
+ Vertical
529
+ ---------------*/
530
+
531
+ .ui.vertical.menu {
532
+ display: block;
533
+ -webkit-box-orient: vertical;
534
+ -webkit-box-direction: normal;
535
+ -ms-flex-direction: column;
536
+ flex-direction: column;
537
+ background: #FFFFFF;
538
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
539
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
540
+ }
541
+
542
+ /*--- Item ---*/
543
+
544
+ .ui.vertical.menu .item {
545
+ display: block;
546
+ background: none;
547
+ border-top: none;
548
+ border-right: none;
549
+ }
550
+ .ui.vertical.menu > .item:first-child {
551
+ border-radius: 0.28571429rem 0.28571429rem 0px 0px;
552
+ }
553
+ .ui.vertical.menu > .item:last-child {
554
+ border-radius: 0px 0px 0.28571429rem 0.28571429rem;
555
+ }
556
+
557
+ /*--- Label ---*/
558
+
559
+ .ui.vertical.menu .item > .label {
560
+ float: right;
561
+ text-align: center;
562
+ }
563
+
564
+ /*--- Icon ---*/
565
+
566
+ .ui.vertical.menu .item > i.icon,
567
+ .ui.vertical.menu .item > i.icons {
568
+ width: 1.18em;
569
+ float: right;
570
+ margin: 0em 0em 0em 0.5em;
571
+ }
572
+ .ui.vertical.menu .item > .label + i.icon {
573
+ float: none;
574
+ margin: 0em 0.5em 0em 0em;
575
+ }
576
+
577
+ /*--- Border ---*/
578
+
579
+ .ui.vertical.menu .item:before {
580
+ position: absolute;
581
+ content: '';
582
+ top: 0%;
583
+ left: 0px;
584
+ width: 100%;
585
+ height: 1px;
586
+ background: rgba(34, 36, 38, 0.1);
587
+ }
588
+ .ui.vertical.menu .item:first-child:before {
589
+ display: none !important;
590
+ }
591
+
592
+ /*--- Sub Menu ---*/
593
+
594
+ .ui.vertical.menu .item > .menu {
595
+ margin: 0.5em -1.14285714em 0em;
596
+ }
597
+ .ui.vertical.menu .menu .item {
598
+ background: none;
599
+ padding: 0.5em 1.33333333em;
600
+ font-size: 0.85714286em;
601
+ color: rgba(0, 0, 0, 0.5);
602
+ }
603
+ .ui.vertical.menu .item .menu a.item:hover,
604
+ .ui.vertical.menu .item .menu .link.item:hover {
605
+ color: rgba(0, 0, 0, 0.85);
606
+ }
607
+ .ui.vertical.menu .menu .item:before {
608
+ display: none;
609
+ }
610
+
611
+ /* Vertical Active */
612
+ .ui.vertical.menu .active.item {
613
+ background: rgba(0, 0, 0, 0.05);
614
+ border-radius: 0em;
615
+ -webkit-box-shadow: none;
616
+ box-shadow: none;
617
+ }
618
+ .ui.vertical.menu > .active.item:first-child {
619
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
620
+ }
621
+ .ui.vertical.menu > .active.item:last-child {
622
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
623
+ }
624
+ .ui.vertical.menu > .active.item:only-child {
625
+ border-radius: 0.28571429rem;
626
+ }
627
+ .ui.vertical.menu .active.item .menu .active.item {
628
+ border-left: none;
629
+ }
630
+ .ui.vertical.menu .item .menu .active.item {
631
+ background-color: transparent;
632
+ font-weight: bold;
633
+ color: rgba(0, 0, 0, 0.95);
634
+ }
635
+
636
+ /*--------------
637
+ Tabular
638
+ ---------------*/
639
+
640
+ .ui.tabular.menu {
641
+ border-radius: 0em;
642
+ -webkit-box-shadow: none !important;
643
+ box-shadow: none !important;
644
+ border: none;
645
+ background: none transparent;
646
+ border-bottom: 1px solid #D4D4D5;
647
+ }
648
+ .ui.tabular.fluid.menu {
649
+ width: calc(100% + 2px) !important;
650
+ }
651
+ .ui.tabular.menu .item {
652
+ background: transparent;
653
+ border-bottom: none;
654
+ border-left: 1px solid transparent;
655
+ border-right: 1px solid transparent;
656
+ border-top: 2px solid transparent;
657
+ padding: 0.92857143em 1.42857143em;
658
+ color: rgba(0, 0, 0, 0.87);
659
+ }
660
+ .ui.tabular.menu .item:before {
661
+ display: none;
662
+ }
663
+
664
+ /* Hover */
665
+ .ui.tabular.menu .item:hover {
666
+ background-color: transparent;
667
+ color: rgba(0, 0, 0, 0.8);
668
+ }
669
+
670
+ /* Active */
671
+ .ui.tabular.menu .active.item {
672
+ background: none #FFFFFF;
673
+ color: rgba(0, 0, 0, 0.95);
674
+ border-top-width: 1px;
675
+ border-color: #D4D4D5;
676
+ font-weight: bold;
677
+ margin-bottom: -1px;
678
+ -webkit-box-shadow: none;
679
+ box-shadow: none;
680
+ border-radius: 0.28571429rem 0.28571429rem 0px 0px !important;
681
+ }
682
+
683
+ /* Coupling with segment for attachment */
684
+ .ui.tabular.menu + .attached:not(.top).segment,
685
+ .ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment {
686
+ border-top: none;
687
+ margin-left: 0px;
688
+ margin-top: 0px;
689
+ margin-right: 0px;
690
+ width: 100%;
691
+ }
692
+ .top.attached.segment + .ui.bottom.tabular.menu {
693
+ position: relative;
694
+ width: calc(100% + 2px);
695
+ left: -1px;
696
+ }
697
+
698
+ /* Bottom Vertical Tabular */
699
+ .ui.bottom.tabular.menu {
700
+ background: none transparent;
701
+ border-radius: 0em;
702
+ -webkit-box-shadow: none !important;
703
+ box-shadow: none !important;
704
+ border-bottom: none;
705
+ border-top: 1px solid #D4D4D5;
706
+ }
707
+ .ui.bottom.tabular.menu .item {
708
+ background: none;
709
+ border-left: 1px solid transparent;
710
+ border-right: 1px solid transparent;
711
+ border-bottom: 1px solid transparent;
712
+ border-top: none;
713
+ }
714
+ .ui.bottom.tabular.menu .active.item {
715
+ background: none #FFFFFF;
716
+ color: rgba(0, 0, 0, 0.95);
717
+ border-color: #D4D4D5;
718
+ margin: -1px 0px 0px 0px;
719
+ border-radius: 0px 0px 0.28571429rem 0.28571429rem !important;
720
+ }
721
+
722
+ /* Vertical Tabular (Left) */
723
+ .ui.vertical.tabular.menu {
724
+ background: none transparent;
725
+ border-radius: 0em;
726
+ -webkit-box-shadow: none !important;
727
+ box-shadow: none !important;
728
+ border-bottom: none;
729
+ border-right: 1px solid #D4D4D5;
730
+ }
731
+ .ui.vertical.tabular.menu .item {
732
+ background: none;
733
+ border-left: 1px solid transparent;
734
+ border-bottom: 1px solid transparent;
735
+ border-top: 1px solid transparent;
736
+ border-right: none;
737
+ }
738
+ .ui.vertical.tabular.menu .active.item {
739
+ background: none #FFFFFF;
740
+ color: rgba(0, 0, 0, 0.95);
741
+ border-color: #D4D4D5;
742
+ margin: 0px -1px 0px 0px;
743
+ border-radius: 0.28571429rem 0px 0px 0.28571429rem !important;
744
+ }
745
+
746
+ /* Vertical Right Tabular */
747
+ .ui.vertical.right.tabular.menu {
748
+ background: none transparent;
749
+ border-radius: 0em;
750
+ -webkit-box-shadow: none !important;
751
+ box-shadow: none !important;
752
+ border-bottom: none;
753
+ border-right: none;
754
+ border-left: 1px solid #D4D4D5;
755
+ }
756
+ .ui.vertical.right.tabular.menu .item {
757
+ background: none;
758
+ border-right: 1px solid transparent;
759
+ border-bottom: 1px solid transparent;
760
+ border-top: 1px solid transparent;
761
+ border-left: none;
762
+ }
763
+ .ui.vertical.right.tabular.menu .active.item {
764
+ background: none #FFFFFF;
765
+ color: rgba(0, 0, 0, 0.95);
766
+ border-color: #D4D4D5;
767
+ margin: 0px 0px 0px -1px;
768
+ border-radius: 0px 0.28571429rem 0.28571429rem 0px !important;
769
+ }
770
+
771
+ /* Dropdown */
772
+ .ui.tabular.menu .active.dropdown.item {
773
+ margin-bottom: 0px;
774
+ border-left: 1px solid transparent;
775
+ border-right: 1px solid transparent;
776
+ border-top: 2px solid transparent;
777
+ border-bottom: none;
778
+ }
779
+
780
+ /*--------------
781
+ Pagination
782
+ ---------------*/
783
+
784
+ .ui.pagination.menu {
785
+ margin: 0em;
786
+ display: -webkit-inline-box;
787
+ display: -ms-inline-flexbox;
788
+ display: inline-flex;
789
+ vertical-align: middle;
790
+ }
791
+ .ui.pagination.menu .item:last-child {
792
+ border-radius: 0em 0.28571429rem 0.28571429rem 0em;
793
+ }
794
+ .ui.compact.menu .item:last-child {
795
+ border-radius: 0em 0.28571429rem 0.28571429rem 0em;
796
+ }
797
+ .ui.pagination.menu .item:last-child:before {
798
+ display: none;
799
+ }
800
+ .ui.pagination.menu .item {
801
+ min-width: 3em;
802
+ text-align: center;
803
+ }
804
+ .ui.pagination.menu .icon.item i.icon {
805
+ vertical-align: top;
806
+ }
807
+
808
+ /* Active */
809
+ .ui.pagination.menu .active.item {
810
+ border-top: none;
811
+ padding-top: 0.92857143em;
812
+ background-color: rgba(0, 0, 0, 0.05);
813
+ color: rgba(0, 0, 0, 0.95);
814
+ -webkit-box-shadow: none;
815
+ box-shadow: none;
816
+ }
817
+
818
+ /*--------------
819
+ Secondary
820
+ ---------------*/
821
+
822
+ .ui.secondary.menu {
823
+ background: none;
824
+ margin-left: -0.35714286em;
825
+ margin-right: -0.35714286em;
826
+ border-radius: 0em;
827
+ border: none;
828
+ -webkit-box-shadow: none;
829
+ box-shadow: none;
830
+ }
831
+
832
+ /* Item */
833
+ .ui.secondary.menu .item {
834
+ -ms-flex-item-align: center;
835
+ align-self: center;
836
+ -webkit-box-shadow: none;
837
+ box-shadow: none;
838
+ border: none;
839
+ padding: 0.78571429em 0.92857143em;
840
+ margin: 0em 0.35714286em;
841
+ background: none;
842
+ -webkit-transition: color 0.1s ease;
843
+ transition: color 0.1s ease;
844
+ border-radius: 0.28571429rem;
845
+ }
846
+
847
+ /* No Divider */
848
+ .ui.secondary.menu .item:before {
849
+ display: none !important;
850
+ }
851
+
852
+ /* Header */
853
+ .ui.secondary.menu .header.item {
854
+ border-radius: 0em;
855
+ border-right: none;
856
+ background: none transparent;
857
+ }
858
+
859
+ /* Image */
860
+ .ui.secondary.menu .item > img:not(.ui) {
861
+ margin: 0em;
862
+ }
863
+
864
+ /* Hover */
865
+ .ui.secondary.menu .dropdown.item:hover,
866
+ .ui.secondary.menu .link.item:hover,
867
+ .ui.secondary.menu a.item:hover {
868
+ background: rgba(0, 0, 0, 0.05);
869
+ color: rgba(0, 0, 0, 0.95);
870
+ }
871
+
872
+ /* Active */
873
+ .ui.secondary.menu .active.item {
874
+ -webkit-box-shadow: none;
875
+ box-shadow: none;
876
+ background: rgba(0, 0, 0, 0.05);
877
+ color: rgba(0, 0, 0, 0.95);
878
+ border-radius: 0.28571429rem;
879
+ }
880
+
881
+ /* Active Hover */
882
+ .ui.secondary.menu .active.item:hover {
883
+ -webkit-box-shadow: none;
884
+ box-shadow: none;
885
+ background: rgba(0, 0, 0, 0.05);
886
+ color: rgba(0, 0, 0, 0.95);
887
+ }
888
+
889
+ /* Inverted */
890
+ .ui.secondary.inverted.menu .link.item,
891
+ .ui.secondary.inverted.menu a.item {
892
+ color: rgba(255, 255, 255, 0.7) !important;
893
+ }
894
+ .ui.secondary.inverted.menu .dropdown.item:hover,
895
+ .ui.secondary.inverted.menu .link.item:hover,
896
+ .ui.secondary.inverted.menu a.item:hover {
897
+ background: rgba(255, 255, 255, 0.08);
898
+ color: #ffffff !important;
899
+ }
900
+ .ui.secondary.inverted.menu .active.item {
901
+ background: rgba(255, 255, 255, 0.15);
902
+ color: #ffffff !important;
903
+ }
904
+
905
+ /* Fix item margins */
906
+ .ui.secondary.item.menu {
907
+ margin-left: 0em;
908
+ margin-right: 0em;
909
+ }
910
+ .ui.secondary.item.menu .item:last-child {
911
+ margin-right: 0em;
912
+ }
913
+ .ui.secondary.attached.menu {
914
+ -webkit-box-shadow: none;
915
+ box-shadow: none;
916
+ }
917
+
918
+ /* Sub Menu */
919
+ .ui.vertical.secondary.menu .item:not(.dropdown) > .menu {
920
+ margin: 0em -0.92857143em;
921
+ }
922
+ .ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item {
923
+ margin: 0em;
924
+ padding: 0.5em 1.33333333em;
925
+ }
926
+
927
+ /*---------------------
928
+ Secondary Vertical
929
+ -----------------------*/
930
+
931
+ .ui.secondary.vertical.menu > .item {
932
+ border: none;
933
+ margin: 0em 0em 0.35714286em;
934
+ border-radius: 0.28571429rem !important;
935
+ }
936
+ .ui.secondary.vertical.menu > .header.item {
937
+ border-radius: 0em;
938
+ }
939
+
940
+ /* Sub Menu */
941
+ .ui.vertical.secondary.menu .item > .menu .item {
942
+ background-color: transparent;
943
+ }
944
+
945
+ /* Inverted */
946
+ .ui.secondary.inverted.menu {
947
+ background-color: transparent;
948
+ }
949
+
950
+ /*---------------------
951
+ Secondary Pointing
952
+ -----------------------*/
953
+
954
+ .ui.secondary.pointing.menu {
955
+ margin-left: 0em;
956
+ margin-right: 0em;
957
+ border-bottom: 2px solid rgba(34, 36, 38, 0.15);
958
+ }
959
+ .ui.secondary.pointing.menu .item {
960
+ border-bottom-color: transparent;
961
+ border-bottom-style: solid;
962
+ border-radius: 0em;
963
+ -ms-flex-item-align: end;
964
+ align-self: flex-end;
965
+ margin: 0em 0em -2px;
966
+ padding: 0.85714286em 1.14285714em;
967
+ border-bottom-width: 2px;
968
+ -webkit-transition: color 0.1s ease;
969
+ transition: color 0.1s ease;
970
+ }
971
+ .ui.secondary.pointing.menu .ui.dropdown .menu .item {
972
+ border-bottom-width: 0;
973
+ }
974
+
975
+ /* Item Types */
976
+ .ui.secondary.pointing.menu .header.item {
977
+ color: rgba(0, 0, 0, 0.85) !important;
978
+ }
979
+ .ui.secondary.pointing.menu .text.item {
980
+ -webkit-box-shadow: none !important;
981
+ box-shadow: none !important;
982
+ }
983
+ .ui.secondary.pointing.menu .item:after {
984
+ display: none;
985
+ }
986
+
987
+ /* Hover */
988
+ .ui.secondary.pointing.menu .dropdown.item:hover,
989
+ .ui.secondary.pointing.menu .link.item:hover,
990
+ .ui.secondary.pointing.menu a.item:hover {
991
+ background-color: transparent;
992
+ color: rgba(0, 0, 0, 0.87);
993
+ }
994
+
995
+ /* Pressed */
996
+ .ui.secondary.pointing.menu .dropdown.item:active,
997
+ .ui.secondary.pointing.menu .link.item:active,
998
+ .ui.secondary.pointing.menu a.item:active {
999
+ background-color: transparent;
1000
+ border-color: rgba(34, 36, 38, 0.15);
1001
+ }
1002
+
1003
+ /* Active */
1004
+ .ui.secondary.pointing.menu .active.item {
1005
+ background-color: transparent;
1006
+ -webkit-box-shadow: none;
1007
+ box-shadow: none;
1008
+ border-color: #1B1C1D;
1009
+ font-weight: bold;
1010
+ color: rgba(0, 0, 0, 0.95);
1011
+ }
1012
+
1013
+ /* Active Hover */
1014
+ .ui.secondary.pointing.menu .active.item:hover {
1015
+ border-color: #1B1C1D;
1016
+ color: rgba(0, 0, 0, 0.95);
1017
+ }
1018
+
1019
+ /* Active Dropdown */
1020
+ .ui.secondary.pointing.menu .active.dropdown.item {
1021
+ border-color: transparent;
1022
+ }
1023
+
1024
+ /* Vertical Pointing */
1025
+ .ui.secondary.vertical.pointing.menu {
1026
+ border-bottom-width: 0px;
1027
+ border-right-width: 2px;
1028
+ border-right-style: solid;
1029
+ border-right-color: rgba(34, 36, 38, 0.15);
1030
+ }
1031
+ .ui.secondary.vertical.pointing.menu .item {
1032
+ border-bottom: none;
1033
+ border-right-style: solid;
1034
+ border-right-color: transparent;
1035
+ border-radius: 0em !important;
1036
+ margin: 0em -2px 0em 0em;
1037
+ border-right-width: 2px;
1038
+ }
1039
+
1040
+ /* Vertical Active */
1041
+ .ui.secondary.vertical.pointing.menu .active.item {
1042
+ border-color: #1B1C1D;
1043
+ }
1044
+
1045
+ /* Inverted */
1046
+ .ui.secondary.inverted.pointing.menu {
1047
+ border-color: rgba(255, 255, 255, 0.1);
1048
+ }
1049
+ .ui.secondary.inverted.pointing.menu {
1050
+ border-width: 2px;
1051
+ border-color: rgba(34, 36, 38, 0.15);
1052
+ }
1053
+ .ui.secondary.inverted.pointing.menu .item {
1054
+ color: rgba(255, 255, 255, 0.9);
1055
+ }
1056
+ .ui.secondary.inverted.pointing.menu .header.item {
1057
+ color: #FFFFFF !important;
1058
+ }
1059
+
1060
+ /* Hover */
1061
+ .ui.secondary.inverted.pointing.menu .link.item:hover,
1062
+ .ui.secondary.inverted.pointing.menu a.item:hover {
1063
+ color: rgba(0, 0, 0, 0.95);
1064
+ }
1065
+
1066
+ /* Active */
1067
+ .ui.secondary.inverted.pointing.menu .active.item {
1068
+ border-color: #FFFFFF;
1069
+ color: #ffffff;
1070
+ }
1071
+
1072
+ /*--------------
1073
+ Text Menu
1074
+ ---------------*/
1075
+
1076
+ .ui.text.menu {
1077
+ background: none transparent;
1078
+ border-radius: 0px;
1079
+ -webkit-box-shadow: none;
1080
+ box-shadow: none;
1081
+ border: none;
1082
+ margin: 1em -0.5em;
1083
+ }
1084
+ .ui.text.menu .item {
1085
+ border-radius: 0px;
1086
+ -webkit-box-shadow: none;
1087
+ box-shadow: none;
1088
+ -ms-flex-item-align: center;
1089
+ align-self: center;
1090
+ margin: 0em 0em;
1091
+ padding: 0.35714286em 0.5em;
1092
+ font-weight: normal;
1093
+ color: rgba(0, 0, 0, 0.6);
1094
+ -webkit-transition: opacity 0.1s ease;
1095
+ transition: opacity 0.1s ease;
1096
+ }
1097
+
1098
+ /* Border */
1099
+ .ui.text.menu .item:before,
1100
+ .ui.text.menu .menu .item:before {
1101
+ display: none !important;
1102
+ }
1103
+
1104
+ /* Header */
1105
+ .ui.text.menu .header.item {
1106
+ background-color: transparent;
1107
+ opacity: 1;
1108
+ color: rgba(0, 0, 0, 0.85);
1109
+ font-size: 0.92857143em;
1110
+ text-transform: uppercase;
1111
+ font-weight: bold;
1112
+ }
1113
+
1114
+ /* Image */
1115
+ .ui.text.menu .item > img:not(.ui) {
1116
+ margin: 0em;
1117
+ }
1118
+
1119
+ /*--- fluid text ---*/
1120
+
1121
+ .ui.text.item.menu .item {
1122
+ margin: 0em;
1123
+ }
1124
+
1125
+ /*--- vertical text ---*/
1126
+
1127
+ .ui.vertical.text.menu {
1128
+ margin: 1em 0em;
1129
+ }
1130
+ .ui.vertical.text.menu:first-child {
1131
+ margin-top: 0rem;
1132
+ }
1133
+ .ui.vertical.text.menu:last-child {
1134
+ margin-bottom: 0rem;
1135
+ }
1136
+ .ui.vertical.text.menu .item {
1137
+ margin: 0.57142857em 0em;
1138
+ padding-left: 0em;
1139
+ padding-right: 0em;
1140
+ }
1141
+ .ui.vertical.text.menu .item > i.icon {
1142
+ float: none;
1143
+ margin: 0em 0.35714286em 0em 0em;
1144
+ }
1145
+ .ui.vertical.text.menu .header.item {
1146
+ margin: 0.57142857em 0em 0.71428571em;
1147
+ }
1148
+
1149
+ /* Vertical Sub Menu */
1150
+ .ui.vertical.text.menu .item:not(.dropdown) > .menu {
1151
+ margin: 0em;
1152
+ }
1153
+ .ui.vertical.text.menu .item:not(.dropdown) > .menu > .item {
1154
+ margin: 0em;
1155
+ padding: 0.5em 0em;
1156
+ }
1157
+
1158
+ /*--- hover ---*/
1159
+
1160
+ .ui.text.menu .item:hover {
1161
+ opacity: 1;
1162
+ background-color: transparent;
1163
+ }
1164
+
1165
+ /*--- active ---*/
1166
+
1167
+ .ui.text.menu .active.item {
1168
+ background-color: transparent;
1169
+ border: none;
1170
+ -webkit-box-shadow: none;
1171
+ box-shadow: none;
1172
+ font-weight: normal;
1173
+ color: rgba(0, 0, 0, 0.95);
1174
+ }
1175
+
1176
+ /*--- active hover ---*/
1177
+
1178
+ .ui.text.menu .active.item:hover {
1179
+ background-color: transparent;
1180
+ }
1181
+
1182
+ /* Disable Bariations */
1183
+ .ui.text.pointing.menu .active.item:after {
1184
+ -webkit-box-shadow: none;
1185
+ box-shadow: none;
1186
+ }
1187
+ .ui.text.attached.menu {
1188
+ -webkit-box-shadow: none;
1189
+ box-shadow: none;
1190
+ }
1191
+
1192
+ /* Inverted */
1193
+ .ui.inverted.text.menu,
1194
+ .ui.inverted.text.menu .item,
1195
+ .ui.inverted.text.menu .item:hover,
1196
+ .ui.inverted.text.menu .active.item {
1197
+ background-color: transparent !important;
1198
+ }
1199
+
1200
+ /* Fluid */
1201
+ .ui.fluid.text.menu {
1202
+ margin-left: 0em;
1203
+ margin-right: 0em;
1204
+ }
1205
+
1206
+ /*--------------
1207
+ Icon Only
1208
+ ---------------*/
1209
+
1210
+
1211
+ /* Vertical Menu */
1212
+ .ui.vertical.icon.menu {
1213
+ display: inline-block;
1214
+ width: auto;
1215
+ }
1216
+
1217
+ /* Item */
1218
+ .ui.icon.menu .item {
1219
+ height: auto;
1220
+ text-align: center;
1221
+ color: #1B1C1D;
1222
+ }
1223
+
1224
+ /* Icon */
1225
+ .ui.icon.menu .item > .icon:not(.dropdown) {
1226
+ margin: 0;
1227
+ opacity: 1;
1228
+ }
1229
+
1230
+ /* Icon Gylph */
1231
+ .ui.icon.menu .icon:before {
1232
+ opacity: 1;
1233
+ }
1234
+
1235
+ /* (x) Item Icon */
1236
+ .ui.menu .icon.item > .icon {
1237
+ width: auto;
1238
+ margin: 0em auto;
1239
+ }
1240
+
1241
+ /* Vertical Icon */
1242
+ .ui.vertical.icon.menu .item > .icon:not(.dropdown) {
1243
+ display: block;
1244
+ opacity: 1;
1245
+ margin: 0em auto;
1246
+ float: none;
1247
+ }
1248
+
1249
+ /* Inverted */
1250
+ .ui.inverted.icon.menu .item {
1251
+ color: #FFFFFF;
1252
+ }
1253
+
1254
+ /*--------------
1255
+ Labeled Icon
1256
+ ---------------*/
1257
+
1258
+
1259
+ /* Menu */
1260
+ .ui.labeled.icon.menu {
1261
+ text-align: center;
1262
+ }
1263
+
1264
+ /* Item */
1265
+ .ui.labeled.icon.menu .item {
1266
+ min-width: 6em;
1267
+ -webkit-box-orient: vertical;
1268
+ -webkit-box-direction: normal;
1269
+ -ms-flex-direction: column;
1270
+ flex-direction: column;
1271
+ }
1272
+
1273
+ /* Icon */
1274
+ .ui.labeled.icon.menu > .item > .icon:not(.dropdown) {
1275
+ height: 1em;
1276
+ display: block;
1277
+ font-size: 1.71428571em !important;
1278
+ margin: 0em auto 0.5rem !important;
1279
+ }
1280
+
1281
+ /* Fluid */
1282
+ .ui.fluid.labeled.icon.menu > .item {
1283
+ min-width: 0em;
1284
+ }
1285
+
1286
+
1287
+ /*******************************
1288
+ Variations
1289
+ *******************************/
1290
+
1291
+
1292
+ /*--------------
1293
+ Stackable
1294
+ ---------------*/
1295
+
1296
+ @media only screen and (max-width: 767px) {
1297
+ .ui.stackable.menu {
1298
+ -webkit-box-orient: vertical;
1299
+ -webkit-box-direction: normal;
1300
+ -ms-flex-direction: column;
1301
+ flex-direction: column;
1302
+ }
1303
+ .ui.stackable.menu .item {
1304
+ width: 100% !important;
1305
+ }
1306
+ .ui.stackable.menu .item:before {
1307
+ position: absolute;
1308
+ content: '';
1309
+ top: auto;
1310
+ bottom: 0px;
1311
+ left: 0px;
1312
+ width: 100%;
1313
+ height: 1px;
1314
+ background: rgba(34, 36, 38, 0.1);
1315
+ }
1316
+ .ui.stackable.menu .left.menu,
1317
+ .ui.stackable.menu .left.item {
1318
+ margin-right: 0 !important;
1319
+ }
1320
+ .ui.stackable.menu .right.menu,
1321
+ .ui.stackable.menu .right.item {
1322
+ margin-left: 0 !important;
1323
+ }
1324
+ .ui.stackable.menu .center.menu,
1325
+ .ui.stackable.menu .center.item {
1326
+ margin-left: 0 !important;
1327
+ margin-right: 0 !important;
1328
+ }
1329
+ .ui.stackable.menu .right.menu,
1330
+ .ui.stackable.menu .center.menu,
1331
+ .ui.stackable.menu .left.menu {
1332
+ -webkit-box-orient: vertical;
1333
+ -webkit-box-direction: normal;
1334
+ -ms-flex-direction: column;
1335
+ flex-direction: column;
1336
+ }
1337
+ }
1338
+
1339
+ /*--------------
1340
+ Colors
1341
+ ---------------*/
1342
+
1343
+
1344
+ /*--- Standard Colors ---*/
1345
+
1346
+ .ui.menu .red.active.item,
1347
+ .ui.red.menu .active.item {
1348
+ border-color: #DB2828 !important;
1349
+ color: #DB2828 !important;
1350
+ }
1351
+ .ui.menu .orange.active.item,
1352
+ .ui.orange.menu .active.item {
1353
+ border-color: #F2711C !important;
1354
+ color: #F2711C !important;
1355
+ }
1356
+ .ui.menu .yellow.active.item,
1357
+ .ui.yellow.menu .active.item {
1358
+ border-color: #FBBD08 !important;
1359
+ color: #FBBD08 !important;
1360
+ }
1361
+ .ui.menu .olive.active.item,
1362
+ .ui.olive.menu .active.item {
1363
+ border-color: #B5CC18 !important;
1364
+ color: #B5CC18 !important;
1365
+ }
1366
+ .ui.menu .green.active.item,
1367
+ .ui.green.menu .active.item {
1368
+ border-color: #21BA45 !important;
1369
+ color: #21BA45 !important;
1370
+ }
1371
+ .ui.menu .teal.active.item,
1372
+ .ui.teal.menu .active.item {
1373
+ border-color: #00B5AD !important;
1374
+ color: #00B5AD !important;
1375
+ }
1376
+ .ui.menu .blue.active.item,
1377
+ .ui.blue.menu .active.item {
1378
+ border-color: #2185D0 !important;
1379
+ color: #2185D0 !important;
1380
+ }
1381
+ .ui.menu .violet.active.item,
1382
+ .ui.violet.menu .active.item {
1383
+ border-color: #6435C9 !important;
1384
+ color: #6435C9 !important;
1385
+ }
1386
+ .ui.menu .purple.active.item,
1387
+ .ui.purple.menu .active.item {
1388
+ border-color: #A333C8 !important;
1389
+ color: #A333C8 !important;
1390
+ }
1391
+ .ui.menu .pink.active.item,
1392
+ .ui.pink.menu .active.item {
1393
+ border-color: #E03997 !important;
1394
+ color: #E03997 !important;
1395
+ }
1396
+ .ui.menu .brown.active.item,
1397
+ .ui.brown.menu .active.item {
1398
+ border-color: #A5673F !important;
1399
+ color: #A5673F !important;
1400
+ }
1401
+ .ui.menu .grey.active.item,
1402
+ .ui.grey.menu .active.item {
1403
+ border-color: #767676 !important;
1404
+ color: #767676 !important;
1405
+ }
1406
+
1407
+ /*--------------
1408
+ Inverted
1409
+ ---------------*/
1410
+
1411
+ .ui.inverted.menu {
1412
+ border: 0px solid transparent;
1413
+ background: #1B1C1D;
1414
+ -webkit-box-shadow: none;
1415
+ box-shadow: none;
1416
+ }
1417
+
1418
+ /* Menu Item */
1419
+ .ui.inverted.menu .item,
1420
+ .ui.inverted.menu .item > a:not(.ui) {
1421
+ background: transparent;
1422
+ color: rgba(255, 255, 255, 0.9);
1423
+ }
1424
+ .ui.inverted.menu .item.menu {
1425
+ background: transparent;
1426
+ }
1427
+
1428
+ /*--- Border ---*/
1429
+
1430
+ .ui.inverted.menu .item:before {
1431
+ background: rgba(255, 255, 255, 0.08);
1432
+ }
1433
+ .ui.vertical.inverted.menu .item:before {
1434
+ background: rgba(255, 255, 255, 0.08);
1435
+ }
1436
+
1437
+ /* Sub Menu */
1438
+ .ui.vertical.inverted.menu .menu .item,
1439
+ .ui.vertical.inverted.menu .menu .item a:not(.ui) {
1440
+ color: rgba(255, 255, 255, 0.5);
1441
+ }
1442
+
1443
+ /* Header */
1444
+ .ui.inverted.menu .header.item {
1445
+ margin: 0em;
1446
+ background: transparent;
1447
+ -webkit-box-shadow: none;
1448
+ box-shadow: none;
1449
+ }
1450
+
1451
+ /* Disabled */
1452
+ .ui.inverted.menu .item.disabled,
1453
+ .ui.inverted.menu .item.disabled:hover {
1454
+ color: rgba(225, 225, 225, 0.3);
1455
+ }
1456
+
1457
+ /*--- Hover ---*/
1458
+
1459
+ .ui.link.inverted.menu .item:hover,
1460
+ .ui.inverted.menu .dropdown.item:hover,
1461
+ .ui.inverted.menu .link.item:hover,
1462
+ .ui.inverted.menu a.item:hover {
1463
+ background: rgba(255, 255, 255, 0.08);
1464
+ color: #ffffff;
1465
+ }
1466
+ .ui.vertical.inverted.menu .item .menu a.item:hover,
1467
+ .ui.vertical.inverted.menu .item .menu .link.item:hover {
1468
+ background: transparent;
1469
+ color: #ffffff;
1470
+ }
1471
+
1472
+ /*--- Pressed ---*/
1473
+
1474
+ .ui.inverted.menu a.item:active,
1475
+ .ui.inverted.menu .link.item:active {
1476
+ background: rgba(255, 255, 255, 0.08);
1477
+ color: #ffffff;
1478
+ }
1479
+
1480
+ /*--- Active ---*/
1481
+
1482
+ .ui.inverted.menu .active.item {
1483
+ background: rgba(255, 255, 255, 0.15);
1484
+ color: #ffffff !important;
1485
+ }
1486
+ .ui.inverted.vertical.menu .item .menu .active.item {
1487
+ background: transparent;
1488
+ color: #FFFFFF;
1489
+ }
1490
+ .ui.inverted.pointing.menu .active.item:after {
1491
+ background: #3D3E3F !important;
1492
+ margin: 0em !important;
1493
+ -webkit-box-shadow: none !important;
1494
+ box-shadow: none !important;
1495
+ border: none !important;
1496
+ }
1497
+
1498
+ /*--- Active Hover ---*/
1499
+
1500
+ .ui.inverted.menu .active.item:hover {
1501
+ background: rgba(255, 255, 255, 0.15);
1502
+ color: #FFFFFF !important;
1503
+ }
1504
+ .ui.inverted.pointing.menu .active.item:hover:after {
1505
+ background: #3D3E3F !important;
1506
+ }
1507
+
1508
+ /*--------------
1509
+ Floated
1510
+ ---------------*/
1511
+
1512
+ .ui.floated.menu {
1513
+ float: left;
1514
+ margin: 0rem 0.5rem 0rem 0rem;
1515
+ }
1516
+ .ui.floated.menu .item:last-child:before {
1517
+ display: none;
1518
+ }
1519
+ .ui.right.floated.menu {
1520
+ float: right;
1521
+ margin: 0rem 0rem 0rem 0.5rem;
1522
+ }
1523
+
1524
+ /*--------------
1525
+ Inverted
1526
+ ---------------*/
1527
+
1528
+
1529
+ /* Red */
1530
+ .ui.inverted.menu .red.active.item,
1531
+ .ui.inverted.red.menu {
1532
+ background-color: #DB2828;
1533
+ }
1534
+ .ui.inverted.red.menu .item:before {
1535
+ background-color: rgba(34, 36, 38, 0.1);
1536
+ }
1537
+ .ui.inverted.red.menu .active.item {
1538
+ background-color: rgba(0, 0, 0, 0.1) !important;
1539
+ }
1540
+
1541
+ /* Orange */
1542
+ .ui.inverted.menu .orange.active.item,
1543
+ .ui.inverted.orange.menu {
1544
+ background-color: #F2711C;
1545
+ }
1546
+ .ui.inverted.orange.menu .item:before {
1547
+ background-color: rgba(34, 36, 38, 0.1);
1548
+ }
1549
+ .ui.inverted.orange.menu .active.item {
1550
+ background-color: rgba(0, 0, 0, 0.1) !important;
1551
+ }
1552
+
1553
+ /* Yellow */
1554
+ .ui.inverted.menu .yellow.active.item,
1555
+ .ui.inverted.yellow.menu {
1556
+ background-color: #FBBD08;
1557
+ }
1558
+ .ui.inverted.yellow.menu .item:before {
1559
+ background-color: rgba(34, 36, 38, 0.1);
1560
+ }
1561
+ .ui.inverted.yellow.menu .active.item {
1562
+ background-color: rgba(0, 0, 0, 0.1) !important;
1563
+ }
1564
+
1565
+ /* Olive */
1566
+ .ui.inverted.menu .olive.active.item,
1567
+ .ui.inverted.olive.menu {
1568
+ background-color: #B5CC18;
1569
+ }
1570
+ .ui.inverted.olive.menu .item:before {
1571
+ background-color: rgba(34, 36, 38, 0.1);
1572
+ }
1573
+ .ui.inverted.olive.menu .active.item {
1574
+ background-color: rgba(0, 0, 0, 0.1) !important;
1575
+ }
1576
+
1577
+ /* Green */
1578
+ .ui.inverted.menu .green.active.item,
1579
+ .ui.inverted.green.menu {
1580
+ background-color: #21BA45;
1581
+ }
1582
+ .ui.inverted.green.menu .item:before {
1583
+ background-color: rgba(34, 36, 38, 0.1);
1584
+ }
1585
+ .ui.inverted.green.menu .active.item {
1586
+ background-color: rgba(0, 0, 0, 0.1) !important;
1587
+ }
1588
+
1589
+ /* Teal */
1590
+ .ui.inverted.menu .teal.active.item,
1591
+ .ui.inverted.teal.menu {
1592
+ background-color: #00B5AD;
1593
+ }
1594
+ .ui.inverted.teal.menu .item:before {
1595
+ background-color: rgba(34, 36, 38, 0.1);
1596
+ }
1597
+ .ui.inverted.teal.menu .active.item {
1598
+ background-color: rgba(0, 0, 0, 0.1) !important;
1599
+ }
1600
+
1601
+ /* Blue */
1602
+ .ui.inverted.menu .blue.active.item,
1603
+ .ui.inverted.blue.menu {
1604
+ background-color: #2185D0;
1605
+ }
1606
+ .ui.inverted.blue.menu .item:before {
1607
+ background-color: rgba(34, 36, 38, 0.1);
1608
+ }
1609
+ .ui.inverted.blue.menu .active.item {
1610
+ background-color: rgba(0, 0, 0, 0.1) !important;
1611
+ }
1612
+
1613
+ /* Violet */
1614
+ .ui.inverted.menu .violet.active.item,
1615
+ .ui.inverted.violet.menu {
1616
+ background-color: #6435C9;
1617
+ }
1618
+ .ui.inverted.violet.menu .item:before {
1619
+ background-color: rgba(34, 36, 38, 0.1);
1620
+ }
1621
+ .ui.inverted.violet.menu .active.item {
1622
+ background-color: rgba(0, 0, 0, 0.1) !important;
1623
+ }
1624
+
1625
+ /* Purple */
1626
+ .ui.inverted.menu .purple.active.item,
1627
+ .ui.inverted.purple.menu {
1628
+ background-color: #A333C8;
1629
+ }
1630
+ .ui.inverted.purple.menu .item:before {
1631
+ background-color: rgba(34, 36, 38, 0.1);
1632
+ }
1633
+ .ui.inverted.purple.menu .active.item {
1634
+ background-color: rgba(0, 0, 0, 0.1) !important;
1635
+ }
1636
+
1637
+ /* Pink */
1638
+ .ui.inverted.menu .pink.active.item,
1639
+ .ui.inverted.pink.menu {
1640
+ background-color: #E03997;
1641
+ }
1642
+ .ui.inverted.pink.menu .item:before {
1643
+ background-color: rgba(34, 36, 38, 0.1);
1644
+ }
1645
+ .ui.inverted.pink.menu .active.item {
1646
+ background-color: rgba(0, 0, 0, 0.1) !important;
1647
+ }
1648
+
1649
+ /* Brown */
1650
+ .ui.inverted.menu .brown.active.item,
1651
+ .ui.inverted.brown.menu {
1652
+ background-color: #A5673F;
1653
+ }
1654
+ .ui.inverted.brown.menu .item:before {
1655
+ background-color: rgba(34, 36, 38, 0.1);
1656
+ }
1657
+ .ui.inverted.brown.menu .active.item {
1658
+ background-color: rgba(0, 0, 0, 0.1) !important;
1659
+ }
1660
+
1661
+ /* Grey */
1662
+ .ui.inverted.menu .grey.active.item,
1663
+ .ui.inverted.grey.menu {
1664
+ background-color: #767676;
1665
+ }
1666
+ .ui.inverted.grey.menu .item:before {
1667
+ background-color: rgba(34, 36, 38, 0.1);
1668
+ }
1669
+ .ui.inverted.grey.menu .active.item {
1670
+ background-color: rgba(0, 0, 0, 0.1) !important;
1671
+ }
1672
+
1673
+ /*--------------
1674
+ Fitted
1675
+ ---------------*/
1676
+
1677
+ .ui.fitted.menu .item,
1678
+ .ui.fitted.menu .item .menu .item,
1679
+ .ui.menu .fitted.item {
1680
+ padding: 0em;
1681
+ }
1682
+ .ui.horizontally.fitted.menu .item,
1683
+ .ui.horizontally.fitted.menu .item .menu .item,
1684
+ .ui.menu .horizontally.fitted.item {
1685
+ padding-top: 0.92857143em;
1686
+ padding-bottom: 0.92857143em;
1687
+ }
1688
+ .ui.vertically.fitted.menu .item,
1689
+ .ui.vertically.fitted.menu .item .menu .item,
1690
+ .ui.menu .vertically.fitted.item {
1691
+ padding-left: 1.14285714em;
1692
+ padding-right: 1.14285714em;
1693
+ }
1694
+
1695
+ /*--------------
1696
+ Borderless
1697
+ ---------------*/
1698
+
1699
+ .ui.borderless.menu .item:before,
1700
+ .ui.borderless.menu .item .menu .item:before,
1701
+ .ui.menu .borderless.item:before {
1702
+ background: none !important;
1703
+ }
1704
+
1705
+ /*-------------------
1706
+ Compact
1707
+ --------------------*/
1708
+
1709
+ .ui.compact.menu {
1710
+ display: -webkit-inline-box;
1711
+ display: -ms-inline-flexbox;
1712
+ display: inline-flex;
1713
+ margin: 0em;
1714
+ vertical-align: middle;
1715
+ }
1716
+ .ui.compact.vertical.menu {
1717
+ display: inline-block;
1718
+ }
1719
+ .ui.compact.menu .item:last-child {
1720
+ border-radius: 0em 0.28571429rem 0.28571429rem 0em;
1721
+ }
1722
+ .ui.compact.menu .item:last-child:before {
1723
+ display: none;
1724
+ }
1725
+ .ui.compact.vertical.menu {
1726
+ width: auto !important;
1727
+ }
1728
+ .ui.compact.vertical.menu .item:last-child::before {
1729
+ display: block;
1730
+ }
1731
+
1732
+ /*-------------------
1733
+ Fluid
1734
+ --------------------*/
1735
+
1736
+ .ui.menu.fluid,
1737
+ .ui.vertical.menu.fluid {
1738
+ width: 100% !important;
1739
+ }
1740
+
1741
+ /*-------------------
1742
+ Evenly Sized
1743
+ --------------------*/
1744
+
1745
+ .ui.item.menu,
1746
+ .ui.item.menu .item {
1747
+ width: 100%;
1748
+ padding-left: 0em !important;
1749
+ padding-right: 0em !important;
1750
+ margin-left: 0em !important;
1751
+ margin-right: 0em !important;
1752
+ text-align: center;
1753
+ -webkit-box-pack: center;
1754
+ -ms-flex-pack: center;
1755
+ justify-content: center;
1756
+ }
1757
+ .ui.attached.item.menu {
1758
+ margin: 0em -1px !important;
1759
+ }
1760
+ .ui.item.menu .item:last-child:before {
1761
+ display: none;
1762
+ }
1763
+ .ui.menu.two.item .item {
1764
+ width: 50%;
1765
+ }
1766
+ .ui.menu.three.item .item {
1767
+ width: 33.333%;
1768
+ }
1769
+ .ui.menu.four.item .item {
1770
+ width: 25%;
1771
+ }
1772
+ .ui.menu.five.item .item {
1773
+ width: 20%;
1774
+ }
1775
+ .ui.menu.six.item .item {
1776
+ width: 16.666%;
1777
+ }
1778
+ .ui.menu.seven.item .item {
1779
+ width: 14.285%;
1780
+ }
1781
+ .ui.menu.eight.item .item {
1782
+ width: 12.500%;
1783
+ }
1784
+ .ui.menu.nine.item .item {
1785
+ width: 11.11%;
1786
+ }
1787
+ .ui.menu.ten.item .item {
1788
+ width: 10.0%;
1789
+ }
1790
+ .ui.menu.eleven.item .item {
1791
+ width: 9.09%;
1792
+ }
1793
+ .ui.menu.twelve.item .item {
1794
+ width: 8.333%;
1795
+ }
1796
+
1797
+ /*--------------
1798
+ Fixed
1799
+ ---------------*/
1800
+
1801
+ .ui.menu.fixed {
1802
+ position: fixed;
1803
+ z-index: 101;
1804
+ margin: 0em;
1805
+ width: 100%;
1806
+ }
1807
+ .ui.menu.fixed,
1808
+ .ui.menu.fixed .item:first-child,
1809
+ .ui.menu.fixed .item:last-child {
1810
+ border-radius: 0px !important;
1811
+ }
1812
+ .ui.fixed.menu,
1813
+ .ui[class*="top fixed"].menu {
1814
+ top: 0px;
1815
+ left: 0px;
1816
+ right: auto;
1817
+ bottom: auto;
1818
+ }
1819
+ .ui[class*="top fixed"].menu {
1820
+ border-top: none;
1821
+ border-left: none;
1822
+ border-right: none;
1823
+ }
1824
+ .ui[class*="right fixed"].menu {
1825
+ border-top: none;
1826
+ border-bottom: none;
1827
+ border-right: none;
1828
+ top: 0px;
1829
+ right: 0px;
1830
+ left: auto;
1831
+ bottom: auto;
1832
+ width: auto;
1833
+ height: 100%;
1834
+ }
1835
+ .ui[class*="bottom fixed"].menu {
1836
+ border-bottom: none;
1837
+ border-left: none;
1838
+ border-right: none;
1839
+ bottom: 0px;
1840
+ left: 0px;
1841
+ top: auto;
1842
+ right: auto;
1843
+ }
1844
+ .ui[class*="left fixed"].menu {
1845
+ border-top: none;
1846
+ border-bottom: none;
1847
+ border-left: none;
1848
+ top: 0px;
1849
+ left: 0px;
1850
+ right: auto;
1851
+ bottom: auto;
1852
+ width: auto;
1853
+ height: 100%;
1854
+ }
1855
+
1856
+ /* Coupling with Grid */
1857
+ .ui.fixed.menu + .ui.grid {
1858
+ padding-top: 2.75rem;
1859
+ }
1860
+
1861
+ /*-------------------
1862
+ Pointing
1863
+ --------------------*/
1864
+
1865
+ .ui.pointing.menu .item:after {
1866
+ visibility: hidden;
1867
+ position: absolute;
1868
+ content: '';
1869
+ top: 100%;
1870
+ left: 50%;
1871
+ -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
1872
+ transform: translateX(-50%) translateY(-50%) rotate(45deg);
1873
+ background: none;
1874
+ margin: 0.5px 0em 0em;
1875
+ width: 0.57142857em;
1876
+ height: 0.57142857em;
1877
+ border: none;
1878
+ border-bottom: 1px solid #D4D4D5;
1879
+ border-right: 1px solid #D4D4D5;
1880
+ z-index: 2;
1881
+ -webkit-transition: background 0.1s ease;
1882
+ transition: background 0.1s ease;
1883
+ }
1884
+ .ui.vertical.pointing.menu .item:after {
1885
+ position: absolute;
1886
+ top: 50%;
1887
+ right: 0%;
1888
+ bottom: auto;
1889
+ left: auto;
1890
+ -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
1891
+ transform: translateX(50%) translateY(-50%) rotate(45deg);
1892
+ margin: 0em -0.5px 0em 0em;
1893
+ border: none;
1894
+ border-top: 1px solid #D4D4D5;
1895
+ border-right: 1px solid #D4D4D5;
1896
+ }
1897
+ .ui.pointing.menu .ui.dropdown .menu .item:after,
1898
+ .ui.vertical.pointing.menu .ui.dropdown .menu .item:after {
1899
+ display: none;
1900
+ }
1901
+
1902
+ /* Active */
1903
+ .ui.pointing.menu .active.item:after {
1904
+ visibility: visible;
1905
+ }
1906
+ .ui.pointing.menu .active.dropdown.item:after {
1907
+ visibility: hidden;
1908
+ }
1909
+
1910
+ /* Don't double up pointers */
1911
+ .ui.pointing.menu .dropdown.active.item:after,
1912
+ .ui.pointing.menu .active.item .menu .active.item:after {
1913
+ display: none;
1914
+ }
1915
+
1916
+ /* Colors */
1917
+ .ui.pointing.menu .active.item:hover:after {
1918
+ background-color: #F2F2F2;
1919
+ }
1920
+ .ui.pointing.menu .active.item:after {
1921
+ background-color: #F2F2F2;
1922
+ }
1923
+ .ui.pointing.menu .active.item:hover:after {
1924
+ background-color: #F2F2F2;
1925
+ }
1926
+ .ui.vertical.pointing.menu .active.item:hover:after {
1927
+ background-color: #F2F2F2;
1928
+ }
1929
+ .ui.vertical.pointing.menu .active.item:after {
1930
+ background-color: #F2F2F2;
1931
+ }
1932
+ .ui.vertical.pointing.menu .menu .active.item:after {
1933
+ background-color: #FFFFFF;
1934
+ }
1935
+
1936
+ /* Inverted Colors */
1937
+ .ui.inverted.pointing.menu .red.active.item:after {
1938
+ background-color: #DB2828 !important;
1939
+ }
1940
+ .ui.inverted.pointing.menu .orange.active.item:after {
1941
+ background-color: #F2711C !important;
1942
+ }
1943
+ .ui.inverted.pointing.menu .yellow.active.item:after {
1944
+ background-color: #FBBD08 !important;
1945
+ }
1946
+ .ui.inverted.pointing.menu .olive.active.item:after {
1947
+ background-color: #B5CC18 !important;
1948
+ }
1949
+ .ui.inverted.pointing.menu .green.active.item:after {
1950
+ background-color: #21BA45 !important;
1951
+ }
1952
+ .ui.inverted.pointing.menu .teal.active.item:after {
1953
+ background-color: #00B5AD !important;
1954
+ }
1955
+ .ui.inverted.pointing.menu .blue.active.item:after {
1956
+ background-color: #2185D0 !important;
1957
+ }
1958
+ .ui.inverted.pointing.menu .violet.active.item:after {
1959
+ background-color: #6435C9 !important;
1960
+ }
1961
+ .ui.inverted.pointing.menu .purple.active.item:after {
1962
+ background-color: #A333C8 !important;
1963
+ }
1964
+ .ui.inverted.pointing.menu .pink.active.item:after {
1965
+ background-color: #E03997 !important;
1966
+ }
1967
+ .ui.inverted.pointing.menu .brown.active.item:after {
1968
+ background-color: #A5673F !important;
1969
+ }
1970
+ .ui.inverted.pointing.menu .grey.active.item:after {
1971
+ background-color: #767676 !important;
1972
+ }
1973
+
1974
+ /*--------------
1975
+ Attached
1976
+ ---------------*/
1977
+
1978
+
1979
+ /* Middle */
1980
+ .ui.attached.menu {
1981
+ top: 0px;
1982
+ bottom: 0px;
1983
+ border-radius: 0px;
1984
+ margin: 0em -1px;
1985
+ width: calc(100% + 2px);
1986
+ max-width: calc(100% + 2px);
1987
+ -webkit-box-shadow: none;
1988
+ box-shadow: none;
1989
+ }
1990
+ .ui.attached + .ui.attached.menu:not(.top) {
1991
+ border-top: none;
1992
+ }
1993
+
1994
+ /* Top */
1995
+ .ui[class*="top attached"].menu {
1996
+ bottom: 0px;
1997
+ margin-bottom: 0em;
1998
+ top: 0px;
1999
+ margin-top: 1rem;
2000
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
2001
+ }
2002
+ .ui.menu[class*="top attached"]:first-child {
2003
+ margin-top: 0em;
2004
+ }
2005
+
2006
+ /* Bottom */
2007
+ .ui[class*="bottom attached"].menu {
2008
+ bottom: 0px;
2009
+ margin-top: 0em;
2010
+ top: 0px;
2011
+ margin-bottom: 1rem;
2012
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
2013
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
2014
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
2015
+ }
2016
+ .ui[class*="bottom attached"].menu:last-child {
2017
+ margin-bottom: 0em;
2018
+ }
2019
+
2020
+ /* Attached Menu Item */
2021
+ .ui.top.attached.menu > .item:first-child {
2022
+ border-radius: 0.28571429rem 0em 0em 0em;
2023
+ }
2024
+ .ui.bottom.attached.menu > .item:first-child {
2025
+ border-radius: 0em 0em 0em 0.28571429rem;
2026
+ }
2027
+
2028
+ /* Tabular Attached */
2029
+ .ui.attached.menu:not(.tabular) {
2030
+ border: 1px solid #D4D4D5;
2031
+ }
2032
+ .ui.attached.inverted.menu {
2033
+ border: none;
2034
+ }
2035
+ .ui.attached.tabular.menu {
2036
+ margin-left: 0;
2037
+ margin-right: 0;
2038
+ width: 100%;
2039
+ }
2040
+
2041
+ /*--------------
2042
+ Sizes
2043
+ ---------------*/
2044
+
2045
+
2046
+ /* Mini */
2047
+ .ui.mini.menu {
2048
+ font-size: 0.78571429rem;
2049
+ }
2050
+ .ui.mini.vertical.menu {
2051
+ width: 9rem;
2052
+ }
2053
+ .ui.mini.menu .dropdown {
2054
+ font-size: 0.78571429rem;
2055
+ }
2056
+ .ui.mini.menu .dropdown .menu > .item {
2057
+ font-size: 0.78571429rem;
2058
+ }
2059
+
2060
+ /* Tiny */
2061
+ .ui.tiny.menu {
2062
+ font-size: 0.85714286rem;
2063
+ }
2064
+ .ui.tiny.vertical.menu {
2065
+ width: 11rem;
2066
+ }
2067
+ .ui.tiny.menu .dropdown {
2068
+ font-size: 0.85714286rem;
2069
+ }
2070
+ .ui.tiny.menu .dropdown .menu > .item {
2071
+ font-size: 0.85714286rem;
2072
+ }
2073
+
2074
+ /* Small */
2075
+ .ui.small.menu {
2076
+ font-size: 0.92857143rem;
2077
+ }
2078
+ .ui.small.vertical.menu {
2079
+ width: 13rem;
2080
+ }
2081
+ .ui.small.menu .dropdown {
2082
+ font-size: 0.92857143rem;
2083
+ }
2084
+ .ui.small.menu .dropdown .menu > .item {
2085
+ font-size: 0.92857143rem;
2086
+ }
2087
+
2088
+ /* Medium */
2089
+ .ui.menu {
2090
+ font-size: 1rem;
2091
+ }
2092
+ .ui.vertical.menu {
2093
+ width: 15rem;
2094
+ }
2095
+
2096
+ /* Large */
2097
+ .ui.large.menu {
2098
+ font-size: 1.07142857rem;
2099
+ }
2100
+ .ui.large.vertical.menu {
2101
+ width: 18rem;
2102
+ }
2103
+ .ui.large.menu .dropdown {
2104
+ font-size: 1.07142857rem;
2105
+ }
2106
+ .ui.large.menu .dropdown .menu > .item {
2107
+ font-size: 1.07142857rem;
2108
+ }
2109
+
2110
+ /* Huge */
2111
+ .ui.huge.menu {
2112
+ font-size: 1.21428571rem;
2113
+ }
2114
+ .ui.huge.vertical.menu {
2115
+ width: 22rem;
2116
+ }
2117
+ .ui.huge.menu .dropdown {
2118
+ font-size: 1.21428571rem;
2119
+ }
2120
+ .ui.huge.menu .dropdown .menu > .item {
2121
+ font-size: 1.21428571rem;
2122
+ }
2123
+
2124
+ /* Big */
2125
+ .ui.big.menu {
2126
+ font-size: 1.14285714rem;
2127
+ }
2128
+ .ui.big.vertical.menu {
2129
+ width: 20rem;
2130
+ }
2131
+ .ui.big.menu .dropdown {
2132
+ font-size: 1.14285714rem;
2133
+ }
2134
+ .ui.big.menu .dropdown .menu > .item {
2135
+ font-size: 1.14285714rem;
2136
+ }
2137
+
2138
+ /* Massive */
2139
+ .ui.massive.menu {
2140
+ font-size: 1.28571429rem;
2141
+ }
2142
+ .ui.massive.vertical.menu {
2143
+ width: 25rem;
2144
+ }
2145
+ .ui.massive.menu .dropdown {
2146
+ font-size: 1.28571429rem;
2147
+ }
2148
+ .ui.massive.menu .dropdown .menu > .item {
2149
+ font-size: 1.28571429rem;
2150
+ }
2151
+
2152
+
2153
+ /*******************************
2154
+ Theme Overrides
2155
+ *******************************/
2156
+
2157
+
2158
+ /*-------------------
2159
+ Inverted dropdowns
2160
+ --------------------*/
2161
+
2162
+ .ui.menu .ui.inverted.inverted.dropdown.item .menu {
2163
+ background: #1B1C1D;
2164
+ -webkit-box-shadow: none;
2165
+ box-shadow: none;
2166
+ }
2167
+ .ui.menu .ui.inverted.dropdown .menu > .item {
2168
+ color: rgba(255, 255, 255, 0.8) !important;
2169
+ }
2170
+ .ui.menu .ui.inverted.dropdown .menu > .active.item {
2171
+ background: transparent !important;
2172
+ color: rgba(255, 255, 255, 0.8) !important;
2173
+ }
2174
+ .ui.menu .ui.inverted.dropdown .menu > .item:hover {
2175
+ background: rgba(255, 255, 255, 0.08) !important;
2176
+ color: rgba(255, 255, 255, 0.8) !important;
2177
+ }
2178
+ .ui.menu .ui.inverted.dropdown .menu > .selected.item {
2179
+ background: rgba(255, 255, 255, 0.15) !important;
2180
+ color: rgba(255, 255, 255, 0.8) !important;
2181
+ }
2182
+
2183
+ /* Vertical */
2184
+ .ui.vertical.menu .inverted.dropdown.item .menu {
2185
+ -webkit-box-shadow: none;
2186
+ box-shadow: none;
2187
+ }
2188
+
2189
+
2190
+ /*******************************
2191
+ Site Overrides
2192
+ *******************************/
2193
+