|
48 | 48 | @mixin hxButton-weight($weight) { |
49 | 49 | @if $weight == primary { |
50 | 50 | @include hxButton--primary; |
51 | | - } |
52 | | - @else if $weight == secondary { |
| 51 | + } @else if $weight == secondary { |
53 | 52 | @include hxButton--secondary; |
54 | | - } |
55 | | - @else if $weight == tertiary { |
| 53 | + } @else if $weight == tertiary { |
56 | 54 | @include hxButton--tertiary; |
57 | | - } |
58 | | - @else { |
| 55 | + } @else { |
59 | 56 | // weightless (no additional styles) |
60 | 57 | } |
61 | 58 | } |
|
67 | 64 | @mixin hxButton-size($size) { |
68 | 65 | @if $size == small { |
69 | 66 | padding: 0.125rem 0.5rem; |
70 | | - } |
71 | | - @else if $size == medium { |
| 67 | + } @else if $size == medium { |
72 | 68 | font-size: 0.875rem; |
73 | 69 | padding: 0.5rem 0.75rem; |
74 | | - } |
75 | | - @else if $size == large { |
| 70 | + } @else if $size == large { |
76 | 71 | font-size: 1rem; |
77 | 72 | padding: 1rem; |
78 | | - } |
79 | | - @else { |
| 73 | + } @else { |
80 | 74 | // no additional styles |
81 | 75 | } |
82 | 76 | } |
|
109 | 103 |
|
110 | 104 | @mixin hxButton-active--primary { |
111 | 105 | background-color: $blue-900; |
112 | | - border-color: transparent; |
113 | 106 | color: $gray-0; |
114 | 107 | } |
115 | 108 |
|
116 | 109 | @mixin hxButton-disabled--primary { |
117 | 110 | background-color: $gray-500; |
118 | | - border-color: transparent; |
119 | 111 | color: $gray-0; |
120 | 112 | } |
121 | 113 |
|
|
126 | 118 |
|
127 | 119 | @mixin hxButton-hover--primary { |
128 | 120 | background-color: $blue-700; |
129 | | - border-color: transparent; |
130 | 121 | color: $gray-0; |
131 | 122 | } |
132 | 123 |
|
|
178 | 169 | color: $blue-700; |
179 | 170 | } |
180 | 171 |
|
181 | | - |
182 | 172 | /// ------------------------------------- /// |
183 | 173 | /// ---------- TERTIARY BUTTON ---------- /// |
184 | 174 | /// ------------------------------------- /// |
|
0 commit comments