semantic-ui-sass 1.12.3.0 → 2.0.4.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (77) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +4 -0
  3. data/app/assets/javascripts/semantic-ui.js +1 -0
  4. data/app/assets/javascripts/semantic-ui/accordion.js +67 -53
  5. data/app/assets/javascripts/semantic-ui/api.js +395 -189
  6. data/app/assets/javascripts/semantic-ui/checkbox.js +322 -114
  7. data/app/assets/javascripts/semantic-ui/colorize.js +4 -2
  8. data/app/assets/javascripts/semantic-ui/dimmer.js +74 -50
  9. data/app/assets/javascripts/semantic-ui/dropdown.js +2046 -584
  10. data/app/assets/javascripts/semantic-ui/embed.js +662 -0
  11. data/app/assets/javascripts/semantic-ui/form.js +345 -163
  12. data/app/assets/javascripts/semantic-ui/modal.js +119 -90
  13. data/app/assets/javascripts/semantic-ui/nag.js +8 -9
  14. data/app/assets/javascripts/semantic-ui/popup.js +390 -228
  15. data/app/assets/javascripts/semantic-ui/progress.js +112 -103
  16. data/app/assets/javascripts/semantic-ui/rating.js +79 -55
  17. data/app/assets/javascripts/semantic-ui/search.js +305 -123
  18. data/app/assets/javascripts/semantic-ui/shape.js +94 -48
  19. data/app/assets/javascripts/semantic-ui/sidebar.js +84 -151
  20. data/app/assets/javascripts/semantic-ui/site.js +5 -5
  21. data/app/assets/javascripts/semantic-ui/state.js +4 -4
  22. data/app/assets/javascripts/semantic-ui/sticky.js +108 -35
  23. data/app/assets/javascripts/semantic-ui/tab.js +220 -125
  24. data/app/assets/javascripts/semantic-ui/transition.js +205 -171
  25. data/app/assets/javascripts/semantic-ui/visibility.js +220 -100
  26. data/app/assets/javascripts/semantic-ui/visit.js +6 -4
  27. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +17 -16
  28. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +223 -121
  29. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +462 -448
  30. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +949 -665
  31. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +134 -92
  32. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +270 -208
  33. data/app/assets/stylesheets/semantic-ui/elements/_all.scss +1 -0
  34. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +1357 -521
  35. data/app/assets/stylesheets/semantic-ui/elements/_container.scss +125 -0
  36. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +51 -31
  37. data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +3 -3
  38. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +270 -144
  39. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +241 -110
  40. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +30 -16
  41. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +88 -53
  42. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +432 -281
  43. data/app/assets/stylesheets/semantic-ui/elements/_list.scss +172 -128
  44. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +16 -14
  45. data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +15 -7
  46. data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +32 -13
  47. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +329 -212
  48. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +291 -99
  49. data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +2 -2
  50. data/app/assets/stylesheets/semantic-ui/globals/_site.scss +19 -18
  51. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +17 -18
  52. data/app/assets/stylesheets/semantic-ui/modules/_all.scss +1 -0
  53. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +265 -161
  54. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +29 -15
  55. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +441 -156
  56. data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +168 -0
  57. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +163 -85
  58. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +8 -8
  59. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +88 -23
  60. data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +185 -129
  61. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +75 -60
  62. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +99 -52
  63. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +11 -11
  64. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +16 -12
  65. data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +4 -4
  66. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +3 -3
  67. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +31 -39
  68. data/app/assets/stylesheets/semantic-ui/views/_ad.scss +3 -3
  69. data/app/assets/stylesheets/semantic-ui/views/_all.scss +1 -0
  70. data/app/assets/stylesheets/semantic-ui/views/_card.scss +204 -162
  71. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +6 -6
  72. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +51 -26
  73. data/app/assets/stylesheets/semantic-ui/views/_item.scss +62 -36
  74. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +265 -90
  75. data/lib/semantic/ui/sass/version.rb +2 -2
  76. data/semantic-ui-sass.gemspec +2 -2
  77. metadata +9 -6
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Loader
2
+ * # Semantic UI 2.0.4 - Loader
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
6
- * Copyright 2014 Contributors
6
+ * Copyright 2015 Contributors
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
@@ -54,7 +54,7 @@
54
54
  -webkit-animation-iteration-count: infinite;
55
55
  animation-iteration-count: infinite;
56
56
  border-radius: 500rem;
57
- border-color: #aaaaaa transparent transparent;
57
+ border-color: #767676 transparent transparent;
58
58
  border-style: solid;
59
59
  border-width: 0.2em;
60
60
  box-shadow: 0px 0px 0px 1px transparent;
@@ -120,7 +120,7 @@
120
120
 
121
121
  /* Black Dimmer */
122
122
  .ui.dimmer .ui.loader {
123
- color: #ffffff;
123
+ color: rgba(255, 255, 255, 0.9);
124
124
  }
