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
@@ -3,7 +3,7 @@
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
  *
@@ -31,7 +31,9 @@ $.visit = $.fn.visit = function(parameters) {
31
31
  $allModules
32
32
  .each(function() {
33
33
  var
34
- settings = $.extend(true, {}, $.fn.visit.settings, parameters),
34
+ settings = ( $.isPlainObject(parameters) )
35
+ ? $.extend(true, {}, $.fn.visit.settings, parameters)
36
+ : $.extend({}, $.fn.visit.settings),
35
37
 
36
38
  error = settings.error,
37
39
  namespace = settings.namespace,
@@ -365,7 +367,7 @@ $.visit = $.fn.visit = function(parameters) {
365
367
  });
366
368
  }
367
369
  clearTimeout(module.performance.timer);
368
- module.performance.timer = setTimeout(module.performance.display, 100);
370
+ module.performance.timer = setTimeout(module.performance.display, 500);
369
371
  },
370
372
  display: function() {
371
373
  var
@@ -479,7 +481,7 @@ $.fn.visit.settings = {
479
481
  name : 'Visit',
480
482
 
481
483
  debug : false,
482
- verbose : true,
484
+ verbose : false,
483
485
  performance : true,
484
486
 
485
487
  namespace : 'visit',
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Breadcrumb
2
+ * # Semantic UI 2.0.4 - Breadcrumb
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
  *
@@ -15,6 +15,7 @@
15
15
  *******************************/
16
16
 
17
17
  .ui.breadcrumb {
18
+ line-height: 1;
18
19
  margin: 1em 0em;
19
20
  display: inline-block;
20
21
  vertical-align: middle;
@@ -35,19 +36,19 @@
35
36
  /* Divider */
36
37
  .ui.breadcrumb .divider {
37
38
  display: inline-block;
38
- opacity: 0.5;
39
- margin: 0em 0.2rem 0em;
40
- font-size: 0.9em;
39
+ opacity: 0.7;
40
+ margin: 0em 0.21428571rem 0em;
41
+ font-size: 0.92857143em;
41
42
  color: rgba(0, 0, 0, 0.4);
42
43
  vertical-align: baseline;
43
44
  }
44
45
 
45
46
  /* Link */
46
47
  .ui.breadcrumb a {
47
- color: #009fda;
48
+ color: #4183c4;
48
49
  }
49
50
  .ui.breadcrumb a:hover {
50
- color: #00b2f3;
51
+ color: #1e70bf;
51
52
  }
52
53
 
53
54
  /* Icon Divider */
@@ -69,7 +70,7 @@
69
70
  /* Loose Coupling */
70
71
  .ui.breadcrumb.segment {
71
72
  display: inline-block;
72
- padding: 0.5em 1em;
73
+ padding: 0.71428571em 1em;
73
74
  }
74
75
 
75
76
 
@@ -87,28 +88,28 @@
87
88
  *******************************/
88
89
 
89
90
  .ui.mini.breadcrumb {
90
- font-size: 0.65em;
91
+ font-size: 0.71428571rem;
91
92
  }
92
93
  .ui.tiny.breadcrumb {
93
- font-size: 0.7em;
94
+ font-size: 0.85714286rem;
94
95
  }
95
96
  .ui.small.breadcrumb {
96
- font-size: 0.75em;
97
+ font-size: 0.92857143rem;
97
98
  }
98
99
  .ui.breadcrumb {
99
- font-size: 1em;
100
+ font-size: 1rem;
100
101
  }
101
102
  .ui.large.breadcrumb {
102
- font-size: 1.1em;
103
+ font-size: 1.14285714rem;
103
104
  }
104
105
  .ui.big.breadcrumb {
105
- font-size: 1.05em;
106
+ font-size: 1.28571429rem;
106
107
  }
107
108
  .ui.huge.breadcrumb {
108
- font-size: 1.3em;
109
+ font-size: 1.42857143rem;
109
110
  }
110
111
  .ui.massive.breadcrumb {
111
- font-size: 1.5em;
112
+ font-size: 1.71428571rem;
112
113
  }
113
114
 
114
115
 
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Form
2
+ * # Semantic UI 2.0.4 - Form
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
  *
@@ -36,15 +36,18 @@
36
36
  Field
37
37
  ---------------------*/
38
38
 
39
- .ui.form .fields .field,
40
39
  .ui.form .field {
41
40
  clear: both;
42
41
  margin: 0em 0em 1em;
43
42
  }
44
- .ui.form .fields:last-child,
45
- .ui.form .field:last-child {
43
+ .ui.form .field:last-child,
44
+ .ui.form .fields:last-child .field {
46
45
  margin-bottom: 0em;
47
46
  }
47
+ .ui.form .fields .field {
48
+ clear: both;
49
+ margin: 0em 0em 1em;
50
+ }
48
51
 
49
52
  /*--------------------
50
53
  Labels
@@ -52,25 +55,9 @@
52
55
 
53
56
  .ui.form .field > label {
54
57
  display: block;
55
- margin: 0em 0em 0.2857rem 0em;
56
- color: rgba(0, 0, 0, 0.8);
57
- font-size: 0.9285em;
58
- font-weight: bold;
59
- text-transform: none;
60
- }
61
- .ui.form .grouped.fields > label {
62
- margin: 0em 0em 0.2857rem 0em;
63
- color: rgba(0, 0, 0, 0.8);
64
- font-size: 0.9285em;
65
- font-weight: bold;
66
- text-transform: none;
67
- }
68
- .ui.form .inline.fields > label {
69
- display: inline-block;
70
- vertical-align: middle;
71
- margin: 0em 1em 0em 0em;
72
- color: rgba(0, 0, 0, 0.8);
73
- font-size: 0.9285em;
58
+ margin: 0em 0em 0.28571429rem 0em;
59
+ color: rgba(0, 0, 0, 0.87);
60
+ font-size: 0.92857143em;
74
61
  font-weight: bold;
75
62
  text-transform: none;
76
63
  }
@@ -112,36 +99,44 @@
112
99
  -webkit-appearance: none;
113
100
  tap-highlight-color: rgba(255, 255, 255, 0);
114
101
  line-height: 1.2142em;
115
- padding: 0.67861em 1em;
102
+ padding: 0.67861429em 1em;
116
103
  font-size: 1em;
117
104
  background: #ffffff;
118
- border: 1px solid rgba(39, 41, 43, 0.15);
119
- color: rgba(0, 0, 0, 0.8);
120
- border-radius: 0.2857rem;
105
+ border: 1px solid rgba(34, 36, 38, 0.15);
106
+ color: rgba(0, 0, 0, 0.87);
107
+ border-radius: 0.28571429rem;
121
108
  box-shadow: 0em 0em 0em 0em transparent inset;
122
- -webkit-transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
123
- transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
109
+ -webkit-transition: color 0.1s ease, border-color 0.1s ease;
110
+ transition: color 0.1s ease, border-color 0.1s ease;
111
+ }
112
+
113
+ /* Collapse Flex */
114
+ .ui.form .ui.input > input {
115
+ width: 0px !important;
124
116
  }
125
- .ui.textarea,
117
+
118
+ /* Text Area */
126
119
  .ui.form textarea {
127
120
  margin: 0em;
128
121
  -webkit-appearance: none;
129
122
  tap-highlight-color: rgba(255, 255, 255, 0);
130
- padding: 0.78571em 1em;
123
+ padding: 0.78571429em 1em;
131
124
  background: #ffffff;
132
- border: 1px solid rgba(39, 41, 43, 0.15);
125
+ border: 1px solid rgba(34, 36, 38, 0.15);
133
126
  outline: none;
134
- color: rgba(0, 0, 0, 0.8);
135
- border-radius: 0.2857rem;
127
+ color: rgba(0, 0, 0, 0.87);
128
+ border-radius: 0.28571429rem;
136
129
  box-shadow: 0em 0em 0em 0em transparent inset;
137
- -webkit-transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
138
- transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
130
+ -webkit-transition: color 0.1s ease, border-color 0.1s ease;
131
+ transition: color 0.1s ease, border-color 0.1s ease;
139
132
  font-size: 1em;
133
+ line-height: 1.2857;
134
+ resize: vertical;
135
+ }
136
+ .ui.form textarea:not([rows]) {
140
137
  height: 12em;
141
138
  min-height: 8em;
142
139
  max-height: 24em;
143
- line-height: 1.2857;
144
- resize: vertical;
145
140
  }
146
141
  .ui.form textarea,
147
142
  .ui.form input[type="checkbox"] {
@@ -165,13 +160,13 @@
165
160
  height: auto;
166
161
  width: 100%;
167
162
  background: #ffffff;
168
- border: 1px solid rgba(39, 41, 43, 0.15);
169
- border-radius: 0.2857rem;
163
+ border: 1px solid rgba(34, 36, 38, 0.15);
164
+ border-radius: 0.28571429rem;
170
165
  box-shadow: 0em 0em 0em 0em transparent inset;
171
166
  padding: 0.62em 1em;
172
- color: rgba(0, 0, 0, 0.8);
173
- -webkit-transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
174
- transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
167
+ color: rgba(0, 0, 0, 0.87);
168
+ -webkit-transition: color 0.1s ease, border-color 0.1s ease;
169
+ transition: color 0.1s ease, border-color 0.1s ease;
175
170
  }
176
171
 
177
172
  /*--------------------
@@ -239,6 +234,27 @@
239
234
  *******************************/
240
235
 
241
236
 
237
+ /*--------------------
238
+ Autofilled
239
+ ---------------------*/
240
+
241
+ .ui.form .field.field input:-webkit-autofill {
242
+ box-shadow: 0px 0px 0px 100px #fffff0 inset !important;
243
+ border-color: #e5dfa1 !important;
244
+ }
245
+
246
+ /* Focus */
247
+ .ui.form .field.field input:-webkit-autofill:focus {
248
+ box-shadow: 0px 0px 0px 100px #fffff0 inset !important;
249
+ border-color: #d5c315 !important;
250
+ }
251
+
252
+ /* Error */
253
+ .ui.form .error.error input:-webkit-autofill {
254
+ box-shadow: 0px 0px 0px 100px #fffaf0 inset !important;
255
+ border-color: #e0b4b4 !important;
256
+ }
257
+
242
258
  /*--------------------
243
259
  Placeholder
244
260
  ---------------------*/
@@ -246,30 +262,42 @@
246
262
 
247
263
  /* browsers require these rules separate */
248
264
  .ui.form ::-webkit-input-placeholder {
249
- color: rgba(140, 140, 140, 0.8);
265
+ color: rgba(140, 140, 140, 0.87);
266
+ }
267
+ .ui.form ::-ms-input-placeholder {
268
+ color: rgba(140, 140, 140, 0.87);
250
269
  }
251
270
  .ui.form ::-moz-placeholder {
252
- color: rgba(140, 140, 140, 0.8);
271
+ color: rgba(140, 140, 140, 0.87);
253
272
  }
254
273
  .ui.form :focus::-webkit-input-placeholder {
255
- color: rgba(89, 89, 89, 0.8);
274
+ color: rgba(89, 89, 89, 0.87);
275
+ }
276
+ .ui.form :focus::-ms-input-placeholder {
277
+ color: rgba(89, 89, 89, 0.87);
256
278
  }
257
279
  .ui.form :focus::-moz-placeholder {
258
- color: rgba(89, 89, 89, 0.8);
280
+ color: rgba(89, 89, 89, 0.87);
259
281
  }
260
282
 
261
283
  /* Error Placeholder */
262
284
  .ui.form .error ::-webkit-input-placeholder {
263
- color: #e38585;
285
+ color: #bf4d4b;
286
+ }
287
+ .ui.form .error ::-ms-input-placeholder {
288
+ color: #bf4d4b;
264
289
  }
265
290
  .ui.form .error ::-moz-placeholder {
266
- color: #e38585;
291
+ color: #bf4d4b;
267
292
  }
268
293
  .ui.form .error :focus::-webkit-input-placeholder {
269
- color: #de7171;
294
+ color: #b2413f;
295
+ }
296
+ .ui.form .error :focus::-ms-input-placeholder {
297
+ color: #b2413f;
270
298
  }
271
299
  .ui.form .error :focus::-moz-placeholder {
272
- color: #de7171;
300
+ color: #b2413f;
273
301
  }
274
302
 
275
303
  /*--------------------
@@ -287,18 +315,18 @@
287
315
  .ui.form input[type="time"]:focus,
288
316
  .ui.form input[type="text"]:focus,
289
317
  .ui.form input[type="url"]:focus {
290
- color: rgba(0, 0, 0, 0.85);
291
- border-color: rgba(39, 41, 43, 0.3);
292
- border-radius: 0em 0.2857rem 0.2857rem 0em;
318
+ color: rgba(0, 0, 0, 0.95);
319
+ border-color: rgba(34, 36, 38, 0.35);
320
+ border-radius: 0.28571429rem;
293
321
  background: #ffffff;
294
- box-shadow: 1px 0em 0em 0em rgba(39, 41, 43, 0.3) inset;
322
+ box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.35) inset;
295
323
  }
296
324
  .ui.form textarea:focus {
297
- color: rgba(0, 0, 0, 0.85);
298
- border-color: rgba(39, 41, 43, 0.3);
299
- border-radius: 0em 0.2857rem 0.2857rem 0em;
325
+ color: rgba(0, 0, 0, 0.95);
326
+ border-color: rgba(34, 36, 38, 0.35);
327
+ border-radius: 0.28571429rem;
300
328
  background: #ffffff;
301
- box-shadow: 1px 0em 0em 0em rgba(39, 41, 43, 0.3) inset;
329
+ box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.35) inset;
302
330
  -webkit-appearance: none;
303
331
  }
304
332
 
@@ -311,6 +339,12 @@
311
339
  .ui.form.success .success.message {
312
340
  display: block;
313
341
  }
342
+ .ui.form.success .icon.success.message {
343
+ display: -webkit-box;
344
+ display: -webkit-flex;
345
+ display: -ms-flexbox;
346
+ display: flex;
347
+ }
314
348
 
315
349
  /*--------------------
316
350
  Error
@@ -321,6 +355,12 @@
321
355
  .ui.form.warning .warning.message {
322
356
  display: block;
323
357
  }
358
+ .ui.form.warning .icon.warning.message {
359
+ display: -webkit-box;
360
+ display: -webkit-flex;
361
+ display: -ms-flexbox;
362
+ display: flex;
363
+ }
324
364
 
325
365
  /*--------------------
326
366
  Warning
@@ -331,17 +371,23 @@
331
371
  .ui.form.error .error.message {
332
372
  display: block;
333
373
  }
374
+ .ui.form.error .icon.error.message {
375
+ display: -webkit-box;
376
+ display: -webkit-flex;
377
+ display: -ms-flexbox;
378
+ display: flex;
379
+ }
334
380
 
335
381
  /* On Field(s) */
336
382
  .ui.form .fields.error .field label,
337
383
  .ui.form .field.error label,
338
384
  .ui.form .fields.error .field .input,
339
385
  .ui.form .field.error .input {
340
- color: #d95c5c;
386
+ color: #9f3a38;
341
387
  }
342
388
  .ui.form .fields.error .field .corner.label,
343
389
  .ui.form .field.error .corner.label {
344
- border-color: #d95c5c;
390
+ border-color: #9f3a38;
345
391
  color: #ffffff;
346
392
  }
347
393
  .ui.form .fields.error .field textarea,
@@ -370,11 +416,11 @@
370
416
  .ui.form .field.error input[type="time"],
371
417
  .ui.form .field.error input[type="text"],
372
418
  .ui.form .field.error input[type="url"] {
373
- background: #fff0f0;
374
- border-color: #dbb1b1;
375
- color: #d95c5c;
376
- border-radius: 0em 0.2857rem 0.2857rem 0em;
377
- box-shadow: 2px 0em 0em 0em #d95c5c inset;
419
+ background: #fff6f6;
420
+ border-color: #e0b4b4;
421
+ color: #9f3a38;
422
+ border-radius: '';
423
+ box-shadow: none;
378
424
  }
379
425
  .ui.form .field.error textarea:focus,
380
426
  .ui.form .field.error select:focus,
@@ -389,11 +435,11 @@
389
435
  .ui.form .field.error input[type="time"]:focus,
390
436
  .ui.form .field.error input[type="text"]:focus,
391
437
  .ui.form .field.error input[type="url"]:focus {
392
- background: #fff0f0;
393
- border-color: #dbb1b1;
394
- color: #dc6868;
438
+ background: #fff6f6;
439
+ border-color: #e0b4b4;
440
+ color: #9f3a38;
395
441
  -webkit-appearance: none;
396
- box-shadow: 2px 0em 0em 0em #dc6868 inset;
442
+ box-shadow: none;
397
443
  }
398
444
 
399
445
  /* Preserve Native Select Stylings */
@@ -410,20 +456,25 @@
410
456
  .ui.form .field.error .ui.dropdown,
411
457
  .ui.form .field.error .ui.dropdown .text,
412
458
  .ui.form .field.error .ui.dropdown .item {
413
- background: #fff0f0;
414
- color: #d95c5c;
459
+ background: #fff6f6;
460
+ color: #9f3a38;
415
461
  }
416
462
  .ui.form .fields.error .field .ui.dropdown,
417
463
  .ui.form .field.error .ui.dropdown {
418
- border-color: #dbb1b1 !important;
464
+ border-color: #e0b4b4 !important;
419
465
  }
420
466
  .ui.form .fields.error .field .ui.dropdown:hover,
421
467
  .ui.form .field.error .ui.dropdown:hover {
422
- border-color: #dbb1b1 !important;
468
+ border-color: #e0b4b4 !important;
423
469
  }
424
470
  .ui.form .fields.error .field .ui.dropdown:hover .menu,
425
471
  .ui.form .field.error .ui.dropdown:hover .menu {
426
- border-color: #dbb1b1;
472
+ border-color: #e0b4b4;
473
+ }
474
+ .ui.form .fields.error .field .ui.multiple.selection.dropdown > .label,
475
+ .ui.form .field.error .ui.multiple.selection.dropdown > .label {
476
+ background-color: #eacbcb;
477
+ color: #9f3a38;
427
478
  }
428
479
 
429
480
  /* Hover */
@@ -432,6 +483,12 @@
432
483
  background-color: #fbe7e7;
433
484
  }
434
485
 
486
+ /* Selected */
487
+ .ui.form .fields.error .field .ui.dropdown .menu .selected.item,
488
+ .ui.form .field.error .ui.dropdown .menu .selected.item {
489
+ background-color: #fbe7e7;
490
+ }
491
+
435
492
  /* Active */
436
493
  .ui.form .fields.error .field .ui.dropdown .menu .active.item,
437
494
  .ui.form .field.error .ui.dropdown .menu .active.item {
@@ -446,32 +503,33 @@
446
503
  .ui.form .field.error .checkbox:not(.toggle):not(.slider) label,
447
504
  .ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box,
448
505
  .ui.form .field.error .checkbox:not(.toggle):not(.slider) .box {
449
- color: #d95c5c;
506
+ color: #9f3a38;
450
507
  }
451
508
  .ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label:before,
452
509
  .ui.form .field.error .checkbox:not(.toggle):not(.slider) label:before,
453
510
  .ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box:before,
454
511
  .ui.form .field.error .checkbox:not(.toggle):not(.slider) .box:before {
455
- background: #fff0f0;
456
- border-color: #dbb1b1;
512
+ background: #fff6f6;
513
+ border-color: #e0b4b4;
457
514
  }
458
515
  .ui.form .fields.error .field .checkbox label:after,
459
516
  .ui.form .field.error .checkbox label:after,
460
517
  .ui.form .fields.error .field .checkbox .box:after,
461
518
  .ui.form .field.error .checkbox .box:after {
462
- color: #d95c5c;
519
+ color: #9f3a38;
463
520
  }
464
521
 
465
522
  /*--------------------
466
523
  Disabled
467
524
  ---------------------*/
468
525
 
469
- .ui.form .field :disabled,
470
- .ui.form .field.disabled {
471
- opacity: 0.5;
526
+ .ui.form .disabled.fields .field,
527
+ .ui.form .disabled.field,
528
+ .ui.form .field :disabled {
529
+ opacity: 0.45;
472
530
  }
473
531
  .ui.form .field.disabled label {
474
- opacity: 0.5;
532
+ opacity: 0.45;
475
533
  }
476
534
  .ui.form .field.disabled :disabled {
477
535
  opacity: 1;
@@ -514,7 +572,7 @@
514
572
  -webkit-animation-iteration-count: infinite;
515
573
  animation-iteration-count: infinite;
516
574
  border-radius: 500rem;
517
- border-color: #aaaaaa rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
575
+ border-color: #767676 rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
518
576
  border-style: solid;
519
577
  border-width: 0.2em;
520
578
  box-shadow: 0px 0px 0px 1px transparent;
@@ -559,7 +617,7 @@
559
617
  .ui.form .required.field > .checkbox:after {
560
618
  margin: -0.2em 0em 0em 0.2em;
561
619
  content: '*';
562
- color: #d95c5c;
620
+ color: #db2828;
563
621
  }
564
622
  .ui.form .required.fields:not(.grouped) > .field > label:after,
565
623
  .ui.form .required.fields.grouped > label:after,
@@ -590,7 +648,7 @@
590
648
  .ui.form .inverted.segment .ui.checkbox .box,
591
649
  .ui.inverted.form .ui.checkbox label,
592
650
  .ui.inverted.form .ui.checkbox .box {
593
- color: #ffffff;
651
+ color: rgba(255, 255, 255, 0.9);
594
652
  }
595
653
 
596
654
  /*--------------------
@@ -600,17 +658,22 @@
600
658
 
601
659
  /* Grouped Vertically */
602
660
  .ui.form .grouped.fields {
661
+ display: block;
603
662
  margin: 0em 0em 1em;
604
663
  }
605
664
  .ui.form .grouped.fields:last-child {
606
665
  margin-bottom: 0em;
607
666
  }
608
667
  .ui.form .grouped.fields > label {
609
- font-size: 0.9285em;
668
+ margin: 0em 0em 0.28571429rem 0em;
669
+ color: rgba(0, 0, 0, 0.87);
670
+ font-size: 0.92857143em;
671
+ font-weight: bold;
672
+ text-transform: none;
610
673
  }
611
- .ui.form .grouped.fields .field {
674
+ .ui.form .grouped.fields .field,
675
+ .ui.form .grouped.inline.fields .field {
612
676
  display: block;
613
- float: none;
614
677
  margin: 0.5em 0em;
615
678
  padding: 0em;
616
679
  }
@@ -622,19 +685,21 @@
622
685
 
623
686
  /* Split fields */
624
687
  .ui.form .fields {
625
- clear: both;
626
- }
627
- .ui.form .fields:after {
628
- content: ' ';
629
- display: block;
630
- clear: both;
631
- visibility: hidden;
632
- line-height: 0;
633
- height: 0;
688
+ display: -webkit-box;
689
+ display: -webkit-flex;
690
+ display: -ms-flexbox;
691
+ display: flex;
692
+ -webkit-box-orient: horizontal;
693
+ -webkit-box-direction: normal;
694
+ -webkit-flex-direction: row;
695
+ -ms-flex-direction: row;
696
+ flex-direction: row;
634
697
  }
635
698
  .ui.form .fields > .field {
636
- clear: none;
637
- float: left;
699
+ -webkit-box-flex: 0;
700
+ -webkit-flex: 0 1 auto;
701
+ -ms-flex: 0 1 auto;
702
+ flex: 0 1 auto;
638
703
  padding-left: 0.5em;
639
704
  padding-right: 0.5em;
640
705
  }
@@ -683,6 +748,11 @@
683
748
 
684
749
  /* Swap to full width on mobile */
685
750
  @media only screen and (max-width: 767px) {
751
+ .ui.form .fields {
752
+ -webkit-flex-wrap: wrap;
753
+ -ms-flex-wrap: wrap;
754
+ flex-wrap: wrap;
755
+ }
686
756
  .ui.form .two.fields > .fields,
687
757
  .ui.form .two.fields > .field,
688
758
  .ui.form .three.fields > .fields,
@@ -813,48 +883,80 @@
813
883
 
814
884
  .ui.form .inline.fields {
815
885
  margin: 0em 0em 1em;
886
+ -webkit-box-align: center;
887
+ -webkit-align-items: center;
888
+ -ms-flex-align: center;
889
+ align-items: center;
816
890
  }
817
891
  .ui.form .inline.fields .field {
818
- display: inline-block;
819
- float: none;
820
- margin: 0em 1em 0em 0em;
821
- padding: 0em;
892
+ margin: 0em;
893
+ padding: 0em 1em 0em 0em;
822
894
  }
895
+
896
+ /* Inline Label */
897
+ .ui.form .inline.fields > label,
823
898
  .ui.form .inline.fields .field > label,
824
899
  .ui.form .inline.fields .field > p,
825
- .ui.form .inline.fields .field > input,
826
- .ui.form .inline.fields .field > .ui.input,
827
900
  .ui.form .inline.field > label,
828
- .ui.form .inline.field > p,
829
- .ui.form .inline.field > input,
830
- .ui.form .inline.field > .ui.input {
901
+ .ui.form .inline.field > p {
831
902
  display: inline-block;
832
903
  width: auto;
833
904
  margin-top: 0em;
834
905
  margin-bottom: 0em;
835
- vertical-align: middle;
836
- font-size: 0.9285em;
906
+ vertical-align: baseline;
907
+ font-size: 0.92857143em;
908
+ font-weight: bold;
909
+ color: rgba(0, 0, 0, 0.87);
910
+ text-transform: none;
837
911
  }
912
+
913
+ /* Grouped Inline Label */
914
+ .ui.form .inline.fields > label {
915
+ margin: 0.035714em 1em 0em 0em;
916
+ }
917
+
918
+ /* Inline Input */
838
919
  .ui.form .inline.fields .field > input,
920
+ .ui.form .inline.fields .field > select,
839
921
  .ui.form .inline.fields .field > .ui.input,
840
922
  .ui.form .inline.field > input,
923
+ .ui.form .inline.field > select,
841
924
  .ui.form .inline.field > .ui.input {
842
- font-size: 0.9285em;
843
- }
844
- .ui.form .inline.fields .field > .ui.checkbox label {
845
- padding-left: 1.75em;
925
+ display: inline-block;
926
+ width: auto;
927
+ margin-top: 0em;
928
+ margin-bottom: 0em;
929
+ vertical-align: middle;
930
+ font-size: 1em;
846
931
  }
847
932
 
848
933
  /* Label */
849
934
  .ui.form .inline.fields .field > :first-child,
850
935
  .ui.form .inline.field > :first-child {
851
- margin: 0em 0.2857rem 0em 0em;
936
+ margin: 0em 0.85714286em 0em 0em;
852
937
  }
853
938
  .ui.form .inline.fields .field > :only-child,
854
939
  .ui.form .inline.field > :only-child {
855
940
  margin: 0em;
856
941
  }
857
942
 
943
+ /* Wide */
944
+ .ui.form .inline.fields .wide.field {
945
+ display: -webkit-box;
946
+ display: -webkit-flex;
947
+ display: -ms-flexbox;
948
+ display: flex;
949
+ -webkit-box-align: center;
950
+ -webkit-align-items: center;
951
+ -ms-flex-align: center;
952
+ align-items: center;
953
+ }
954
+ .ui.form .inline.fields .wide.field > input,
955
+ .ui.form .inline.fields .wide.field > select,
956
+ .ui.form .inline.fields .wide.field > .ui.input {
957
+ width: 100%;
958
+ }
959
+
858
960
  /*--------------------
859
961
  Sizes
860
962
  ---------------------*/
@@ -862,22 +964,22 @@
862
964
 
863
965
  /* Standard */
864
966
  .ui.small.form {
865
- font-size: 0.875em;
967
+ font-size: 0.92857143rem;
866
968
  }
867
969
 
868
970
  /* Medium */
869
971
  .ui.form {
870
- font-size: auto;
972
+ font-size: 1rem;
871
973
  }
872
974
 
873
975
  /* Large */
874
976
  .ui.large.form {
875
- font-size: 1.125em;
977
+ font-size: 1.14285714rem;
876
978
  }
877
979
 
878
980
  /* Huge */
879
981
  .ui.huge.form {
880
- font-size: 1.2em;
982
+ font-size: 1.42857143rem;
881
983
  }
882
984
 
883
985