summaryrefslogtreecommitdiff
path: root/src/components/ToggleSwitch.module.css
diff options
context:
space:
mode:
authorHaishan <[email protected]>2019-04-14 22:56:14 +0800
committerHaishan <[email protected]>2019-04-14 22:56:14 +0800
commit7dac1d44c7b13184e4a1cbdb4113df2bb8db9d7e (patch)
tree44ca70a51497d5e0dddadaca384ee20541a157fe /src/components/ToggleSwitch.module.css
parent4a4f58c88a857d222fbd21749bfd7019eaee8659 (diff)
refactor: replace sass with postcss
Diffstat (limited to 'src/components/ToggleSwitch.module.css')
-rw-r--r--src/components/ToggleSwitch.module.css34
1 files changed, 34 insertions, 0 deletions
diff --git a/src/components/ToggleSwitch.module.css b/src/components/ToggleSwitch.module.css
new file mode 100644
index 0000000..78a2b41
--- /dev/null
+++ b/src/components/ToggleSwitch.module.css
@@ -0,0 +1,34 @@
+.ToggleSwitch {
+ user-select: none;
+ border: 1px solid #525252;
+ color: var(--color-text);
+ background: var(--color-toggle-bg);
+ display: flex;
+ position: relative;
+
+ input {
+ position: absolute;
+ left: 0;
+ opacity: 0;
+ }
+
+ label {
+ flex: 1;
+ z-index: 2;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 10px 0;
+ cursor: pointer;
+ }
+}
+
+.slider {
+ z-index: 1;
+ position: absolute;
+ display: block;
+ left: 0;
+ height: 100%;
+ transition: left 0.2s ease-out;
+ background: var(--color-toggle-selected);
+}