ducky/web
2015-06-30
Parent:99a43a6d1d30
ducky/web/src/styles/base/_forms.scss
Implement OAuth token refreshing helper. Create an ampersand-sync/XHR request wrapper that will detect when a request fails because an OAuth2 token has expired, and will try to refresh the token then retry the request.
| paddy@0 | 1 fieldset { |
| paddy@0 | 2 background-color: lighten($base-border-color, 10%); |
| paddy@0 | 3 border: $base-border; |
| paddy@0 | 4 margin: 0 0 $small-spacing; |
| paddy@0 | 5 padding: $base-spacing; |
| paddy@0 | 6 } |
| paddy@0 | 7 |
| paddy@0 | 8 input, |
| paddy@0 | 9 label, |
| paddy@0 | 10 select { |
| paddy@0 | 11 display: block; |
| paddy@0 | 12 font-family: $base-font-family; |
| paddy@0 | 13 font-size: $base-font-size; |
| paddy@0 | 14 } |
| paddy@0 | 15 |
| paddy@0 | 16 label { |
| paddy@0 | 17 font-weight: 600; |
| paddy@0 | 18 margin-bottom: $small-spacing / 2; |
| paddy@0 | 19 |
| paddy@0 | 20 &.required::after { |
| paddy@0 | 21 content: "*"; |
| paddy@0 | 22 } |
| paddy@0 | 23 |
| paddy@0 | 24 abbr { |
| paddy@0 | 25 display: none; |
| paddy@0 | 26 } |
| paddy@0 | 27 } |
| paddy@0 | 28 |
| paddy@0 | 29 #{$all-text-inputs}, |
| paddy@0 | 30 select[multiple=multiple], |
| paddy@0 | 31 textarea { |
| paddy@0 | 32 background-color: $base-background-color; |
| paddy@0 | 33 border: $base-border; |
| paddy@0 | 34 border-radius: $base-border-radius; |
| paddy@0 | 35 box-shadow: $form-box-shadow; |
| paddy@0 | 36 box-sizing: border-box; |
| paddy@0 | 37 font-family: $base-font-family; |
| paddy@0 | 38 font-size: $base-font-size; |
| paddy@0 | 39 margin-bottom: $base-spacing / 2; |
| paddy@0 | 40 padding: $base-spacing / 3; |
| paddy@0 | 41 transition: border-color; |
| paddy@0 | 42 width: 100%; |
| paddy@0 | 43 |
| paddy@0 | 44 &:hover { |
| paddy@0 | 45 border-color: darken($base-border-color, 10%); |
| paddy@0 | 46 } |
| paddy@0 | 47 |
| paddy@0 | 48 &:focus { |
| paddy@0 | 49 border-color: $action-color; |
| paddy@0 | 50 box-shadow: $form-box-shadow-focus; |
| paddy@0 | 51 outline: none; |
| paddy@0 | 52 } |
| paddy@0 | 53 } |
| paddy@0 | 54 |
| paddy@0 | 55 textarea { |
| paddy@0 | 56 resize: vertical; |
| paddy@0 | 57 } |
| paddy@0 | 58 |
| paddy@0 | 59 input[type="search"] { |
| paddy@0 | 60 @include appearance(none); |
| paddy@0 | 61 } |
| paddy@0 | 62 |
| paddy@0 | 63 input[type="checkbox"], |
| paddy@0 | 64 input[type="radio"] { |
| paddy@0 | 65 display: inline; |
| paddy@0 | 66 margin-right: $small-spacing / 2; |
| paddy@0 | 67 } |
| paddy@0 | 68 |
| paddy@0 | 69 input[type="file"] { |
| paddy@0 | 70 padding-bottom: $small-spacing; |
| paddy@0 | 71 width: 100%; |
| paddy@0 | 72 } |
| paddy@0 | 73 |
| paddy@0 | 74 select { |
| paddy@0 | 75 margin-bottom: $base-spacing; |
| paddy@0 | 76 max-width: 100%; |
| paddy@0 | 77 width: auto; |
| paddy@0 | 78 } |