ducky/web

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

21:bc1478742a50 Go to Latest

ducky/web/src/styles/onboarding.scss

Implement subscriptions. Create a Subscription model and a Subscriptions collection, and attach them to the app context. Add a helper to our Profile model to retrieve the Subscription of that model. Still not sure this should be on the Profile--wouldn't it be better on the Me model? Isn't that generally where we would need it?

Download raw file
View source Diff to previous Annotate
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 }