2018-10-19 15:17:02 +00:00
|
|
|
%toggle-button {
|
2021-10-07 18:21:11 +00:00
|
|
|
border-radius: var(--decor-radius-100);
|
2018-10-19 15:17:02 +00:00
|
|
|
cursor: pointer;
|
|
|
|
}
|
2019-06-14 17:27:37 +00:00
|
|
|
%toggle-button-intent {
|
2021-10-07 18:21:11 +00:00
|
|
|
background-color: rgb(var(--tone-gray-050));
|
2019-06-14 17:27:37 +00:00
|
|
|
}
|
|
|
|
%toggle-button-active {
|
2021-10-07 18:21:11 +00:00
|
|
|
background-color: rgb(var(--tone-gray-100));
|
2019-06-14 17:27:37 +00:00
|
|
|
}
|
2018-10-19 15:17:02 +00:00
|
|
|
%toggle-button:hover,
|
|
|
|
%toggle-button:focus {
|
2019-06-14 17:27:37 +00:00
|
|
|
@extend %toggle-button-intent;
|
2018-10-19 15:17:02 +00:00
|
|
|
}
|
|
|
|
%toggle-button:active {
|
2019-06-14 17:27:37 +00:00
|
|
|
@extend %toggle-button-active;
|
2018-10-19 15:17:02 +00:00
|
|
|
}
|