diff options
author | 2021-08-26 15:04:19 -0700 | |
---|---|---|
committer | 2021-08-26 15:04:44 -0700 | |
commit | fdd701dd88529ee0d4911283e35be86b000ed1fc (patch) | |
tree | 61d450d04633eece1c12b350b9ef3512dc2fa7b7 /examples/docs/src/components/RightSidebar/ThemeToggleButton.css | |
parent | 84c18d3030c98b2770144a8a27d1cca7bbfedc1d (diff) | |
parent | 2e8db7ad2384b756894eac6be72bcf720f7f28fa (diff) | |
download | astro-fdd701dd88529ee0d4911283e35be86b000ed1fc.tar.gz astro-fdd701dd88529ee0d4911283e35be86b000ed1fc.tar.zst astro-fdd701dd88529ee0d4911283e35be86b000ed1fc.zip |
Merge branch 'okikio/main' (#1111)
Diffstat (limited to 'examples/docs/src/components/RightSidebar/ThemeToggleButton.css')
-rw-r--r-- | examples/docs/src/components/RightSidebar/ThemeToggleButton.css | 37 |
1 files changed, 37 insertions, 0 deletions
diff --git a/examples/docs/src/components/RightSidebar/ThemeToggleButton.css b/examples/docs/src/components/RightSidebar/ThemeToggleButton.css new file mode 100644 index 000000000..7de231d1b --- /dev/null +++ b/examples/docs/src/components/RightSidebar/ThemeToggleButton.css @@ -0,0 +1,37 @@ +.theme-toggle { + display: inline-flex; + align-items: center; + gap: 0.25em; + padding: 0.33em 0.67em; + border-radius: 99em; + background-color: var(--theme-code-inline-bg); +} + +.theme-toggle > label:focus-within { + outline: 2px solid transparent; + box-shadow: 0 0 0 0.08em var(--theme-accent), 0 0 0 0.12em white; +} + +.theme-toggle > label { + color: var(--theme-code-inline-text); + position: relative; + display: flex; + align-items: center; + justify-content: center; + opacity: 0.5; +} + +.theme-toggle .checked { + color: var(--theme-accent); + opacity: 1; +} + +input[name='theme-toggle'] { + position: absolute; + opacity: 0; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: -1; +} |