| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 1 | .btn { |
| 2 | font-weight: $headings-font-weight; | ||||
| Derick Montague | 3f6710a | 2020-03-04 00:59:47 -0600 | [diff] [blame] | 3 | padding-top: $spacer / 2; |
| 4 | padding-right: $spacer; | ||||
| 5 | padding-bottom: $spacer / 2; | ||||
| 6 | padding-left: $spacer; | ||||
| 7 | |||||
| 8 | // Buttons with SVGs and text expect | ||||
| 9 | // text to be wrapped in a span element | ||||
| 10 | svg + span { | ||||
| 11 | margin-left: $spacer / 4; | ||||
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 12 | } |
| 13 | } | ||||
| 14 | |||||
| 15 | .btn-primary { | ||||
| Derick Montague | 7f970a1 | 2020-03-02 17:56:09 -0600 | [diff] [blame] | 16 | fill: currentColor; |
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 17 | } |
| 18 | |||||
| 19 | .btn-secondary { | ||||
| Derick Montague | 7f970a1 | 2020-03-02 17:56:09 -0600 | [diff] [blame] | 20 | fill: currentColor; |
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 21 | } |
| 22 | |||||
| 23 | .btn-link { | ||||
| Yoshie Muranaka | 01da818 | 2020-07-08 15:46:43 -0700 | [diff] [blame] | 24 | fill: theme-color("primary"); |
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 25 | text-decoration: none !important; |
| Derick Montague | 3f6710a | 2020-03-04 00:59:47 -0600 | [diff] [blame] | 26 | |
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 27 | &:focus { |
| 28 | box-shadow: $btn-focus-box-shadow; | ||||
| 29 | } | ||||
| 30 | &:hover { | ||||
| Yoshie Muranaka | 01da818 | 2020-07-08 15:46:43 -0700 | [diff] [blame] | 31 | fill: darken(theme-color("primary"), 15%); |
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 32 | } |
| Derick Montague | 3f6710a | 2020-03-04 00:59:47 -0600 | [diff] [blame] | 33 | } |
| 34 | |||||
| 35 | .btn:disabled { | ||||
| Yoshie Muranaka | 01da818 | 2020-07-08 15:46:43 -0700 | [diff] [blame] | 36 | color: gray("600"); |
| Derick Montague | 3f6710a | 2020-03-04 00:59:47 -0600 | [diff] [blame] | 37 | fill: currentColor; |
| 38 | |||||
| 39 | &:not(.btn-link) { | ||||
| Yoshie Muranaka | 01da818 | 2020-07-08 15:46:43 -0700 | [diff] [blame] | 40 | border-color: gray("400"); |
| 41 | background-color: gray("400"); | ||||
| Derick Montague | 3f6710a | 2020-03-04 00:59:47 -0600 | [diff] [blame] | 42 | } |
| Yoshie Muranaka | 996d2d5 | 2019-12-30 09:06:45 -0800 | [diff] [blame] | 43 | } |