dan/dribbblish-dynamic-theme
1
0
Fork 0
mirror of https://github.com/danbulant/dribbblish-dynamic-theme synced 2026-06-07 08:40:44 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

update / refactor styles a bit

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/styles/ContextMenu.scss
View file

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

2
src/styles/Fonts.scss
View file

@ -49,7 +49,7 @@ $font-weights: (
} }
// set font variables // 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; --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; --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); font-family: var(--glue-font-family);

5
src/styles/Info.scss
View file

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

56
src/styles/Inputs.scss
View file

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