ducky/web

Paddy 2015-05-31 Parent:b9d0efb44eaa

6:a641906b8267 Go to Latest

ducky/web/src/styles/_flashes.scss

Enable catch-all in our ValidationError component. We're doing this an ugly, hacky way. But it works, and right now, that's what counts. To match our params/fields/headers properties on the ValidationError component, we're going to add the notParams/notFields/notHeaders properties--they match any error _not_ targeting those params/fields/headers. Basically, "any error that wouldn't be caught by these filters". Which is an ugly, but workable, solution for a catch-all ValidationError--just tell it to catch anything but the params/fields/headers that are being handled by the other ValidationErrors. Our implementation of this in the RegisterPage component validates (ha!) that it's at least workable model, if not overly pretty. Also, I anticipate some human error bugs in the future, where one of the field-specific ValidationErrors gets updated and the catch-all ValidationError does not. But whatever. For now, this is Good Enoughâ„¢.

History
1 $base-spacing: 1.5em !default;
2 $alert-color: #fff6bf !default;
3 $error-color: #fbe3e4 !default;
4 $notice-color: #e5edf8 !default;
5 $success-color: #e6efc2 !default;
7 @mixin flash($color) {
8 background-color: $color;
9 color: darken($color, 60%);
10 display: block;
11 font-weight: 500;
12 margin-bottom: $base-spacing / 2;
13 padding: $base-spacing / 2;
14 text-align: center;
16 a {
17 color: darken($color, 70%);
18 text-decoration: underline;
20 &:focus,
21 &:hover {
22 color: darken($color, 90%);
23 }
24 }
25 }
27 .flash-alert {
28 @include flash($alert-color);
29 }
31 .flash-error {
32 @include flash($error-color);
33 }
35 .flash-notice {
36 @include flash($notice-color);
37 }
39 .flash-success {
40 @include flash($success-color);
41 }