fix(theme): switches take obsidian's toggle look, thumb visible on dark themes
This commit is contained in:
@@ -360,6 +360,29 @@
|
||||
.beaver-root [data-slot="select-content"]::before {
|
||||
display: none !important;
|
||||
}
|
||||
/* Obsidian's own toggle: border-hover track, accent when on, a white thumb. */
|
||||
.beaver-root [data-slot="switch"] {
|
||||
width: 40px !important;
|
||||
height: 20px !important;
|
||||
background: var(--background-modifier-border-hover) !important;
|
||||
border: 0 !important;
|
||||
border-radius: var(--toggle-radius, 18px) !important;
|
||||
}
|
||||
.beaver-root [data-slot="switch"][data-state="checked"] {
|
||||
background: var(--interactive-accent) !important;
|
||||
}
|
||||
.beaver-root [data-slot="switch-thumb"] {
|
||||
display: block !important;
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
margin-left: 2px !important;
|
||||
background: var(--toggle-thumb-color, white) !important;
|
||||
border-radius: 50% !important;
|
||||
box-shadow: var(--shadow-s) !important;
|
||||
}
|
||||
.beaver-root [data-slot="switch-thumb"][data-state="checked"] {
|
||||
transform: translateX(20px) !important;
|
||||
}
|
||||
.beaver-root [data-slot="button"][data-variant="default"],
|
||||
.beaver-root [data-slot="button"]:not([class*="bg-"]) {
|
||||
font-weight: var(--font-medium, 500) !important;
|
||||
|
||||
Reference in New Issue
Block a user