aboutsummaryrefslogtreecommitdiffstats
path: root/components/Control/TrueFalseSwitch.vue
diff options
context:
space:
mode:
authorLeonardo Bishop <me@leonardobishop.com>2024-03-10 01:31:42 +0000
committerLeonardo Bishop <me@leonardobishop.com>2024-03-10 01:31:42 +0000
commit71e4ad2c71efea471923ea47f01bfda841387f81 (patch)
treef08293fdc56b4eb2e3d0e520b79b4d8aad78924c /components/Control/TrueFalseSwitch.vue
parent4495c02c41b95ce6df0c34dbf6ac62f7addae7a3 (diff)
Use nuxt auto import magic
Diffstat (limited to 'components/Control/TrueFalseSwitch.vue')
-rw-r--r--components/Control/TrueFalseSwitch.vue54
1 files changed, 0 insertions, 54 deletions
diff --git a/components/Control/TrueFalseSwitch.vue b/components/Control/TrueFalseSwitch.vue
deleted file mode 100644
index a0a3392..0000000
--- a/components/Control/TrueFalseSwitch.vue
+++ /dev/null
@@ -1,54 +0,0 @@
-<script setup lang="ts">
-import { ref } from 'vue';
-
-const props = defineProps<{
- value: boolean;
-}>();
-const emit = defineEmits(['update']);
-
-const value = ref(props.value);
-
-const invert = () => {
- value.value = !value.value;
- emit('update', value.value);
-};
-</script>
-
-<template>
- <div class="switch" @click="invert">
- <span v-if="value" class="true"><font-awesome-icon :icon="['fas', 'fa-check']" /> True</span>
- <span v-else class="false"><font-awesome-icon :icon="['fas', 'fa-xmark']" /> False</span>
- </div>
-</template>
-
-<style scoped>
-.switch {
- display: flex;
- width: 100%;
- height: 100%;
- cursor: pointer;
- align-items: center;
- padding: 0.5rem;
- user-select: none;
- transition: background-color 0.3s;
- background-color: var(--color-background-soft);
-
- span {
- font-family: monospace;
- font-size: 0.8rem;
- }
-
- .true {
- color: var(--color-text-primary);
- }
-
- .false {
- color: var(--color-false);
- }
-
- &:hover {
- background-color: var(--color-hover);
- }
-}
-
-</style> \ No newline at end of file