diff options
Diffstat (limited to 'src/components/Control/TrueFalseSwitch.vue')
| -rw-r--r-- | src/components/Control/TrueFalseSwitch.vue | 54 |
1 files changed, 0 insertions, 54 deletions
diff --git a/src/components/Control/TrueFalseSwitch.vue b/src/components/Control/TrueFalseSwitch.vue deleted file mode 100644 index a0a3392..0000000 --- a/src/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 |
