_button.scss
4 years ago
_checkbox.scss
4 years ago
_currencyswitcher.scss
4 years ago
_donate-now.scss
4 years ago
_donation-amount.scss
4 years ago
_donation-summary.scss
4 years ago
_errors-notices.scss
3 years ago
_ffm.scss
4 years ago
_fn.scss
4 years ago
_funds.scss
4 years ago
_grid.scss
4 years ago
_header.scss
4 years ago
_icons.scss
4 years ago
_label.scss
4 years ago
_legacy-consumer.scss
4 years ago
_page.scss
4 years ago
_payment-details.scss
4 years ago
_personal-info.scss
4 years ago
_radio.scss
4 years ago
_receipt.scss
4 years ago
_reset.scss
4 years ago
_section.scss
4 years ago
_stripe-checkout-modal.scss
4 years ago
_terms.scss
4 years ago
_text-input.scss
4 years ago
_tooltip.scss
4 years ago
_tributes.scss
4 years ago
_variables.scss
4 years ago
form.scss
4 years ago
variables.php
4 years ago
_text-input.scss
68 lines
| 1 | @mixin give-input { |
| 2 | inline-size: 100%; |
| 3 | padding: 1.1875rem; |
| 4 | border: 0.078rem solid #666; |
| 5 | border-radius: 0.25rem; |
| 6 | box-shadow: inset 0 0.08em 0.4em rgba(0, 0, 0, 0.15); |
| 7 | background-color: #fff; |
| 8 | color: #828382; |
| 9 | font-size: 1rem; |
| 10 | font-family: inherit; |
| 11 | font-weight: 500; |
| 12 | line-height: 1.2; |
| 13 | |
| 14 | &:focus, |
| 15 | &.focus { |
| 16 | outline: 0.125rem solid var(--give-primary-color); |
| 17 | } |
| 18 | } |
| 19 | |
| 20 | .give-label { |
| 21 | display: flex; |
| 22 | padding-block: 10px; |
| 23 | padding-inline: 0; |
| 24 | |
| 25 | .give-required-indicator { |
| 26 | margin-inline-start: 5px; |
| 27 | color: #a00; |
| 28 | } |
| 29 | } |
| 30 | |
| 31 | // prettier-ignore |
| 32 | .give-square-cc-fields, |
| 33 | .give-stripe-single-cc-field-wrap, |
| 34 | .give-input-field-wrapper, |
| 35 | .give-select, |
| 36 | :where( |
| 37 | .form-row, |
| 38 | .give-gateway-details |
| 39 | ) |
| 40 | :where( |
| 41 | input[type='text'], |
| 42 | input[type='tel'], |
| 43 | input[type='email'], |
| 44 | input[type='url'], |
| 45 | input[type='password'], |
| 46 | textarea, |
| 47 | select, |
| 48 | .give-select, |
| 49 | .give-stripe-cc-field |
| 50 | ):not(#give-amount) |
| 51 | { |
| 52 | @include give-input; |
| 53 | } |
| 54 | |
| 55 | .form-row select, |
| 56 | .give-select, |
| 57 | .give-gateway-details select { |
| 58 | -moz-appearance: none; |
| 59 | -webkit-appearance: none; |
| 60 | appearance: none; |
| 61 | background-color: #fff; |
| 62 | background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='13' height='8' viewBox='0 0 13 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.66016 7.19531C5.90625 7.44141 6.31641 7.44141 6.5625 7.19531L11.8945 1.89062C12.1406 1.61719 12.1406 1.20703 11.8945 0.960938L11.2656 0.332031C11.0195 0.0859375 10.6094 0.0859375 10.3359 0.332031L6.125 4.54297L1.88672 0.332031C1.61328 0.0859375 1.20312 0.0859375 0.957031 0.332031L0.328125 0.960938C0.0820312 1.20703 0.0820312 1.61719 0.328125 1.89062L5.66016 7.19531Z' fill='%23A2A3A2'/%3E%3C/svg%3E"), |
| 63 | linear-gradient(to bottom, #fff 0%, #fff 100%); |
| 64 | background-repeat: no-repeat, repeat; |
| 65 | background-position: right 0.7em top 50%, 0 0; |
| 66 | background-size: 0.65em auto, 100%; |
| 67 | } |
| 68 |