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,884 @@
1
+ /*!
2
+ * # Semantic UI 2.6.4 - Segment
3
+ * http://github.com/semantic-org/semantic-ui/
4
+ *
5
+ *
6
+ * Released under the MIT license
7
+ * http://opensource.org/licenses/MIT
8
+ *
9
+ */
10
+
11
+
12
+ /*******************************
13
+ Segment
14
+ *******************************/
15
+
16
+ .ui.segment {
17
+ position: relative;
18
+ background: #FFFFFF;
19
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
20
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
21
+ margin: 1rem 0em;
22
+ padding: 1em 1em;
23
+ border-radius: 0.28571429rem;
24
+ border: 1px solid rgba(34, 36, 38, 0.15);
25
+ }
26
+ .ui.segment:first-child {
27
+ margin-top: 0em;
28
+ }
29
+ .ui.segment:last-child {
30
+ margin-bottom: 0em;
31
+ }
32
+
33
+ /* Vertical */
34
+ .ui.vertical.segment {
35
+ margin: 0em;
36
+ padding-left: 0em;
37
+ padding-right: 0em;
38
+ background: none transparent;
39
+ border-radius: 0px;
40
+ -webkit-box-shadow: none;
41
+ box-shadow: none;
42
+ border: none;
43
+ border-bottom: 1px solid rgba(34, 36, 38, 0.15);
44
+ }
45
+ .ui.vertical.segment:last-child {
46
+ border-bottom: none;
47
+ }
48
+
49
+ /*-------------------
50
+ Loose Coupling
51
+ --------------------*/
52
+
53
+
54
+ /* Header */
55
+ .ui.inverted.segment > .ui.header {
56
+ color: #FFFFFF;
57
+ }
58
+
59
+ /* Label */
60
+ .ui[class*="bottom attached"].segment > [class*="top attached"].label {
61
+ border-top-left-radius: 0em;
62
+ border-top-right-radius: 0em;
63
+ }
64
+ .ui[class*="top attached"].segment > [class*="bottom attached"].label {
65
+ border-bottom-left-radius: 0em;
66
+ border-bottom-right-radius: 0em;
67
+ }
68
+ .ui.attached.segment:not(.top):not(.bottom) > [class*="top attached"].label {
69
+ border-top-left-radius: 0em;
70
+ border-top-right-radius: 0em;
71
+ }
72
+ .ui.attached.segment:not(.top):not(.bottom) > [class*="bottom attached"].label {
73
+ border-bottom-left-radius: 0em;
74
+ border-bottom-right-radius: 0em;
75
+ }
76
+
77
+ /* Grid */
78
+ .ui.page.grid.segment,
79
+ .ui.grid > .row > .ui.segment.column,
80
+ .ui.grid > .ui.segment.column {
81
+ padding-top: 2em;
82
+ padding-bottom: 2em;
83
+ }
84
+ .ui.grid.segment {
85
+ margin: 1rem 0em;
86
+ border-radius: 0.28571429rem;
87
+ }
88
+
89
+ /* Table */
90
+ .ui.basic.table.segment {
91
+ background: #FFFFFF;
92
+ border: 1px solid rgba(34, 36, 38, 0.15);
93
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
94
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
95
+ }
96
+ .ui[class*="very basic"].table.segment {
97
+ padding: 1em 1em;
98
+ }
99
+
100
+ /* Tab */
101
+ .ui.segment.tab:last-child {
102
+ margin-bottom: 1rem;
103
+ }
104
+
105
+
106
+ /*******************************
107
+ Types
108
+ *******************************/
109
+
110
+
111
+ /*-------------------
112
+ Placeholder
113
+ --------------------*/
114
+
115
+ .ui.placeholder.segment {
116
+ display: -webkit-box;
117
+ display: -ms-flexbox;
118
+ display: flex;
119
+ -webkit-box-orient: vertical;
120
+ -webkit-box-direction: normal;
121
+ -ms-flex-direction: column;
122
+ flex-direction: column;
123
+ -webkit-box-pack: center;
124
+ -ms-flex-pack: center;
125
+ justify-content: center;
126
+ -webkit-box-align: stretch;
127
+ -ms-flex-align: stretch;
128
+ align-items: stretch;
129
+ max-width: initial;
130
+ -webkit-animation: none;
131
+ animation: none;
132
+ overflow: visible;
133
+ padding: 1em 1em;
134
+ min-height: 18rem;
135
+ background: #F9FAFB;
136
+ border-color: rgba(34, 36, 38, 0.15);
137
+ -webkit-box-shadow: 0px 2px 25px 0 rgba(34, 36, 38, 0.05) inset;
138
+ box-shadow: 0px 2px 25px 0 rgba(34, 36, 38, 0.05) inset;
139
+ }
140
+ .ui.placeholder.segment .button,
141
+ .ui.placeholder.segment textarea {
142
+ display: block;
143
+ }
144
+ .ui.placeholder.segment .field,
145
+ .ui.placeholder.segment textarea,
146
+ .ui.placeholder.segment > .ui.input,
147
+ .ui.placeholder.segment .button {
148
+ max-width: 15rem;
149
+ margin-left: auto;
150
+ margin-right: auto;
151
+ }
152
+ .ui.placeholder.segment .column .button,
153
+ .ui.placeholder.segment .column .field,
154
+ .ui.placeholder.segment .column textarea,
155
+ .ui.placeholder.segment .column > .ui.input {
156
+ max-width: 15rem;
157
+ margin-left: auto;
158
+ margin-right: auto;
159
+ }
160
+ .ui.placeholder.segment > .inline {
161
+ -ms-flex-item-align: center;
162
+ align-self: center;
163
+ }
164
+ .ui.placeholder.segment > .inline > .button {
165
+ display: inline-block;
166
+ width: auto;
167
+ margin: 0px 0.35714286rem 0px 0px;
168
+ }
169
+ .ui.placeholder.segment > .inline > .button:last-child {
170
+ margin-right: 0px;
171
+ }
172
+
173
+ /*-------------------
174
+ Piled
175
+ --------------------*/
176
+
177
+ .ui.piled.segments,
178
+ .ui.piled.segment {
179
+ margin: 3em 0em;
180
+ -webkit-box-shadow: '';
181
+ box-shadow: '';
182
+ z-index: auto;
183
+ }
184
+ .ui.piled.segment:first-child {
185
+ margin-top: 0em;
186
+ }
187
+ .ui.piled.segment:last-child {
188
+ margin-bottom: 0em;
189
+ }
190
+ .ui.piled.segments:after,
191
+ .ui.piled.segments:before,
192
+ .ui.piled.segment:after,
193
+ .ui.piled.segment:before {
194
+ background-color: #FFFFFF;
195
+ visibility: visible;
196
+ content: '';
197
+ display: block;
198
+ height: 100%;
199
+ left: 0px;
200
+ position: absolute;
201
+ width: 100%;
202
+ border: 1px solid rgba(34, 36, 38, 0.15);
203
+ -webkit-box-shadow: '';
204
+ box-shadow: '';
205
+ }
206
+ .ui.piled.segments:before,
207
+ .ui.piled.segment:before {
208
+ -webkit-transform: rotate(-1.2deg);
209
+ transform: rotate(-1.2deg);
210
+ top: 0;
211
+ z-index: -2;
212
+ }
213
+ .ui.piled.segments:after,
214
+ .ui.piled.segment:after {
215
+ -webkit-transform: rotate(1.2deg);
216
+ transform: rotate(1.2deg);
217
+ top: 0;
218
+ z-index: -1;
219
+ }
220
+
221
+ /* Piled Attached */
222
+ .ui[class*="top attached"].piled.segment {
223
+ margin-top: 3em;
224
+ margin-bottom: 0em;
225
+ }
226
+ .ui.piled.segment[class*="top attached"]:first-child {
227
+ margin-top: 0em;
228
+ }
229
+ .ui.piled.segment[class*="bottom attached"] {
230
+ margin-top: 0em;
231
+ margin-bottom: 3em;
232
+ }
233
+ .ui.piled.segment[class*="bottom attached"]:last-child {
234
+ margin-bottom: 0em;
235
+ }
236
+
237
+ /*-------------------
238
+ Stacked
239
+ --------------------*/
240
+
241
+ .ui.stacked.segment {
242
+ padding-bottom: 1.4em;
243
+ }
244
+ .ui.stacked.segments:before,
245
+ .ui.stacked.segments:after,
246
+ .ui.stacked.segment:before,
247
+ .ui.stacked.segment:after {
248
+ content: '';
249
+ position: absolute;
250
+ bottom: -3px;
251
+ left: 0%;
252
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
253
+ background: rgba(0, 0, 0, 0.03);
254
+ width: 100%;
255
+ height: 6px;
256
+ visibility: visible;
257
+ }
258
+ .ui.stacked.segments:before,
259
+ .ui.stacked.segment:before {
260
+ display: none;
261
+ }
262
+
263
+ /* Add additional page */
264
+ .ui.tall.stacked.segments:before,
265
+ .ui.tall.stacked.segment:before {
266
+ display: block;
267
+ bottom: 0px;
268
+ }
269
+
270
+ /* Inverted */
271
+ .ui.stacked.inverted.segments:before,
272
+ .ui.stacked.inverted.segments:after,
273
+ .ui.stacked.inverted.segment:before,
274
+ .ui.stacked.inverted.segment:after {
275
+ background-color: rgba(0, 0, 0, 0.03);
276
+ border-top: 1px solid rgba(34, 36, 38, 0.35);
277
+ }
278
+
279
+ /*-------------------
280
+ Padded
281
+ --------------------*/
282
+
283
+ .ui.padded.segment {
284
+ padding: 1.5em;
285
+ }
286
+ .ui[class*="very padded"].segment {
287
+ padding: 3em;
288
+ }
289
+
290
+ /* Padded vertical */
291
+ .ui.padded.segment.vertical.segment,
292
+ .ui[class*="very padded"].vertical.segment {
293
+ padding-left: 0px;
294
+ padding-right: 0px;
295
+ }
296
+
297
+ /*-------------------
298
+ Compact
299
+ --------------------*/
300
+
301
+ .ui.compact.segment {
302
+ display: table;
303
+ }
304
+
305
+ /* Compact Group */
306
+ .ui.compact.segments {
307
+ display: -webkit-inline-box;
308
+ display: -ms-inline-flexbox;
309
+ display: inline-flex;
310
+ }
311
+ .ui.compact.segments .segment,
312
+ .ui.segments .compact.segment {
313
+ display: block;
314
+ -webkit-box-flex: 0;
315
+ -ms-flex: 0 1 auto;
316
+ flex: 0 1 auto;
317
+ }
318
+
319
+ /*-------------------
320
+ Circular
321
+ --------------------*/
322
+
323
+ .ui.circular.segment {
324
+ display: table-cell;
325
+ padding: 2em;
326
+ text-align: center;
327
+ vertical-align: middle;
328
+ border-radius: 500em;
329
+ }
330
+
331
+ /*-------------------
332
+ Raised
333
+ --------------------*/
334
+
335
+ .ui.raised.raised.segments,
336
+ .ui.raised.raised.segment {
337
+ -webkit-box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
338
+ box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
339
+ }
340
+
341
+
342
+ /*******************************
343
+ Groups
344
+ *******************************/
345
+
346
+
347
+ /* Group */
348
+ .ui.segments {
349
+ -webkit-box-orient: vertical;
350
+ -webkit-box-direction: normal;
351
+ -ms-flex-direction: column;
352
+ flex-direction: column;
353
+ position: relative;
354
+ margin: 1rem 0em;
355
+ border: 1px solid rgba(34, 36, 38, 0.15);
356
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
357
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
358
+ border-radius: 0.28571429rem;
359
+ }
360
+ .ui.segments:first-child {
361
+ margin-top: 0em;
362
+ }
363
+ .ui.segments:last-child {
364
+ margin-bottom: 0em;
365
+ }
366
+
367
+ /* Nested Segment */
368
+ .ui.segments > .segment {
369
+ top: 0px;
370
+ bottom: 0px;
371
+ border-radius: 0px;
372
+ margin: 0em;
373
+ width: auto;
374
+ -webkit-box-shadow: none;
375
+ box-shadow: none;
376
+ border: none;
377
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
378
+ }
379
+ .ui.segments:not(.horizontal) > .segment:first-child {
380
+ top: 0px;
381
+ bottom: 0px;
382
+ border-top: none;
383
+ margin-top: 0em;
384
+ margin-bottom: 0em;
385
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
386
+ }
387
+
388
+ /* Bottom */
389
+ .ui.segments:not(.horizontal) > .segment:last-child {
390
+ top: 0px;
391
+ bottom: 0px;
392
+ margin-top: 0em;
393
+ margin-bottom: 0em;
394
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
395
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
396
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
397
+ }
398
+
399
+ /* Only */
400
+ .ui.segments:not(.horizontal) > .segment:only-child {
401
+ border-radius: 0.28571429rem;
402
+ }
403
+
404
+ /* Nested Group */
405
+ .ui.segments > .ui.segments {
406
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
407
+ margin: 1rem 1rem;
408
+ }
409
+ .ui.segments > .segments:first-child {
410
+ border-top: none;
411
+ }
412
+ .ui.segments > .segment + .segments:not(.horizontal) {
413
+ margin-top: 0em;
414
+ }
415
+
416
+ /* Horizontal Group */
417
+ .ui.horizontal.segments {
418
+ display: -webkit-box;
419
+ display: -ms-flexbox;
420
+ display: flex;
421
+ -webkit-box-orient: horizontal;
422
+ -webkit-box-direction: normal;
423
+ -ms-flex-direction: row;
424
+ flex-direction: row;
425
+ background-color: transparent;
426
+ padding: 0em;
427
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
428
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
429
+ margin: 1rem 0em;
430
+ border-radius: 0.28571429rem;
431
+ border: 1px solid rgba(34, 36, 38, 0.15);
432
+ }
433
+
434
+ /* Nested Horizontal Group */
435
+ .ui.segments > .horizontal.segments {
436
+ margin: 0em;
437
+ background-color: transparent;
438
+ border-radius: 0px;
439
+ border: none;
440
+ -webkit-box-shadow: none;
441
+ box-shadow: none;
442
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
443
+ }
444
+
445
+ /* Horizontal Segment */
446
+ .ui.horizontal.segments > .segment {
447
+ -webkit-box-flex: 1;
448
+ flex: 1 1 auto;
449
+ -ms-flex: 1 1 0px;
450
+
451
+ /* Solves #2550 MS Flex */
452
+ margin: 0em;
453
+ min-width: 0px;
454
+ background-color: transparent;
455
+ border-radius: 0px;
456
+ border: none;
457
+ -webkit-box-shadow: none;
458
+ box-shadow: none;
459
+ border-left: 1px solid rgba(34, 36, 38, 0.15);
460
+ }
461
+
462
+ /* Border Fixes */
463
+ .ui.segments > .horizontal.segments:first-child {
464
+ border-top: none;
465
+ }
466
+ .ui.horizontal.segments > .segment:first-child {
467
+ border-left: none;
468
+ }
469
+
470
+
471
+ /*******************************
472
+ States
473
+ *******************************/
474
+
475
+
476
+ /*--------------
477
+ Disabled
478
+ ---------------*/
479
+
480
+ .ui.disabled.segment {
481
+ opacity: 0.45;
482
+ color: rgba(40, 40, 40, 0.3);
483
+ }
484
+
485
+ /*--------------
486
+ Loading
487
+ ---------------*/
488
+
489
+ .ui.loading.segment {
490
+ position: relative;
491
+ cursor: default;
492
+ pointer-events: none;
493
+ text-shadow: none !important;
494
+ color: transparent !important;
495
+ -webkit-transition: all 0s linear;
496
+ transition: all 0s linear;
497
+ }
498
+ .ui.loading.segment:before {
499
+ position: absolute;
500
+ content: '';
501
+ top: 0%;
502
+ left: 0%;
503
+ background: rgba(255, 255, 255, 0.8);
504
+ width: 100%;
505
+ height: 100%;
506
+ border-radius: 0.28571429rem;
507
+ z-index: 100;
508
+ }
509
+ .ui.loading.segment:after {
510
+ position: absolute;
511
+ content: '';
512
+ top: 50%;
513
+ left: 50%;
514
+ margin: -1.5em 0em 0em -1.5em;
515
+ width: 3em;
516
+ height: 3em;
517
+ -webkit-animation: segment-spin 0.6s linear;
518
+ animation: segment-spin 0.6s linear;
519
+ -webkit-animation-iteration-count: infinite;
520
+ animation-iteration-count: infinite;
521
+ border-radius: 500rem;
522
+ border-color: #767676 rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
523
+ border-style: solid;
524
+ border-width: 0.2em;
525
+ -webkit-box-shadow: 0px 0px 0px 1px transparent;
526
+ box-shadow: 0px 0px 0px 1px transparent;
527
+ visibility: visible;
528
+ z-index: 101;
529
+ }
530
+ @-webkit-keyframes segment-spin {
531
+ from {
532
+ -webkit-transform: rotate(0deg);
533
+ transform: rotate(0deg);
534
+ }
535
+ to {
536
+ -webkit-transform: rotate(360deg);
537
+ transform: rotate(360deg);
538
+ }
539
+ }
540
+ @keyframes segment-spin {
541
+ from {
542
+ -webkit-transform: rotate(0deg);
543
+ transform: rotate(0deg);
544
+ }
545
+ to {
546
+ -webkit-transform: rotate(360deg);
547
+ transform: rotate(360deg);
548
+ }
549
+ }
550
+
551
+
552
+ /*******************************
553
+ Variations
554
+ *******************************/
555
+
556
+
557
+ /*-------------------
558
+ Basic
559
+ --------------------*/
560
+
561
+ .ui.basic.segment,
562
+ .ui.segments .ui.basic.segment,
563
+ .ui.basic.segments {
564
+ background: none transparent;
565
+ -webkit-box-shadow: none;
566
+ box-shadow: none;
567
+ border: none;
568
+ border-radius: 0px;
569
+ }
570
+
571
+ /*-------------------
572
+ Clearing
573
+ --------------------*/
574
+
575
+ .ui.clearing.segment:after {
576
+ content: ".";
577
+ display: block;
578
+ height: 0;
579
+ clear: both;
580
+ visibility: hidden;
581
+ }
582
+
583
+ /*-------------------
584
+ Colors
585
+ --------------------*/
586
+
587
+
588
+ /* Red */
589
+ .ui.red.segment:not(.inverted) {
590
+ border-top: 2px solid #DB2828 !important;
591
+ }
592
+ .ui.inverted.red.segment {
593
+ background-color: #DB2828 !important;
594
+ color: #FFFFFF !important;
595
+ }
596
+
597
+ /* Orange */
598
+ .ui.orange.segment:not(.inverted) {
599
+ border-top: 2px solid #F2711C !important;
600
+ }
601
+ .ui.inverted.orange.segment {
602
+ background-color: #F2711C !important;
603
+ color: #FFFFFF !important;
604
+ }
605
+
606
+ /* Yellow */
607
+ .ui.yellow.segment:not(.inverted) {
608
+ border-top: 2px solid #FBBD08 !important;
609
+ }
610
+ .ui.inverted.yellow.segment {
611
+ background-color: #FBBD08 !important;
612
+ color: #FFFFFF !important;
613
+ }
614
+
615
+ /* Olive */
616
+ .ui.olive.segment:not(.inverted) {
617
+ border-top: 2px solid #B5CC18 !important;
618
+ }
619
+ .ui.inverted.olive.segment {
620
+ background-color: #B5CC18 !important;
621
+ color: #FFFFFF !important;
622
+ }
623
+
624
+ /* Green */
625
+ .ui.green.segment:not(.inverted) {
626
+ border-top: 2px solid #21BA45 !important;
627
+ }
628
+ .ui.inverted.green.segment {
629
+ background-color: #21BA45 !important;
630
+ color: #FFFFFF !important;
631
+ }
632
+
633
+ /* Teal */
634
+ .ui.teal.segment:not(.inverted) {
635
+ border-top: 2px solid #00B5AD !important;
636
+ }
637
+ .ui.inverted.teal.segment {
638
+ background-color: #00B5AD !important;
639
+ color: #FFFFFF !important;
640
+ }
641
+
642
+ /* Blue */
643
+ .ui.blue.segment:not(.inverted) {
644
+ border-top: 2px solid #2185D0 !important;
645
+ }
646
+ .ui.inverted.blue.segment {
647
+ background-color: #2185D0 !important;
648
+ color: #FFFFFF !important;
649
+ }
650
+
651
+ /* Violet */
652
+ .ui.violet.segment:not(.inverted) {
653
+ border-top: 2px solid #6435C9 !important;
654
+ }
655
+ .ui.inverted.violet.segment {
656
+ background-color: #6435C9 !important;
657
+ color: #FFFFFF !important;
658
+ }
659
+
660
+ /* Purple */
661
+ .ui.purple.segment:not(.inverted) {
662
+ border-top: 2px solid #A333C8 !important;
663
+ }
664
+ .ui.inverted.purple.segment {
665
+ background-color: #A333C8 !important;
666
+ color: #FFFFFF !important;
667
+ }
668
+
669
+ /* Pink */
670
+ .ui.pink.segment:not(.inverted) {
671
+ border-top: 2px solid #E03997 !important;
672
+ }
673
+ .ui.inverted.pink.segment {
674
+ background-color: #E03997 !important;
675
+ color: #FFFFFF !important;
676
+ }
677
+
678
+ /* Brown */
679
+ .ui.brown.segment:not(.inverted) {
680
+ border-top: 2px solid #A5673F !important;
681
+ }
682
+ .ui.inverted.brown.segment {
683
+ background-color: #A5673F !important;
684
+ color: #FFFFFF !important;
685
+ }
686
+
687
+ /* Grey */
688
+ .ui.grey.segment:not(.inverted) {
689
+ border-top: 2px solid #767676 !important;
690
+ }
691
+ .ui.inverted.grey.segment {
692
+ background-color: #767676 !important;
693
+ color: #FFFFFF !important;
694
+ }
695
+
696
+ /* Black */
697
+ .ui.black.segment:not(.inverted) {
698
+ border-top: 2px solid #1B1C1D !important;
699
+ }
700
+ .ui.inverted.black.segment {
701
+ background-color: #1B1C1D !important;
702
+ color: #FFFFFF !important;
703
+ }
704
+
705
+ /*-------------------
706
+ Aligned
707
+ --------------------*/
708
+
709
+ .ui[class*="left aligned"].segment {
710
+ text-align: left;
711
+ }
712
+ .ui[class*="right aligned"].segment {
713
+ text-align: right;
714
+ }
715
+ .ui[class*="center aligned"].segment {
716
+ text-align: center;
717
+ }
718
+
719
+ /*-------------------
720
+ Floated
721
+ --------------------*/
722
+
723
+ .ui.floated.segment,
724
+ .ui[class*="left floated"].segment {
725
+ float: left;
726
+ margin-right: 1em;
727
+ }
728
+ .ui[class*="right floated"].segment {
729
+ float: right;
730
+ margin-left: 1em;
731
+ }
732
+
733
+ /*-------------------
734
+ Inverted
735
+ --------------------*/
736
+
737
+ .ui.inverted.segment {
738
+ border: none;
739
+ -webkit-box-shadow: none;
740
+ box-shadow: none;
741
+ }
742
+ .ui.inverted.segment,
743
+ .ui.primary.inverted.segment {
744
+ background: #1B1C1D;
745
+ color: rgba(255, 255, 255, 0.9);
746
+ }
747
+
748
+ /* Nested */
749
+ .ui.inverted.segment .segment {
750
+ color: rgba(0, 0, 0, 0.87);
751
+ }
752
+ .ui.inverted.segment .inverted.segment {
753
+ color: rgba(255, 255, 255, 0.9);
754
+ }
755
+
756
+ /* Attached */
757
+ .ui.inverted.attached.segment {
758
+ border-color: #555555;
759
+ }
760
+
761
+ /*-------------------
762
+ Emphasis
763
+ --------------------*/
764
+
765
+
766
+ /* Secondary */
767
+ .ui.secondary.segment {
768
+ background: #F3F4F5;
769
+ color: rgba(0, 0, 0, 0.6);
770
+ }
771
+ .ui.secondary.inverted.segment {
772
+ background: #4c4f52 -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.2)), to(rgba(255, 255, 255, 0.2)));
773
+ background: #4c4f52 -webkit-linear-gradient(rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
774
+ background: #4c4f52 linear-gradient(rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
775
+ color: rgba(255, 255, 255, 0.8);
776
+ }
777
+
778
+ /* Tertiary */
779
+ .ui.tertiary.segment {
780
+ background: #DCDDDE;
781
+ color: rgba(0, 0, 0, 0.6);
782
+ }
783
+ .ui.tertiary.inverted.segment {
784
+ background: #717579 -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.35)), to(rgba(255, 255, 255, 0.35)));
785
+ background: #717579 -webkit-linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.35) 100%);
786
+ background: #717579 linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.35) 100%);
787
+ color: rgba(255, 255, 255, 0.8);
788
+ }
789
+
790
+ /*-------------------
791
+ Attached
792
+ --------------------*/
793
+
794
+
795
+ /* Middle */
796
+ .ui.attached.segment {
797
+ top: 0px;
798
+ bottom: 0px;
799
+ border-radius: 0px;
800
+ margin: 0em -1px;
801
+ width: calc(100% + 2px);
802
+ max-width: calc(100% + 2px);
803
+ -webkit-box-shadow: none;
804
+ box-shadow: none;
805
+ border: 1px solid #D4D4D5;
806
+ }
807
+ .ui.attached:not(.message) + .ui.attached.segment:not(.top) {
808
+ border-top: none;
809
+ }
810
+
811
+ /* Top */
812
+ .ui[class*="top attached"].segment {
813
+ bottom: 0px;
814
+ margin-bottom: 0em;
815
+ top: 0px;
816
+ margin-top: 1rem;
817
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
818
+ }
819
+ .ui.segment[class*="top attached"]:first-child {
820
+ margin-top: 0em;
821
+ }
822
+
823
+ /* Bottom */
824
+ .ui.segment[class*="bottom attached"] {
825
+ bottom: 0px;
826
+ margin-top: 0em;
827
+ top: 0px;
828
+ margin-bottom: 1rem;
829
+ -webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
830
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
831
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
832
+ }
833
+ .ui.segment[class*="bottom attached"]:last-child {
834
+ margin-bottom: 1rem;
835
+ }
836
+
837
+ /*-------------------
838
+ Size
839
+ --------------------*/
840
+
841
+ .ui.mini.segments .segment,
842
+ .ui.mini.segment {
843
+ font-size: 0.78571429rem;
844
+ }
845
+ .ui.tiny.segments .segment,
846
+ .ui.tiny.segment {
847
+ font-size: 0.85714286rem;
848
+ }
849
+ .ui.small.segments .segment,
850
+ .ui.small.segment {
851
+ font-size: 0.92857143rem;
852
+ }
853
+ .ui.segments .segment,
854
+ .ui.segment {
855
+ font-size: 1rem;
856
+ }
857
+ .ui.large.segments .segment,
858
+ .ui.large.segment {
859
+ font-size: 1.14285714rem;
860
+ }
861
+ .ui.big.segments .segment,
862
+ .ui.big.segment {
863
+ font-size: 1.28571429rem;
864
+ }
865
+ .ui.huge.segments .segment,
866
+ .ui.huge.segment {
867
+ font-size: 1.42857143rem;
868
+ }
869
+ .ui.massive.segments .segment,
870
+ .ui.massive.segment {
871
+ font-size: 1.71428571rem;
872
+ }
873
+
874
+
875
+ /*******************************
876
+ Theme Overrides
877
+ *******************************/
878
+
879
+
880
+
881
+ /*******************************
882
+ Site Overrides
883
+ *******************************/
884
+