Add active style to theme switcher buttons, style tweaks

This commit is contained in:
daudix
2024-08-29 22:49:42 +03:00
parent d09e2b158c
commit fcf8cdd680
9 changed files with 100 additions and 27 deletions

View File

@ -128,6 +128,14 @@
color: var(--fg-muted-5);
font-weight: 800;
&:hover {
color: var(--fg-color);
.icon {
background-color: var(--fg-color);
}
}
&.active {
color: var(--primary-color);
@ -171,6 +179,11 @@
&:hover {
box-shadow: var(--edge-highlight);
background-color: var(--fg-muted-1);
color: var(--fg-muted-5);
.icon {
background-color: var(--fg-muted-5);
}
}
&:active {
@ -319,6 +332,22 @@
border-radius: 999px;
}
.active {
background-color: var(--primary-color-alpha);
.icon {
background-color: var(--primary-color);
}
&:hover {
background-color: var(--primary-color);
.icon {
background-color: var(--contrast-color);
}
}
}
#theme-system .icon,
.icon {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M8 0C3.594 0 0 3.594 0 8s3.594 8 8 8 8-3.594 8-8-3.594-8-8-8m0 1.941c3.36 0 6.059 2.7 6.059 6.059s-2.7 6.059-6.059 6.059zm0 0'/%3E%3C/svg%3E");