Sonner Toast Demo

\n \n \n \n \n \n

\n \n

\n View source\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n \n \n \n Sonner Toast Demo\n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\nconst css = `\n body {\n font-family: system-ui, sans-serif;\n background-color: #f0f0f0;\n margin: 0;\n padding: 0;\n }\n .container {\n max-width: 600px;\n margin: 2rem auto;\n padding: 2rem;\n background-color: white;\n border-radius: 8px;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n }\n h1 {\n text-align: center;\n color: #333;\n }\n .button-container {\n display: flex;\n flex-wrap: wrap;\n gap: 1rem;\n justify-content: center;\n margin-top: 2rem;\n }\n button {\n padding: 0.5rem 1rem;\n font-size: 1rem;\n background-color: #007bff;\n color: white;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n transition: background-color 0.2s;\n }\n button:hover {\n background-color: #0056b3;\n }\n p {\n text-align: center;\n margin-top: 2rem;\n }\n a {\n color: #007bff;\n text-decoration: none;\n }\n a:hover {\n text-decoration: underline;\n }\n`;","deleted","label",[98],"permalink","https://www.val.town/x/vawogbemi/sonnerDemo/code/main.tsx","extension","actionData","errors"]