Apply hover effect to main window buttons

This commit is contained in:
Matthias Metelka 2022-11-01 14:08:06 +01:00
parent 40a069e028
commit 551ca842fe
2 changed files with 9 additions and 4 deletions

View file

@ -3,7 +3,7 @@
@use "root-vars";
@use "sass/vars" as *;
@use "sass/elevation";
@use "sass/elevation" as *;
@use "sass/button-mixins" as button;
#header {
@ -18,9 +18,9 @@
@include button.base($with-hover: false, $with-active: false);
overflow: hidden;
padding: 0;
@include elevation.elevation(1, $opacity-boost: -0.08);
@include elevation(1, $opacity-boost: -0.08);
&:hover {
@include elevation.elevation(2);
@include elevation(2);
transition: box-shadow 0.2s linear;
}
}

View file

@ -25,9 +25,14 @@
button {
outline: none !important;
@include button.base;
@include elevation(1);
border-radius: var(--border-radius-large);
padding: 8px 10px;
font-weight: 500;
margin: 0 4px;
@include elevation(1, $opacity-boost: -0.08);
&:hover {
@include elevation(2);
transition: box-shadow 0.2s linear;
}
}