1.btn { 2 font-weight: $headings-font-weight; 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; 12 } 13} 14 15.btn-primary { 16 fill: currentColor; 17} 18 19.btn-secondary { 20 fill: currentColor; 21} 22 23.btn-link { 24 fill: theme-color("primary"); 25 text-decoration: none !important; 26 27 &:focus { 28 box-shadow: $btn-focus-box-shadow; 29 } 30 &:hover { 31 fill: darken(theme-color("primary"), 15%); 32 } 33} 34 35.btn:disabled { 36 color: gray("600"); 37 fill: currentColor; 38 39 &:not(.btn-link) { 40 border-color: gray("400"); 41 background-color: gray("400"); 42 } 43}