aboutsummaryrefslogtreecommitdiff
path: root/src_frontend/Components/Notifs/NotifsWrapper.svelte
diff options
context:
space:
mode:
authorJakob Stendahl <jakob.stendahl@outlook.com>2021-09-19 19:43:11 +0200
committerJakob Stendahl <jakob.stendahl@outlook.com>2021-09-19 19:43:11 +0200
commit7bdce37fd3f18e2712e18c4e2c64cac69af0aca1 (patch)
treeb7ad3f1cca92e2dfd2664ae9e65652bd03ff58b2 /src_frontend/Components/Notifs/NotifsWrapper.svelte
parente6880cd8ccf82d993f222cb14b4860581654acb8 (diff)
downloadLuxcena-Neo-7bdce37fd3f18e2712e18c4e2c64cac69af0aca1.tar.gz
Luxcena-Neo-7bdce37fd3f18e2712e18c4e2c64cac69af0aca1.zip
:boom: Introduce new UI based on svelte, and rewrite a lot of the node app and the NeoRuntime
Diffstat (limited to 'src_frontend/Components/Notifs/NotifsWrapper.svelte')
-rw-r--r--src_frontend/Components/Notifs/NotifsWrapper.svelte33
1 files changed, 33 insertions, 0 deletions
diff --git a/src_frontend/Components/Notifs/NotifsWrapper.svelte b/src_frontend/Components/Notifs/NotifsWrapper.svelte
new file mode 100644
index 0000000..e68e2e2
--- /dev/null
+++ b/src_frontend/Components/Notifs/NotifsWrapper.svelte
@@ -0,0 +1,33 @@
+<script>
+ import { notifs } from "../../stores/notifs";
+ import Notif from "./Notif.svelte";
+ export let position = "bottom-center";
+ $: transitionType = position === "bottom-center" ? "fade" : "fly";
+</script>
+
+<style>
+.notifications {
+ position: absolute;
+ z-index: 999;
+}
+.bottom-center {
+ bottom: 20px;
+ left: 5vw;
+ width: 90vw;
+}
+.top-right {
+ top: 20px;
+ right: 20px;
+}
+</style>
+
+<div class="notifications {position}">
+{#each $notifs as notification (notification.id)}
+ <Notif
+ nid={notification.id}
+ text={notification.text}
+ title={notification.title}
+ type={notification.type}
+ {transitionType} />
+{/each}
+</div> \ No newline at end of file