Files
@ cb5b5ec23fc2
Branch filter:
Location: website/www/conservancy/static/css/forms.css
cb5b5ec23fc2
1.8 KiB
text/css
supporter: Refactor amount-checking JavaScript.
* Separate out amount-parsing and reacting into separate events. This sets
the stage for other elements to react to the custom
'conservancy:newamount' event.
* Set up events in the context of each supporter form, with closures. This
lets us avoid weird CSS selector gymnastics in the event, and instead
drill down from the form to find the elements we need.
There are no functional changes in this code, barring bugs.
* Separate out amount-parsing and reacting into separate events. This sets
the stage for other elements to react to the custom
'conservancy:newamount' event.
* Set up events in the context of each supporter form, with closures. This
lets us avoid weird CSS selector gymnastics in the event, and instead
drill down from the form to find the elements we need.
There are no functional changes in this code, barring bugs.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 | .supporter-type-selection .prolog > span:first-child {
font-weight: bold;
}
.supporter-form-input {
margin-bottom: .5em;
white-space: nowrap;
}
.supporter-form-input label {
display: inline-block;
font-weight: bold;
white-space: normal;
}
.supporter-form-input input[name=amount],
.supporter-form-input input[name=a3] {
width: 5em;
}
.supporter-form-input input[type=radio] {
margin-left: 1em;
margin-right: .2em;
}
.supporter-form-input input[type=radio]:first-of-type {
margin-left: 0;
}
.supporter-form-submit {
text-align: center;
}
.form-error, .supporter-form-input .input-group p {
margin-left: 1em;
font-size: 80%;
white-space: normal;
}
.form-error {
color: red;
}
input.invalid, textarea.invalid {
border: 2px solid red;
}
input.valid, textarea.valid {
border: 2px solid green;
}
.supporter-type-selector {
clear: both;
font-size: 125%;
text-align: center;
}
h1.appeal {
margin-top: -.75em;
}
img.appeal-left {
float: left;
padding-right: 1em;
margin: .25em;
min-width: 8%;
max-width: 30%;
height: auto;
}
img.appeal-right {
float: right;
padding-left: 1em;
margin: .25em;
min-width: 8%;
max-width: 30%;
width: auto;
}
img.appeal {
float: left;
padding-right: 1em;
min-width: 10%;
max-width: 85%;
width: auto;
}
img.appeal-header {
max-width: 100%;
width: auto;
margin-top: 0em;
}
img.appeal-footer {
max-width: 40%;
float: right;
width: 10%;
min-width: 1%;
height: auto;
}
img.appeal-match {
float: left;
height: auto;
border: 1px solid #fff;
width: 10%;
margin-top: .25em;
margin-bottom: .25em;
margin-right: 1em;
background: #eee;
}
p.appeal-match-text {
width: 100%;
border: 1px solid #fff;
background: #eee;
}
|