update / refactor styles a bit

This commit is contained in:
Send_Nukez 2021-11-27 10:11:55 +01:00
parent 9994713e55
commit 7c2fbea06f
4 changed files with 41 additions and 24 deletions

View file

@ -14,7 +14,6 @@
background-color: spiceColor("main", 0.75, -0.1) !important;
backdrop-filter: blur(10px);
border-radius: var(--main-corner-radius);
box-shadow: 0px 0px 8px spiceColor("subtext", 0.1, 0.1);
@include spiceShadow();
}
@ -24,7 +23,6 @@
color: spiceColor("subtext") !important;
&:hover,
&:focus,
&:active,
&[aria-expanded="true"] {
background-color: spiceColor("subtext", 0.1, 0.3);

View file

@ -49,7 +49,7 @@ $font-weights: (
}
// set font variables
body {
:root {
--glue-font-family: #{map-get($font-names, "glue")}, #{map-get($font-names, "info")}, spotify-circular, spotify-circular-cyrillic, spotify-circular-arabic, spotify-circular-hebrew, Helvetica Neue, helvetica, arial, Hiragino Kaku Gothic Pro, Meiryo, MS Gothic, sans-serif;
--info-font-family: #{map-get($font-names, "info")}, spotify-circular, spotify-circular-cyrillic, spotify-circular-arabic, spotify-circular-hebrew, Helvetica Neue, helvetica, arial, Hiragino Kaku Gothic Pro, Meiryo, MS Gothic, sans-serif;
font-family: var(--glue-font-family);

View file

@ -28,10 +28,5 @@
padding: 0px;
aspect-ratio: 1/1;
}
& svg {
width: 1em;
height: 1em;
}
}
}

View file

@ -1,24 +1,48 @@
button.main-button-primary {
background-color: spiceColor("selected-row", 0.4) !important;
button.main-button {
&-primary {
$color: spiceColor("subtext");
color: $color;
background-color: spiceColor("selected-row", 0.4) !important;
&:hover,
&:active {
background-color: spiceColor("selected-row", 0.6) !important;
&:hover,
&:active {
background-color: spiceColor("selected-row", 0.6) !important;
}
span {
color: $color !important;
}
}
span {
color: spiceColor("subtext") !important;
}
}
// ? Don't know if this exists
// &-secondary {
// $color: spiceColor("subtext");
// color: $color;
// background-color: spiceColor("selected-row", 0.4) !important;
// Modals
.GenericModal button.main-button-primary {
background-color: spiceColor("subtext", 0.6) !important;
color: spiceColor("main") !important;
// &:hover,
// &:active {
// background-color: spiceColor("selected-row", 0.6) !important;
// }
&:hover,
&:active {
background-color: spiceColor("subtext") !important;
// span {
// color: $color !important;
// }
// }
&-tertiary {
$color: spiceColor("subtext");
color: $color;
background-color: spiceColor("selected-row", 0.2, 0.05) !important;
&:hover,
&:active {
background-color: spiceColor("selected-row", 0.6) !important;
}
span {
color: $color !important;
}
}
}