ducky/web

Paddy 2015-07-07 Parent:e9e0a28a7419 Child:21f80f56cda9

20:13d27b50d79e Go to Latest

ducky/web/src/styles/onboarding.scss

Remove local-storage wrapper, minor updates to Me model. No longer use our local-storage helper (remove it entirely), as we're no longer going to be a Chrome app. So let's just always rely on localStorage. Update our Me URL to use the nginx-fronted URL. Add an email property to our Me model, to keep track of the email we logged in with. This is mostly used for setting up our subscription, and should be deprecated in the future.

History
paddy@0 1 @import "bourbon";
paddy@0 2 @Import "neat";
paddy@0 3 @import "base/base";
paddy@0 4 @import "hero";
paddy@0 5 @import "button";
paddy@0 6
paddy@0 7 .onboarding {
paddy@0 8 $content-max-width: 600px;
paddy@0 9 $content-width: 100%;
paddy@0 10
paddy@0 11 padding: 1.5em;
paddy@0 12 font-size: 1.25em;
paddy@0 13 max-width: $content-max-width;
paddy@0 14 width: $content-width;
paddy@0 15 margin: 0px auto;
paddy@0 16
paddy@0 17 ul, ol {
paddy@0 18 list-style-type: square;
paddy@0 19 }
paddy@0 20
paddy@9 21 #{$all-text-inputs}, label, select {
paddy@0 22 display: inline-block;
paddy@0 23 }
paddy@0 24
paddy@0 25 label {
paddy@0 26 max-width: 35%;
paddy@0 27 }
paddy@0 28
paddy@9 29 #{$all-text-inputs}, select {
paddy@0 30 width: 65%;
paddy@0 31 }
paddy@0 32
paddy@0 33 &.register {
paddy@9 34 #{$all-text-inputs}, select {
paddy@0 35 width: 60%;
paddy@0 36 }
paddy@0 37
paddy@0 38 label {
paddy@0 39 width: 35%;
paddy@0 40 text-align: right;
paddy@0 41 padding-right: 1em;
paddy@0 42 }
paddy@0 43
paddy@0 44 form {
paddy@0 45 font-size: 75%;
paddy@0 46 margin: 0px auto;
paddy@0 47 }
paddy@0 48 }
paddy@2 49 &.payment {
paddy@9 50 #{$all-text-inputs}, select {
paddy@2 51 width: 60%;
paddy@2 52 }
paddy@2 53
paddy@9 54 select {
paddy@9 55 font-size: 1.5em;
paddy@9 56 }
paddy@9 57
paddy@2 58 input.expiration {
paddy@2 59 width: 10%;
paddy@2 60 }
paddy@2 61
paddy@2 62 label.expiration {
paddy@2 63 max-width: 20%;
paddy@2 64 margin-left: 2%;
paddy@2 65 margin-right: 2%;
paddy@2 66 }
paddy@2 67
paddy@2 68 input.month {
paddy@2 69 margin-right: 1%;
paddy@2 70 }
paddy@2 71
paddy@2 72 input.year {
paddy@2 73 margin-left: 1%;
paddy@2 74 }
paddy@2 75
paddy@2 76 input.cvc {
paddy@2 77 width: 13%;
paddy@2 78 }
paddy@2 79
paddy@2 80 label {
paddy@2 81 width: 35%;
paddy@2 82 text-align: right;
paddy@2 83 padding-right: 1em;
paddy@2 84 }
paddy@2 85
paddy@9 86 select.plan {
paddy@9 87 margin-bottom: 0.5em;
paddy@9 88 }
paddy@9 89
paddy@2 90 form {
paddy@2 91 font-size: 75%;
paddy@2 92 margin: 0px auto;
paddy@2 93 }
paddy@2 94 }
paddy@0 95 &.login {
paddy@0 96 label {
paddy@0 97 width: 25%;
paddy@0 98 text-align: right;
paddy@0 99 padding-right: 1em;
paddy@0 100 }
paddy@0 101
paddy@0 102 form {
paddy@0 103 font-size: 85%;
paddy@0 104 margin: 0px auto;
paddy@0 105 }
paddy@0 106 }
paddy@0 107 }
paddy@0 108
paddy@0 109 .hero img.settings-toggle {
paddy@0 110 width: 1.25em;
paddy@0 111 top: 0px;
paddy@0 112 float: right;
paddy@0 113 margin: 1em;
paddy@0 114 cursor: pointer;
paddy@0 115 }
paddy@0 116
paddy@0 117 .actionbuttons {
paddy@0 118 padding-top: 1em;
paddy@0 119 text-align: center;
paddy@0 120 max-width: 400px;
paddy@0 121 margin: 0px auto;
paddy@0 122
paddy@0 123 button {
paddy@0 124 min-width: 48%;
paddy@0 125 margin: 0px 1%;
paddy@0 126 }
paddy@0 127
paddy@0 128 button:focus {
paddy@0 129 outline: none;
paddy@0 130 }
paddy@0 131 }