mirror of
https://github.com/facebook/docusaurus.git
synced 2025-07-16 00:06:11 +02:00
refactor(v2): adjust dark mode toggle to site style (#3774)
This commit is contained in:
parent
61fd53f7c0
commit
7d540a87d7
1 changed files with 2 additions and 8 deletions
|
@ -24,11 +24,9 @@
|
|||
*/
|
||||
:global(.react-toggle) {
|
||||
touch-action: pan-x;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
|
@ -61,7 +59,6 @@
|
|||
top: 0px;
|
||||
bottom: 0px;
|
||||
margin: auto 0;
|
||||
line-height: 0;
|
||||
left: 8px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.25s ease;
|
||||
|
@ -80,7 +77,6 @@
|
|||
top: 0px;
|
||||
bottom: 0px;
|
||||
margin: auto 0;
|
||||
line-height: 0;
|
||||
right: 10px;
|
||||
opacity: 1;
|
||||
transition: opacity 0.25s ease;
|
||||
|
@ -92,7 +88,6 @@
|
|||
}
|
||||
|
||||
:global(.react-toggle-thumb) {
|
||||
transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
left: 1px;
|
||||
|
@ -107,13 +102,12 @@
|
|||
:global([data-theme='dark'] .react-toggle .react-toggle-thumb),
|
||||
:global(.react-toggle--checked .react-toggle-thumb) {
|
||||
left: 27px;
|
||||
border-color: #19ab27;
|
||||
}
|
||||
|
||||
:global(.react-toggle--focus .react-toggle-thumb) {
|
||||
box-shadow: 0px 0px 2px 3px #0099e0;
|
||||
box-shadow: 0px 0px 2px 3px var(--ifm-color-primary);
|
||||
}
|
||||
|
||||
:global(.react-toggle:active:not(.react-toggle--disabled) .react-toggle-thumb) {
|
||||
box-shadow: 0px 0px 5px 5px #0099e0;
|
||||
box-shadow: 0px 0px 5px 5px var(--ifm-color-primary);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue