diff options
Diffstat (limited to 'client/src/sass/include')
-rw-r--r-- | client/src/sass/include/_mixins.scss | 28 |
1 files changed, 23 insertions, 5 deletions
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index ab9f982a2..003936bc3 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss | |||
@@ -175,11 +175,8 @@ | |||
175 | 175 | ||
176 | @mixin grey-button { | 176 | @mixin grey-button { |
177 | @include button-focus($grey-button-outline-color); | 177 | @include button-focus($grey-button-outline-color); |
178 | 178 | background-color: $grey-background-color; | |
179 | &, &:active, &:focus { | 179 | color: pvar(--greyForegroundColor); |
180 | background-color: $grey-background-color; | ||
181 | color: pvar(--greyForegroundColor); | ||
182 | } | ||
183 | 180 | ||
184 | &:hover, &:active, &:focus, &[disabled], &.disabled { | 181 | &:hover, &:active, &:focus, &[disabled], &.disabled { |
185 | color: pvar(--greyForegroundColor); | 182 | color: pvar(--greyForegroundColor); |
@@ -195,6 +192,27 @@ | |||
195 | } | 192 | } |
196 | } | 193 | } |
197 | 194 | ||
195 | @mixin danger-button { | ||
196 | $color: lighten($color: #c54130, $amount: 10); | ||
197 | $text: #fff6f5; | ||
198 | |||
199 | @include button-focus(scale-color($color, $alpha: -95%)); | ||
200 | background-color: $color; | ||
201 | color: $text; | ||
202 | |||
203 | &:hover, &:active, &:focus, &[disabled], &.disabled { | ||
204 | background-color: lighten($color: $color, $amount: 10); | ||
205 | } | ||
206 | |||
207 | &[disabled], &.disabled { | ||
208 | cursor: default; | ||
209 | } | ||
210 | |||
211 | my-global-icon { | ||
212 | @include apply-svg-color($text) | ||
213 | } | ||
214 | } | ||
215 | |||
198 | @mixin peertube-button { | 216 | @mixin peertube-button { |
199 | border: none; | 217 | border: none; |
200 | font-weight: $font-semibold; | 218 | font-weight: $font-semibold; |