125
125
  .ui.dimmer .ui.loader:before {
126
126
  border-color: rgba(255, 255, 255, 0.15);
@@ -131,13 +131,13 @@
131
131
 
132
132
  /* White Dimmer (Inverted) */
133
133
  .ui.inverted.dimmer .ui.loader {
134
- color: rgba(0, 0, 0, 0.8);
134
+ color: rgba(0, 0, 0, 0.87);
135
135
  }
136
136
  .ui.inverted.dimmer .ui.loader:before {
137
137
  border-color: rgba(0, 0, 0, 0.1);
138
138
  }
139
139
  .ui.inverted.dimmer .ui.loader:after {
140
- border-color: #aaaaaa transparent transparent;
140
+ border-color: #767676 transparent transparent;
141
141
  }
142
142
 
143
143
 
@@ -193,13 +193,13 @@
193
193
  .ui.mini.loader {
194
194
  width: 1.2857em;
195
195
  height: 1.2857em;
196
- font-size: 0.7857em;
196
+ font-size: 0.71428571em;
197
197
  }
198
198
  .ui.inverted.dimmer .ui.small.loader,
199
199
  .ui.small.loader {
200
200
  width: 1.7142em;
201
201
  height: 1.7142em;
202
- font-size: 0.9285em;
202
+ font-size: 0.92857143em;
203
203
  }
204
204
  .ui.inverted.dimmer .ui.loader,
205
205
  .ui.loader {
@@ -211,25 +211,25 @@
211
211
  .ui.loader.large {
212
212
  width: 4.5714em;
213
213
  height: 4.5714em;
214
- font-size: 1.1428em;
214
+ font-size: 1.14285714em;
215
215
  }
216
216
 
217
217
  /* Text Loader */
218
218
  .ui.mini.text.loader {
219
219
  min-width: 1.2857em;
220
- padding-top: 1.9857em;
220
+ padding-top: 1.99998571em;
221
221
  }
222
222
  .ui.small.text.loader {
223
223
  min-width: 1.7142em;
224
- padding-top: 2.4142em;
224
+ padding-top: 2.42848571em;
225
225
  }
226
226
  .ui.text.loader {
227
227
  min-width: 2.2585em;
228
- padding-top: 2.9585em;
228
+ padding-top: 2.97278571em;
229
229
  }
230
230
  .ui.large.text.loader {
231
231
  min-width: 4.5714em;
232
- padding-top: 5.2714em;
232
+ padding-top: 5.28568571em;
233
233
  }
234
234
 
235
235
  /*-------------------
@@ -237,7 +237,7 @@
237
237
  --------------------*/
238
238
 
239
239
  .ui.inverted.loader {
240
- color: #ffffff;
240
+ color: rgba(255, 255, 255, 0.9);
241
241
  }
242
242
  .ui.inverted.loader:before {
243
243
  border-color: rgba(255, 255, 255, 0.15);
@@ -269,6 +269,8 @@
269
269
  .ui.centered.inline.loader.active,
270
270
  .ui.centered.inline.loader.visible {
271
271
  display: block;
272
+ margin-left: auto;
273
+ margin-right: auto;
272
274
  }
273
275
 
274
276
 
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Rail
2
+ * # Semantic UI 2.0.4 - Rail
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
6
- * Copyright 2014 Contributors
6
+ * Copyright 2015 Contributors
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
@@ -19,7 +19,6 @@
19
19
  top: 0%;
20
20
  width: 300px;
21
21
  height: 100%;
22
- box-sizing: content-box;
23
22
  }
24
23
  .ui.left.rail {
25
24
  left: auto;
@@ -58,16 +57,19 @@
58
57
  }
59
58
 
60
59
  /*--------------
61
- Divided
60
+ Dividing
62
61
  ---------------*/
63
62
 
63
+ .ui.dividing.rail {
64
+ width: 302.5px;
65
+ }
64
66
  .ui.left.dividing.rail {
65
67
  padding: 0em 2.5rem 0em 0em;
66
68
  margin: 0em 2.5rem 0em 0em;
67
- border-right: 1px solid rgba(39, 41, 43, 0.15);
69
+ border-right: 1px solid rgba(34, 36, 38, 0.15);
68
70
  }
69
71
  .ui.right.dividing.rail {
70
- border-left: 1px solid rgba(39, 41, 43, 0.15);
72
+ border-left: 1px solid rgba(34, 36, 38, 0.15);
71
73
  padding: 0em 0em 0em 2.5rem;
72
74
  margin: 0em 0em 0em 2.5rem;
73
75
  }
@@ -76,6 +78,9 @@
76
78
  Distance
77
79
  ---------------*/
78
80
 
81
+ .ui.close.rail {
82
+ width: 301px;
83
+ }
79
84
  .ui.close.left.rail {
80
85
  padding: 0em 1em 0em 0em;
81
86
  margin: 0em 1em 0em 0em;
@@ -84,6 +89,9 @@
84
89
  padding: 0em 0em 0em 1em;
85
90
  margin: 0em 0em 0em 1em;
86
91
  }
92
+ .ui.very.close.rail {
93
+ width: 300.5px;
94
+ }
87
95
  .ui.very.close.left.rail {
88
96
  padding: 0em 0.5em 0em 0em;
89
97
  margin: 0em 0.5em 0em 0em;
@@ -108,7 +116,7 @@
108
116
  ---------------*/
109
117
 
110
118
  .ui.rail {
111
- font-size: 1em;
119
+ font-size: 1rem;
112
120
  }
113
121
 
114
122
 
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Reveal
2
+ * # Semantic UI 2.0.4 - Reveal
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
6
- * Copyright 2014 Contributors
6
+ * Copyright 2015 Contributors
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
@@ -24,8 +24,8 @@
24
24
  top: 0em !important;
25
25
  left: 0em !important;
26
26
  z-index: 3 !important;
27
- -webkit-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
28
- transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
27
+ -webkit-transition: all 0.5s ease 0.1s;
28
+ transition: all 0.5s ease 0.1s;
29
29
  }
30
30
  .ui.reveal > .hidden.content {
31
31
  position: relative !important;
@@ -33,6 +33,7 @@
33
33
  }
34
34
 
35
35
  /* Make sure hovered element is on top of other reveal */
36
+ .ui.active.reveal .visible.content,
36
37
  .ui.reveal:hover .visible.content {
37
38
  z-index: 4 !important;
38
39
  }
@@ -56,8 +57,8 @@
56
57
  display: block;
57
58
  float: left;
58
59
  margin: 0em;
59
- -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
60
- transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
60
+ -webkit-transition: -webkit-transform 0.5s ease 0.1s;
61
+ transition: transform 0.5s ease 0.1s;
61
62
  }
62
63
  .ui.slide.reveal > .visible.content {
63
64
  position: relative !important;
@@ -70,11 +71,13 @@
70
71
  -ms-transform: translateX(100%) !important;
71
72
  transform: translateX(100%) !important;
72
73
  }
74
+ .ui.slide.active.reveal > .visible.content,
73
75
  .ui.slide.reveal:hover > .visible.content {
74
76
  -webkit-transform: translateX(-100%) !important;
75
77
  -ms-transform: translateX(-100%) !important;
76
78
  transform: translateX(-100%) !important;
77
79
  }
80
+ .ui.slide.active.reveal > .hidden.content,
78
81
  .ui.slide.reveal:hover > .hidden.content {
79
82
  -webkit-transform: translateX(0%) !important;
80
83
  -ms-transform: translateX(0%) !important;
@@ -90,11 +93,13 @@
90
93
  -ms-transform: translateX(-100%) !important;
91
94
  transform: translateX(-100%) !important;
92
95
  }
96
+ .ui.slide.right.active.reveal > .visible.content,
93
97
  .ui.slide.right.reveal:hover > .visible.content {
94
98
  -webkit-transform: translateX(100%) !important;
95
99
  -ms-transform: translateX(100%) !important;
96
100
  transform: translateX(100%) !important;
97
101
  }
102
+ .ui.slide.right.active.reveal > .hidden.content,
98
103
  .ui.slide.right.reveal:hover > .hidden.content {
99
104
  -webkit-transform: translateX(0%) !important;
100
105
  -ms-transform: translateX(0%) !important;
@@ -105,11 +110,13 @@
105
110
  -ms-transform: translateY(100%) !important;
106
111
  transform: translateY(100%) !important;
107
112
  }
113
+ .ui.slide.up.active.reveal > .visible.content,
108
114
  .ui.slide.up.reveal:hover > .visible.content {
109
115
  -webkit-transform: translateY(-100%) !important;
110
116
  -ms-transform: translateY(-100%) !important;
111
117
  transform: translateY(-100%) !important;
112
118
  }
119
+ .ui.slide.up.active.reveal > .hidden.content,
113
120
  .ui.slide.up.reveal:hover > .hidden.content {
114
121
  -webkit-transform: translateY(0%) !important;
115
122
  -ms-transform: translateY(0%) !important;
@@ -120,11 +127,13 @@
120
127
  -ms-transform: translateY(-100%) !important;
121
128
  transform: translateY(-100%) !important;
122
129
  }
130
+ .ui.slide.down.active.reveal > .visible.content,
123
131
  .ui.slide.down.reveal:hover > .visible.content {
124
132
  -webkit-transform: translateY(100%) !important;
125
133
  -ms-transform: translateY(100%) !important;
126
134
  transform: translateY(100%) !important;
127
135
  }
136
+ .ui.slide.down.active.reveal > .hidden.content,
128
137
  .ui.slide.down.reveal:hover > .hidden.content {
129
138
  -webkit-transform: translateY(0%) !important;
130
139
  -ms-transform: translateY(0%) !important;
@@ -138,6 +147,7 @@
138
147
  .ui.fade.reveal > .visible.content {
139
148
  opacity: 1;
140
149
  }
150
+ .ui.fade.active.reveal > .visible.content,
141
151
  .ui.fade.reveal:hover > .visible.content {
142
152
  opacity: 0;
143
153
  }
@@ -155,8 +165,8 @@
155
165
  display: block;
156
166
  float: left;
157
167
  margin: 0em;
158
- -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
159
- transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s;
168
+ -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s;
169
+ transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s;
160
170
  }
161
171
  .ui.move.reveal > .visible.content {
162
172
  position: relative !important;
@@ -166,21 +176,25 @@
166
176
  left: 0% !important;
167
177
  width: 100% !important;
168
178
  }
179
+ .ui.move.active.reveal > .visible.content,
169
180
  .ui.move.reveal:hover > .visible.content {
170
181
  -webkit-transform: translateX(-100%) !important;
171
182
  -ms-transform: translateX(-100%) !important;
172
183
  transform: translateX(-100%) !important;
173
184
  }
185
+ .ui.move.right.active.reveal > .visible.content,
174
186
  .ui.move.right.reveal:hover > .visible.content {
175
187
  -webkit-transform: translateX(100%) !important;
176
188
  -ms-transform: translateX(100%) !important;
177
189
  transform: translateX(100%) !important;
178
190
  }
191
+ .ui.move.up.active.reveal > .visible.content,
179
192
  .ui.move.up.reveal:hover > .visible.content {
180
193
  -webkit-transform: translateY(-100%) !important;
181
194
  -ms-transform: translateY(-100%) !important;
182
195
  transform: translateY(-100%) !important;
183
196
  }
197
+ .ui.move.down.active.reveal > .visible.content,
184
198
  .ui.move.down.reveal:hover > .visible.content {
185
199
  -webkit-transform: translateY(100%) !important;
186
200
  -ms-transform: translateY(100%) !important;
@@ -192,8 +206,8 @@
192
206
  ---------------*/
193
207
 
194
208
  .ui.rotate.reveal > .visible.content {
195
- -webkit-transition-duration: 0.8s;
196
- transition-duration: 0.8s;
209
+ -webkit-transition-duration: 0.5s;
210
+ transition-duration: 0.5s;
197
211
  -webkit-transform: rotate(0deg);
198
212
  -ms-transform: rotate(0deg);
199
213
  transform: rotate(0deg);
@@ -204,7 +218,9 @@
204
218
  -ms-transform-origin: bottom right;
205
219
  transform-origin: bottom right;
206
220
  }
221
+ .ui.rotate.active.reveal > .visible.conten,
207
222
  .ui.rotate.reveal:hover > .visible.content,
223
+ .ui.rotate.right.active.reveal > .visible.content,
208
224
  .ui.rotate.right.reveal:hover > .visible.content {
209
225
  -webkit-transform: rotate(110deg);
210
226
  -ms-transform: rotate(110deg);
@@ -215,6 +231,7 @@
215
231
  -ms-transform-origin: bottom left;
216
232
  transform-origin: bottom left;
217
233
  }
234
+ .ui.rotate.left.active.reveal > .visible.content,
218
235
  .ui.rotate.left.reveal:hover > .visible.content {
219
236
  -webkit-transform: rotate(-110deg);
220
237
  -ms-transform: rotate(-110deg);
@@ -233,6 +250,7 @@
233
250
  -webkit-transition: none !important;
234
251
  transition: none !important;
235
252
  }
253
+ .ui.disabled.active.reveal > .visible.content,
236
254
  .ui.disabled.reveal:hover > .visible.content {
237
255
  position: static !important;
238
256
  display: block !important;
@@ -245,6 +263,7 @@
245
263
  -ms-transform: none !important;
246
264
  transform: none !important;
247
265
  }
266
+ .ui.disabled.active.reveal > .hidden.content,
248
267
  .ui.disabled.reveal:hover > .hidden.content {
249
268
  display: none !important;
250
269
  }
@@ -256,11 +275,11 @@
256
275
 
257
276
 
258
277
  /*--------------
259
- Masked
278
+ Visible
260
279
  ---------------*/
261
280
 
262
- .ui.masked.reveal {
263
- overflow: hidden;
281
+ .ui.visible.reveal {
282
+ overflow: visible;
264
283
  }
265
284
 
266
285
  /*--------------
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Segment
2
+ * # Semantic UI 2.0.4 - Segment
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
6
- * Copyright 2014 Contributors
6
+ * Copyright 2015 Contributors
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
@@ -16,12 +16,12 @@
16
16
 
17
17
  .ui.segment {
18
18
  position: relative;
19
- background-color: #ffffff;
20
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15), 0px 1px 2px 0 rgba(0, 0, 0, 0.05);
19
+ background: #ffffff;
20
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
21
21
  margin: 1rem 0em;
22
22
  padding: 1em 1em;
23
- border-radius: 0.2857rem;
24
- border: none;
23
+ border-radius: 0.28571429rem;
24
+ border: 1px solid rgba(34, 36, 38, 0.15);
25
25
  }
26
26
  .ui.segment:first-child {
27
27
  margin-top: 0em;
@@ -29,37 +29,20 @@
29
29
  .ui.segment:last-child {
30
30
  margin-bottom: 0em;
31
31
  }
32
- .ui.segment:after {
33
- content: '';
34
- display: block;
35
- height: 0px;
36
- clear: both;
37
- visibility: hidden;
38
- }
39
32
 
40
33
  /* Vertical */
41
- .ui[class*="vertical segment"] {
34
+ .ui.vertical.segment {
42
35
  margin: 0em;
43
36
  padding-left: 0em;
44
37
  padding-right: 0em;
45
- background-color: transparent;
38
+ background: none transparent;
46
39
  border-radius: 0px;
47
- border: none;
48
- box-shadow: 0px -1px 0px rgba(39, 41, 43, 0.15) inset;
49
- }
50
- .ui[class*="vertical segment"]:last-child {
51
40
  box-shadow: none;
52
- }
53
-
54
- /* Horizontal */
55
- .ui[class*="horizontal segment"] {
56
- margin: 0em;
57
- padding-top: 0em;
58
- padding-bottom: 0em;
59
- background-color: transparent;
60
- border-radius: 0px;
61
41
  border: none;
62
- box-shadow: 1px 0px 0px rgba(39, 41, 43, 0.15);
42
+ border-bottom: 1px solid rgba(34, 36, 38, 0.15);
43
+ }
44
+ .ui.vertical.segment:last-child {
45
+ border-bottom: none;
63
46
  }
64
47
 
65
48
  /*-------------------
@@ -97,15 +80,15 @@
97
80
  padding-bottom: 2em;
98
81
  }
99
82
  .ui.grid.segment {
100
- margin: 1rem 0rem;
101
- border-radius: 0.2857rem;
83
+ margin: 1rem 0em;
84
+ border-radius: 0.28571429rem;
102
85
  }
103
86
 
104
87
  /* Table */
105
88
  .ui.basic.table.segment {
106
89
  background: #ffffff;
107
- border: none;
108
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15), 0px 1px 2px 0 rgba(0, 0, 0, 0.05);
90
+ border: 1px solid rgba(34, 36, 38, 0.15);
91
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
109
92
  }
110
93
  .ui[class*="very basic"].table.segment {
111
94
  padding: 1em 1em;
@@ -121,9 +104,10 @@
121
104
  Piled
122
105
  --------------------*/
123
106
 
107
+ .ui.piled.segments,
124
108
  .ui.piled.segment {
125
109
  margin: 3em 0em;
126
- box-shadow: 0px 0px 1px 1px rgba(39, 41, 43, 0.15);
110
+ box-shadow: '';
127
111
  z-index: auto;
128
112
  }
129
113
  .ui.piled.segment:first-child {
@@ -132,6 +116,8 @@
132
116
  .ui.piled.segment:last-child {
133
117
  margin-bottom: 0em;
134
118
  }
119
+ .ui.piled.segments:after,
120
+ .ui.piled.segments:before,
135
121
  .ui.piled.segment:after,
136
122
  .ui.piled.segment:before {
137
123
  background-color: #ffffff;
@@ -142,15 +128,10 @@
142
128
  left: 0px;
143
129
  position: absolute;
144
130
  width: 100%;
145
- box-shadow: 0px 0px 1px 1px rgba(39, 41, 43, 0.15);
146
- }
147
- .ui.piled.segment:after {
148
- -webkit-transform: rotate(1.2deg);
149
- -ms-transform: rotate(1.2deg);
150
- transform: rotate(1.2deg);
151
- top: 0;
152
- z-index: -1;
131
+ border: 1px solid rgba(34, 36, 38, 0.15);
132
+ box-shadow: '';
153
133
  }
134
+ .ui.piled.segments:before,
154
135
  .ui.piled.segment:before {
155
136
  -webkit-transform: rotate(-1.2deg);
156
137
  -ms-transform: rotate(-1.2deg);
@@ -158,6 +139,14 @@
158
139
  top: 0;
159
140
  z-index: -2;
160
141
  }
142
+ .ui.piled.segments:after,
143
+ .ui.piled.segment:after {
144
+ -webkit-transform: rotate(1.2deg);
145
+ -ms-transform: rotate(1.2deg);
146
+ transform: rotate(1.2deg);
147
+ top: 0;
148
+ z-index: -1;
149
+ }
161
150
 
162
151
  /* Piled Attached */
163
152
  .ui[class*="top attached"].piled.segment {
@@ -182,33 +171,50 @@
182
171
  .ui.stacked.segment {
183
172
  padding-bottom: 1.4em;
184
173
  }
185
- .ui.stacked.segment:after,
186
- .ui.stacked.segment:before {
174
+ .ui.stacked.segments:before,
175
+ .ui.stacked.segments:after,
176
+ .ui.stacked.segment:before,
177
+ .ui.stacked.segment:after {
187
178
  content: '';
188
179
  position: absolute;
189
180
  bottom: -3px;
190
181
  left: 0%;
191
- border-top: 1px solid rgba(39, 41, 43, 0.15);
192
- background-color: rgba(0, 0, 0, 0.03);
182
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
183
+ background: rgba(0, 0, 0, 0.03);
193
184
  width: 100%;
194
185
  height: 6px;
195
186
  visibility: visible;
196
187
  }
188
+ .ui.stacked.segments:before,
197
189
  .ui.stacked.segment:before {
198
190
  display: none;
199
191
  }
200
192
 
201
193
  /* Add additional page */
194
+ .ui.tall.stacked.segments:before,
202
195
  .ui.tall.stacked.segment:before {
203
196
  display: block;
204
197
  bottom: 0px;
205
198
  }
206
199
 
207
200
  /* Inverted */
208
- .ui.stacked.inverted.segment:after,
209
- .ui.stacked.inverted.segment:before {
201
+ .ui.stacked.inverted.segments:before,
202
+ .ui.stacked.inverted.segments:after,
203
+ .ui.stacked.inverted.segment:before,
204
+ .ui.stacked.inverted.segment:after {
210
205
  background-color: rgba(0, 0, 0, 0.03);
211
- border-top: 1px solid rgba(39, 41, 43, 0.3);
206
+ border-top: 1px solid rgba(34, 36, 38, 0.35);
207
+ }
208
+
209
+ /*-------------------
210
+ Padded
211
+ --------------------*/
212
+
213
+ .ui.padded.segment {
214
+ padding: 1.5em;
215
+ }
216
+ .ui[class*="very padded"].segment {
217
+ padding: 3em;
212
218
  }
213
219
 
214
220
  /*-------------------
@@ -219,6 +225,22 @@
219
225
  display: table;
220
226
  }
221
227
 
228
+ /* Compact Group */
229
+ .ui.compact.segments {
230
+ display: -webkit-inline-box;
231
+ display: -webkit-inline-flex;
232
+ display: -ms-inline-flexbox;
233
+ display: inline-flex;
234
+ }
235
+ .ui.compact.segments .segment,
236
+ .ui.segments .compact.segment {
237
+ display: block;
238
+ -webkit-box-flex: 0;
239
+ -webkit-flex: 0 1 auto;
240
+ -ms-flex: 0 1 auto;
241
+ flex: 0 1 auto;
242
+ }
243
+
222
244
  /*-------------------
223
245
  Circular
224
246
  --------------------*/
@@ -235,8 +257,128 @@
235
257
  Raised
236
258
  --------------------*/
237
259
 
260
+ .ui.raised.segments,
238
261
  .ui.raised.segment {
239
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15), 0px 1px 4px 0px rgba(0, 0, 0, 0.15);
262
+ box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.08);
263
+ }
264
+
265
+
266
+ /*******************************
267
+ Groups
268
+ *******************************/
269
+
270
+
271
+ /* Group */
272
+ .ui.segments {
273
+ -webkit-box-orient: vertical;
274
+ -webkit-box-direction: normal;
275
+ -webkit-flex-direction: column;
276
+ -ms-flex-direction: column;
277
+ flex-direction: column;
278
+ position: relative;
279
+ margin: 1rem 0em;
280
+ border: 1px solid rgba(34, 36, 38, 0.15);
281
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
282
+ border-radius: 0.28571429rem;
283
+ }
284
+ .ui.segments:first-child {
285
+ margin-top: 0em;
286
+ }
287
+ .ui.segments:last-child {
288
+ margin-bottom: 0em;
289
+ }
290
+
291
+ /* Nested Segment */
292
+ .ui.segments > .segment {
293
+ top: 0px;
294
+ bottom: 0px;
295
+ border-radius: 0px;
296
+ margin: 0em;
297
+ width: auto;
298
+ box-shadow: none;
299
+ border: none;
300
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
301
+ }
302
+ .ui.segments:not(.horizontal) > .segment:first-child {
303
+ border-top: none;
304
+ margin-top: 0em;
305
+ bottom: 0px;
306
+ margin-bottom: 0em;
307
+ top: 0px;
308
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
309
+ }
310
+
311
+ /* Bottom */
312
+ .ui.segments:not(.horizontal) > .segment:last-child {
313
+ top: 0px;
314
+ bottom: 0px;
315
+ margin-top: 0em;
316
+ margin-bottom: 0em;
317
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
318
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
319
+ }
320
+
321
+ /* Nested Group */
322
+ .ui.segments > .ui.segments {
323
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
324
+ margin: 1rem 1rem;
325
+ }
326
+ .ui.segments > .segments:first-child {
327
+ border-top: none;
328
+ }
329
+ .ui.segments > .segment + .segments:not(.horizontal) {
330
+ margin-top: 0em;
331
+ }
332
+
333
+ /* Horizontal Group */
334
+ .ui.horizontal.segments {
335
+ display: -webkit-box;
336
+ display: -webkit-flex;
337
+ display: -ms-flexbox;
338
+ display: flex;
339
+ -webkit-box-orient: horizontal;
340
+ -webkit-box-direction: normal;
341
+ -webkit-flex-direction: row;
342
+ -ms-flex-direction: row;
343
+ flex-direction: row;
344
+ background-color: transparent;
345
+ border-radius: 0px;
346
+ padding: 0em;
347
+ background-color: #ffffff;
348
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
349
+ margin: 1rem 0em;
350
+ border-radius: 0.28571429rem;
351
+ border: 1px solid rgba(34, 36, 38, 0.15);
352
+ }
353
+
354
+ /* Nested Horizontal Group */
355
+ .ui.segments > .horizontal.segments {
356
+ margin: 0em;
357
+ background-color: transparent;
358
+ border-radius: 0px;
359
+ border: none;
360
+ box-shadow: none;
361
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
362
+ }
363
+
364
+ /* Horizontal Segment */
365
+ .ui.horizontal.segments > .segment {
366
+ -webkit-box-flex: 1;
367
+ -webkit-flex: 1 1 auto;
368
+ flex: 1 1 auto;
369
+ -ms-flex: 1 1 0px;
370
+
371
+ /* Solves #2550 MS Flex */
372
+ margin: 0em;
373
+ min-width: 0px;
374
+ background-color: transparent;
375
+ border-radius: 0px;
376
+ border: none;
377
+ box-shadow: none;
378
+ border-left: 1px solid rgba(34, 36, 38, 0.15);
379
+ }
380
+ .ui.horizontal.segments > .segment:first-child {
381
+ border-left: none;
240
382
  }
241
383
 
242
384
 
@@ -250,7 +392,7 @@
250
392
  ---------------*/
251
393
 
252
394
  .ui.disabled.segment {
253
- opacity: 0.3;
395
+ opacity: 0.45;
254
396
  color: rgba(40, 40, 40, 0.3);
255
397
  }
256
398
 
@@ -275,7 +417,7 @@
275
417
  background: rgba(255, 255, 255, 0.8);
276
418
  width: 100%;
277
419
  height: 100%;
278
- border-radius: 0.2857rem;
420
+ border-radius: 0.28571429rem;
279
421
  z-index: 100;
280
422
  }
281
423
  .ui.loading.segment:after {
@@ -291,7 +433,7 @@
291
433
  -webkit-animation-iteration-count: infinite;
292
434
  animation-iteration-count: infinite;
293
435
  border-radius: 500rem;
294
- border-color: #aaaaaa rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
436
+ border-color: #767676 rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
295
437
  border-style: solid;
296
438
  border-width: 0.2em;
297
439
  box-shadow: 0px 0px 0px 1px transparent;
@@ -330,127 +472,143 @@
330
472
  --------------------*/
331
473
 
332
474
  .ui.basic.segment {
333
- position: relative;
334
- background-color: transparent;
475
+ background: none transparent;
335
476
  box-shadow: none;
477
+ border: none;
336
478
  border-radius: 0px;
337
479
  }
338
480
 
339
481
  /*-------------------
340
- Fittted
482
+ Clearing
341
483
  --------------------*/
342
484
 
343
- .ui.fitted.segment {
344
- padding: 0em;
485
+ .ui.clearing.segment:after {
486
+ content: ".";
487
+ display: block;
488
+ height: 0;
489
+ clear: both;
490
+ visibility: hidden;
345
491
  }
346
492
 
347
493
  /*-------------------
348
494
  Colors
349
495
  --------------------*/
350
496
 
351
- .ui.black.segment:not(.inverted) {
352
- border-top: 2px solid #1b1c1d;
353
- }
354
- .ui.blue.segment:not(.inverted) {
355
- border-top: 2px solid #3b83c0;
497
+
498
+ /* Red */
499
+ .ui.red.segment:not(.inverted) {
500
+ border-top: 2px solid #db2828;
356
501
  }
357
- .ui.green.segment:not(.inverted) {
358
- border-top: 2px solid #5bbd72;
502
+ .ui.inverted.red.segment {
503
+ background-color: #db2828 !important;
504
+ color: #ffffff !important;
359
505
  }
506
+
507
+ /* Orange */
360
508
  .ui.orange.segment:not(.inverted) {
361
- border-top: 2px solid #e07b53;
362
- }
363
- .ui.pink.segment:not(.inverted) {
364
- border-top: 2px solid #d9499a;
365
- }
366
- .ui.purple.segment:not(.inverted) {
367
- border-top: 2px solid #564f8a;
368
- }
369
- .ui.red.segment:not(.inverted) {
370
- border-top: 2px solid #d95c5c;
509
+ border-top: 2px solid #f2711c;
371
510
  }
372
- .ui.teal.segment:not(.inverted) {
373
- border-top: 2px solid #00b5ad;
511
+ .ui.inverted.orange.segment {
512
+ background-color: #f2711c !important;
513
+ color: #ffffff !important;
374
514
  }
515
+
516
+ /* Yellow */
375
517
  .ui.yellow.segment:not(.inverted) {
376
- border-top: 2px solid #f2c61f;
518
+ border-top: 2px solid #fbbd08;
377
519
  }
378
- .ui.black.segment:not(.inverted):not(.attached) {
379
- border-top-left-radius: 0.2857rem !important;
380
- border-top-right-radius: 0.2857rem !important;
381
- }
382
- .ui.blue.segment:not(.inverted):not(.attached) {
383
- border-top-left-radius: 0.2857rem !important;
384
- border-top-right-radius: 0.2857rem !important;
385
- }
386
- .ui.green.segment:not(.inverted):not(.attached) {
387
- border-top-left-radius: 0.2857rem !important;
388
- border-top-right-radius: 0.2857rem !important;
520
+ .ui.inverted.yellow.segment {
521
+ background-color: #fbbd08 !important;
522
+ color: #ffffff !important;
389
523
  }
390
- .ui.orange.segment:not(.inverted):not(.attached) {
391
- border-top-left-radius: 0.2857rem !important;
392
- border-top-right-radius: 0.2857rem !important;
524
+
525
+ /* Olive */
526
+ .ui.olive.segment:not(.inverted) {
527
+ border-top: 2px solid #b5cc18;
393
528
  }
394
- .ui.pink.segment:not(.inverted):not(.attached) {
395
- border-top-left-radius: 0.2857rem !important;
396
- border-top-right-radius: 0.2857rem !important;
529
+ .ui.inverted.olive.segment {
530
+ background-color: #b5cc18 !important;
531
+ color: #ffffff !important;
397
532
  }
398
- .ui.purple.segment:not(.inverted):not(.attached) {
399
- border-top-left-radius: 0.2857rem !important;
400
- border-top-right-radius: 0.2857rem !important;
533
+
534
+ /* Green */
535
+ .ui.green.segment:not(.inverted) {
536
+ border-top: 2px solid #21ba45;
401
537
  }
402
- .ui.red.segment:not(.inverted):not(.attached) {
403
- border-top-left-radius: 0.2857rem !important;
404
- border-top-right-radius: 0.2857rem !important;
538
+ .ui.inverted.green.segment {
539
+ background-color: #21ba45 !important;
540
+ color: #ffffff !important;
405
541
  }
406
- .ui.teal.segment:not(.inverted):not(.attached) {
407
- border-top-left-radius: 0.2857rem !important;
408
- border-top-right-radius: 0.2857rem !important;
542
+
543
+ /* Teal */
544
+ .ui.teal.segment:not(.inverted) {
545
+ border-top: 2px solid #00b5ad;
409
546
  }
410
- .ui.yellow.segment:not(.inverted):not(.attached) {
411
- border-top-left-radius: 0.2857rem !important;
412
- border-top-right-radius: 0.2857rem !important;
547
+ .ui.inverted.teal.segment {
548
+ background-color: #00b5ad !important;
549
+ color: #ffffff !important;
413
550
  }
414
551
 
415
- /*-------------------
416
- Inverted Colors
417
- --------------------*/
418
-
419
- .ui.inverted.segment,
420
- .ui.inverted.black.segment {
421
- background-color: #1b1c1d !important;
422
- color: #ffffff !important;
552
+ /* Blue */
553
+ .ui.blue.segment:not(.inverted) {
554
+ border-top: 2px solid #2185d0;
423
555
  }
424
556
  .ui.inverted.blue.segment {
425
- background-color: #3b83c0 !important;
557
+ background-color: #2185d0 !important;
426
558
  color: #ffffff !important;
427
559
  }
428
- .ui.inverted.green.segment {
429
- background-color: #5bbd72 !important;
560
+
561
+ /* Violet */
562
+ .ui.violet.segment:not(.inverted) {
563
+ border-top: 2px solid #6435c9;
564
+ }
565
+ .ui.inverted.violet.segment {
566
+ background-color: #6435c9 !important;
430
567
  color: #ffffff !important;
431
568
  }
432
- .ui.inverted.orange.segment {
433
- background-color: #e07b53 !important;
569
+
570
+ /* Purple */
571
+ .ui.purple.segment:not(.inverted) {
572
+ border-top: 2px solid #a333c8;
573
+ }
574
+ .ui.inverted.purple.segment {
575
+ background-color: #a333c8 !important;
434
576
  color: #ffffff !important;
435
577
  }
578
+
579
+ /* Pink */
580
+ .ui.pink.segment:not(.inverted) {
581
+ border-top: 2px solid #e03997;
582
+ }
436
583
  .ui.inverted.pink.segment {
437
- background-color: #d9499a !important;
584
+ background-color: #e03997 !important;
438
585
  color: #ffffff !important;
439
586
  }
440
- .ui.inverted.purple.segment {
441
- background-color: #564f8a !important;
442
- color: #ffffff !important;
587
+
588
+ /* Brown */
589
+ .ui.brown.segment:not(.inverted) {
590
+ border-top: 2px solid #a5673f;
443
591
  }
444
- .ui.inverted.red.segment {
445
- background-color: #d95c5c !important;
592
+ .ui.inverted.brown.segment {
593
+ background-color: #a5673f !important;
446
594
  color: #ffffff !important;
447
595
  }
448
- .ui.inverted.teal.segment {
449
- background-color: #00b5ad !important;
596
+
597
+ /* Grey */
598
+ .ui.grey.segment:not(.inverted) {
599
+ border-top: 2px solid #767676;
600
+ }
601
+ .ui.inverted.grey.segment {
602
+ background-color: #767676 !important;
450
603
  color: #ffffff !important;
451
604
  }
452
- .ui.inverted.yellow.segment {
453
- background-color: #f2c61f !important;
605
+
606
+ /* Black */
607
+ .ui.black.segment:not(.inverted) {
608
+ border-top: 2px solid #1b1c1d;
609
+ }
610
+ .ui.inverted.black.segment {
611
+ background-color: #1b1c1d !important;
454
612
  color: #ffffff !important;
455
613
  }
456
614
 
@@ -475,11 +633,11 @@
475
633
  .ui.floated.segment,
476
634
  .ui[class*="left floated"].segment {
477
635
  float: left;
478
- margin-right: 1rem;
636
+ margin-right: 1em;
479
637
  }
480
638
  .ui[class*="right floated"].segment {
481
639
  float: right;
482
- margin-left: 1rem;
640
+ margin-left: 1em;
483
641
  }
484
642
 
485
643
  /*-------------------
@@ -490,72 +648,79 @@
490
648
  border: none;
491
649
  box-shadow: none;
492
650
  }
651
+ .ui.inverted.segment,
652
+ .ui.primary.inverted.segment {
653
+ background: #1b1c1d;
654
+ color: rgba(255, 255, 255, 0.9);
655
+ }
656
+
657
+ /* Nested */
493
658
  .ui.inverted.segment .segment {
494
- color: rgba(0, 0, 0, 0.8);
659
+ color: rgba(0, 0, 0, 0.87);
495
660
  }
496
661
  .ui.inverted.segment .inverted.segment {
497
- color: #ffffff;
498
- }
499
- .ui.inverted.segment,
500
- .ui.primary.inverted.segment {
501
- background-color: #1b1c1d;
502
- color: #ffffff;
662
+ color: rgba(255, 255, 255, 0.9);
503
663
  }
504
- .ui.inverted.block.segment,
664
+
665
+ /* Attached */
505
666
  .ui.inverted.attached.segment {
506
667
  border-color: #555555;
507
668
  }
508
669
 
509
670
  /*-------------------
510
- Ordinality
671
+ Emphasis
511
672
  --------------------*/
512
673
 
674
+
675
+ /* Secondary */
513
676
  .ui.secondary.segment {
514
- background: #faf9fa;
515
- color: rgba(0, 0, 0, 0.8);
516
- }
517
- .ui.tertiary.segment {
518
- background: #ebebeb;
519
- color: rgba(0, 0, 0, 0.8);
677
+ background: #f3f4f5;
678
+ color: rgba(0, 0, 0, 0.6);
520
679
  }
521
680
  .ui.secondary.inverted.segment {
522
- background: -webkit-linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%);
523
- background: linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%);
524
- color: #fafafa;
681
+ background: #4c4f52 -webkit-linear-gradient(rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
682
+ background: #4c4f52 linear-gradient(rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
683
+ color: rgba(255, 255, 255, 0.8);
684
+ }
685
+
686
+ /* Tertiary */
687
+ .ui.tertiary.segment {
688
+ background: #dcddde;
689
+ color: rgba(0, 0, 0, 0.6);
525
690
  }
526
691
  .ui.tertiary.inverted.segment {
527
- background: -webkit-linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 100%);
528
- background: linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 100%);
529
- color: #f0f0f0;
692
+ background: #717579 -webkit-linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.35) 100%);
693
+ background: #717579 linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.35) 100%);
694
+ color: rgba(255, 255, 255, 0.8);
530
695
  }
531
696
 
532
697
  /*-------------------
533
698
  Attached
534
699
  --------------------*/
535
700
 
536
- .ui.segment.attached {
701
+
702
+ /* Middle */
703
+ .ui.attached.segment {
537
704
  top: 0px;
538
705
  bottom: 0px;
706
+ border-radius: 0px;
539
707
  margin: 0em -1px;
540
- width: -webkit-calc(100% + 2px );
541
708
  width: calc(100% + 2px );
542
- max-width: -webkit-calc(100% + 2px );
543
709
  max-width: calc(100% + 2px );
544
- border-radius: 0px;
545
710
  box-shadow: none;
546
711
  border: 1px solid #d4d4d5;
547
712
  }
548
- .ui.segment.attached + .ui.segment.attached:not(.top) {
713
+ .ui.attached + .ui.attached.segment:not(.top) {
549
714
  border-top: none;
550
715
  }
551
716
 
552
717
  /* Top */
553
718
  .ui[class*="top attached"].segment {
554
- top: 0px;
555
719
  bottom: 0px;
556
- margin-top: 1rem;
557
720
  margin-bottom: 0em;
558
- border-radius: 0.2857rem 0.2857rem 0em 0em;
721
+ top: 0px;
722
+ margin-top: 1rem;
723
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
559
724
  }
560
725
  .ui.segment[class*="top attached"]:first-child {
561
726
  margin-top: 0em;
@@ -563,65 +728,17 @@
563
728
 
564
729
  /* Bottom */
565
730
  .ui.segment[class*="bottom attached"] {
566
- top: 0px;
567
731
  bottom: 0px;
568
732
  margin-top: 0em;
733
+ top: 0px;
569
734
  margin-bottom: 1rem;
570
- box-shadow: none, 0px 1px 2px 0 rgba(0, 0, 0, 0.05);
571
- border-radius: 0em 0em 0.2857rem 0.2857rem;
735
+ box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
736
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
572
737
  }
573
738
  .ui.segment[class*="bottom attached"]:last-child {
574
739
  margin-bottom: 0em;
575
740
  }
576
741
 
577
- /*-------------------
578
- Groups
579
- --------------------*/
580
-
581
- .ui.segments {
582
- margin: 1rem 0em;
583
- }
584
- .ui.segments:first-child {
585
- margin-top: 0em;
586
- }
587
- .ui.segments:last-child {
588
- margin-bottom: 0em;
589
- }
590
- .ui.segments > .segment {
591
- top: 0px;
592
- bottom: 0px;
593
- margin: 0em -1px;
594
- width: -webkit-calc(100% + 2px );
595
- width: calc(100% + 2px );
596
- max-width: -webkit-calc(100% + 2px );
597
- max-width: calc(100% + 2px );
598
- border-radius: 0px;
599
- box-shadow: none;
600
- border: 1px solid #d4d4d5;
601
- }
602
- .ui.segments > .segment:not(:first-child) {
603
- border-top: none;
604
- }
605
-
606
- /* Top */
607
- .ui.segments > .segment:first-child {
608
- margin-top: 0em;
609
- bottom: 0px;
610
- margin-bottom: 0em;
611
- top: 0px;
612
- border-radius: 0.2857rem 0.2857rem 0em 0em;
613
- }
614
-
615
- /* Bottom */
616
- .ui.segments > .segment:last-child {
617
- bottom: 0px;
618
- margin-top: 0em;
619
- margin-bottom: 0em;
620
- top: 0px;
621
- box-shadow: none, 0px 1px 2px 0 rgba(0, 0, 0, 0.05);
622
- border-radius: 0em 0em 0.2857rem 0.2857rem;
623
- }
624
-
625
742
 
626
743
  /*******************************
627
744
  Theme Overrides