aboutsummaryrefslogtreecommitdiff
path: root/src/components/checkbox/checkbox.vue
diff options
context:
space:
mode:
authortusooa <tusooa@kazv.moe>2023-01-22 09:34:01 -0500
committertusooa <tusooa@kazv.moe>2023-01-22 09:34:01 -0500
commitb1e75c25bd50180e715afde70c6e659e7509a3f3 (patch)
treef5d529d81b4bfa98009e39e7c37d64132d316592 /src/components/checkbox/checkbox.vue
parent6649baaac94348bbf09015eeb2c8eeea714096db (diff)
parent0d6435261ef3e91c06fe34cc8bf72ff1b30078c2 (diff)
Merge remote-tracking branch 'upstream/develop' into birthdays
Diffstat (limited to 'src/components/checkbox/checkbox.vue')
-rw-r--r--src/components/checkbox/checkbox.vue16
1 files changed, 8 insertions, 8 deletions
diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index b6768d67..7139d4fc 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -32,7 +32,7 @@ export default {
</script>
<style lang="scss">
-@import '../../_variables.scss';
+@import "../../variables";
.checkbox {
position: relative;
@@ -49,13 +49,13 @@ export default {
right: 0;
top: 0;
display: block;
- content: '✓';
+ content: "✓";
transition: color 200ms;
width: 1.1em;
height: 1.1em;
border-radius: $fallback--checkboxRadius;
border-radius: var(--checkboxRadius, $fallback--checkboxRadius);
- box-shadow: 0px 0px 2px black inset;
+ box-shadow: 0 0 2px black inset;
box-shadow: var(--inputShadow);
background-color: $fallback--fg;
background-color: var(--input, $fallback--fg);
@@ -71,15 +71,16 @@ export default {
&.disabled {
.checkbox-indicator::before,
.label {
- opacity: .5;
+ opacity: 0.5;
}
+
.label {
color: $fallback--faint;
color: var(--faint, $fallback--faint);
}
}
- input[type=checkbox] {
+ input[type="checkbox"] {
display: none;
&:checked + .checkbox-indicator::before {
@@ -88,15 +89,14 @@ export default {
}
&:indeterminate + .checkbox-indicator::before {
- content: '–';
+ content: "–";
color: $fallback--text;
color: var(--inputText, $fallback--text);
}
-
}
& > span {
- margin-left: .5em;
+ margin-left: 0.5em;
}
}
</style>