style.scss
35 lines
| 1 | /* stylelint-disable selector-class-pattern */ |
| 2 | |
| 3 | .give-donor-dashboard-button { |
| 4 | margin: 20px 0; |
| 5 | font-family: Montserrat, Arial, Helvetica, sans-serif; |
| 6 | padding: 12px 20px; |
| 7 | font-size: 16px; |
| 8 | font-weight: 600; |
| 9 | border: 1px solid var(--give-donor-dashboard-accent-color); |
| 10 | border-radius: 3px; |
| 11 | display: inline-flex; |
| 12 | align-items: center; |
| 13 | box-shadow: 0 0 0 0 #7ec980, 0 0 0 0 #4fa651; |
| 14 | transition: box-shadow 0.1s ease, background-color ease-in 0.3s; |
| 15 | cursor: pointer; |
| 16 | |
| 17 | svg { |
| 18 | margin-left: 8px; |
| 19 | } |
| 20 | |
| 21 | &:focus { |
| 22 | box-shadow: 0 0 0 1px #7ec980, 0 0 0 2px #4fa651; |
| 23 | } |
| 24 | |
| 25 | &:disabled { |
| 26 | border: 1px solid #bbb; |
| 27 | background: #d0d0d0 !important; |
| 28 | } |
| 29 | |
| 30 | &.give-donor-dashboard-button--primary { |
| 31 | color: #fff !important; |
| 32 | background: var(--give-donor-dashboard-accent-color); |
| 33 | } |
| 34 | } |
| 35 |