chore: use remote search
This commit is contained in:
parent
7a2a2aa951
commit
482e13569f
53 changed files with 1184 additions and 3735 deletions
50
src/assets/styles/components/theme-toggle.css
Normal file
50
src/assets/styles/components/theme-toggle.css
Normal file
|
@ -0,0 +1,50 @@
|
|||
theme-toggle {
|
||||
display: flex;
|
||||
width: var(--sizing-svg-base);
|
||||
height: var(--sizing-svg-base);
|
||||
margin-left: var(--spacing-md);
|
||||
}
|
||||
|
||||
.theme-toggle {
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
|
||||
& svg {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:hover svg,
|
||||
&:focus svg,
|
||||
&:focus-within svg,
|
||||
&:active svg {
|
||||
stroke: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
& > .light svg { stroke: var(--sun); }
|
||||
& > .dark svg { stroke: var(--moon); }
|
||||
|
||||
& > .light ,
|
||||
& > .dark {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="dark"] {
|
||||
& .theme-toggle > .light {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
& .theme-toggle > .dark {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="light"] {
|
||||
& .theme-toggle > .light {
|
||||
display: none;
|
||||
}
|
||||
|
||||
& .theme-toggle > .dark {
|
||||
display: inline;
|
||||
}
|
||||
}
|
Reference in a new issue