Created
September 16, 2024 19:26
-
-
Save PCreations/d228659c113190486a2ff284f5780f70 to your computer and use it in GitHub Desktop.
0ab626ffbc36.diff
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
-0,0 +1,39 @@ | |
+import * as elements from 'typed-html'; | |
+ | |
+export const Layout = ({ children }: elements.Attributes) => { | |
+ return ( | |
+ <html> | |
+ <head> | |
+ <title>Crafty Reads</title> | |
+ <meta charset="UTF-8" /> | |
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
+ <script src="https://cdn.tailwindcss.com"></script> | |
+ <script | |
+ src="https://unpkg.com/[email protected]" | |
+ integrity="sha384-QWGpdj554B4ETpJJC9z+ZHJcA/i59TyjxEPXiiUgN2WmTyV5OEZWCD6gQhgkdpB/" | |
+ crossorigin="anonymous" | |
+ ></script> | |
+ <script src="//unpkg.com/alpinejs" defer=""></script> | |
+ </head> | |
+ <body> | |
+ <main class="container mx-auto px-4 py-8">{children}</main> | |
+ <div | |
+ aria-live="assertive" | |
+ class="pointer-events-none fixed inset-0 flex items-end px-4 py-6 sm:items-start sm:p-6" | |
+ > | |
+ <div class="flex w-full flex-col items-center space-y-4 sm:items-end"> | |
+ <div | |
+ id="toast-container" | |
+ x-transition:enter="transform ease-out duration-300 transition" | |
+ x-transition:enter-start="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-2" | |
+ x-transition:enter-end="translate-y-0 opacity-100 sm:translate-x-0" | |
+ x-transition:leave="transition ease-in duration-100" | |
+ x-transition:leave-start="opacity-100" | |
+ x-transition:leave-end="opacity-0" | |
+ ></div> | |
+ </div> | |
+ </div> | |
+ </body> | |
+ </html> | |
+ ); | |
+}; | |
diff --git a/src/components/toast.tsx b/src/components/toast.tsx | |
new file mode 100644 | |
index 0000000..2598537 | |
--- /dev/null | |
+++ b/src/components/toast.tsx | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment