aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/Control/Modal.vue
diff options
context:
space:
mode:
authorLeonardo Bishop <me@leonardobishop.com>2024-03-10 00:13:25 +0000
committerLeonardo Bishop <me@leonardobishop.com>2024-03-10 00:13:25 +0000
commit9a11e0f4a38297006b89cc7bb2a60734111582e0 (patch)
tree5ebddde79e67b659714b5dbdbfcea289f06a4ae5 /src/components/Control/Modal.vue
parent817478f3cf357fc09778d9dc3cf67a667e21f042 (diff)
Migrate to nuxt
Diffstat (limited to 'src/components/Control/Modal.vue')
-rw-r--r--src/components/Control/Modal.vue68
1 files changed, 0 insertions, 68 deletions
diff --git a/src/components/Control/Modal.vue b/src/components/Control/Modal.vue
deleted file mode 100644
index 46d5da5..0000000
--- a/src/components/Control/Modal.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-<script setup lang="ts">
-const model = defineModel();
-
-</script>
-
-<template>
- <div id="modal" class="modal" :class="{ 'is-active': model }">
- <div class="modal-background" @click="model = false"></div>
- <div class="modal-content">
- <div class="header" v-if="$slots.header">
- <slot name="header" />
- </div>
- <slot name="body" />
- <slot />
- </div>
- </div>
-</template>
-
-<style scoped>
-#modal {
- align-items: center;
- justify-content: center;
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- z-index: 1000;
- background-color: rgba(0, 0, 0, 0.5);
- transition: opacity 0.3s;
- display: none;
- overflow: visible;
-}
-
-.modal-content {
- background-color: var(--color-background);
- border: 1px solid var(--color-border);
- padding: 1rem;
- width: 100%;
- max-width: 600px;
- max-height: 80%;
- overflow-y: visible;
- border-radius: 4px;
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
-}
-
-.modal-background {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background-color: rgba(0, 0, 0, 0.5);
- z-index: -1;
-}
-
-.is-active {
- opacity: 1 !important;
- pointer-events: all !important;
- display: flex !important;
-}
-
-.header {
- border-bottom: 1px solid var(--color-border);
- margin-bottom: 1rem;
-}
-
-</style> \ No newline at end of file