UNPKG

promptlang

Version:

PromptLang — compile simple design prompts into HTML (Tailwind) and optionally use Gemini to translate freeform prompts into the DSL.

50 lines (41 loc) 2.09 kB
<!doctype html> <html class='bg-white text-gray-900 font-sans'> <head> <meta charset='utf-8'/> <meta name='viewport' content='width=device-width,initial-scale=1'/> <title>PromptLang Site</title> <link href='https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css' rel='stylesheet'/> </head> <body class='antialiased'> <div class='max-w-6xl mx-auto shadow-lg rounded-xl overflow-hidden'> <header class='flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-gray-800'> <div class='text-lg font-bold'>PromptLang</div> <nav class='hidden md:flex space-x-4'></nav> </header> <main class='px-6 py-20 text-center '> <div class='max-w-3xl mx-auto backdrop-blur-sm '> <h1 class='text-3xl md:text-5xl font-extrabold mb-4'>PromptLang Site</h1> <p class='text-md md:text-lg opacity-80 mb-6'></p> <div class='flex justify-center gap-3'> <a href='#' style='background:#06b6d4' class='px-6 py-2 rounded-md text-white font-medium inline-block'>Get Started</a> <a href='#' class='px-6 py-2 rounded-md border inline-block'>Learn More</a> </div> </div> </main> <section class='px-6 py-8'> <div class='grid gap-6 md:grid-cols-3 max-w-4xl mx-auto'><div class='p-6 rounded-lg border bg-white/60 dark:bg-gray-800/40 backdrop-blur-sm'> <h4 class='font-semibold mb-2'>Card 1</h4> <p class='text-sm opacity-80'>Short description.</p> </div><div class='p-6 rounded-lg border bg-white/60 dark:bg-gray-800/40 backdrop-blur-sm'> <h4 class='font-semibold mb-2'>Card 2</h4> <p class='text-sm opacity-80'>Short description.</p> </div><div class='p-6 rounded-lg border bg-white/60 dark:bg-gray-800/40 backdrop-blur-sm'> <h4 class='font-semibold mb-2'>Card 3</h4> <p class='text-sm opacity-80'>Short description.</p> </div></div> </section> <footer class='px-6 py-6 border-t border-gray-200 dark:border-gray-800 text-center text-sm opacity-80'> </footer> </div> </body> </html>