some more

This commit is contained in:
catto 2024-05-04 14:56:17 +02:00
parent d0719a36c8
commit 679acca384
2 changed files with 38 additions and 6 deletions

View File

@ -7,9 +7,10 @@
<link href="output.css" rel="stylesheet">
</head>
<body>
<body class="bg-gradient-to-t from-black to-fuchsia-800 w-full h-full min-h-screen">
<nav class="bg-gradient-to-l from-fuchsia-800 to-cyan-600 p-4">
<nav
class="bg-gradient-to-l from-fuchsia-800/90 to-cyan-600/90 p-4 drop-shadow-lg sticky top-0 z-50 backdrop-blur-sm">
<ul class="flex justify-center w-full">
<li class="ml-6">
<a href="#" class="text-white hover:text-gray-300"><code class="text-xl">SNOTES</code></a>
@ -20,12 +21,43 @@
</li>
</ul>
</nav>
<div class="container mx-auto bg-white dark:bg-slate-900 text-black dark:text-white">
<h1 class="text-4xl font-bold text-center mt-8">Welcome to My Website</h1>
<p class="text-lg text-center mt-4">This is a basic Tailwind CSS boilerplate.</p>
<div>
<div class="flex flex-col md:flex-row ml-10 mr-10 mt-20 justify-center items-center">
<div class="w-full md:w-full flex-grow">
<img src="screenshot.png" alt="Screenshot of the software" class="drop-shadow-lg">
</div>
<div
class="w-full md:w-1/2 bg-cyan-600/50 text-white p-8 rounded-lg ml-10 mr-10 sm:mt-10 sm:text-center backdrop-blur-sm drop-shadow-lg">
<h1
class="text-4xl font-bold mb-4 text-center bg-gradient-to-r from-purple-300 to-pink-200 text-transparent bg-clip-text">
Simple Notes</h1>
<p class="text-lg">Quickly create, paste, tag and search notes. No BS.</p>
</div>
</div>
</div>
<div class="grid grid-cols-2 gap-4 mt-10 mx-10">
<div class="bg-purple-500 p-4 rounded-lg">
<h2 class="text-white text-2xl font-bold mb-2">Free</h2>
<p class="text-white"><code>SNOTES</code> is free software.</p>
</div>
<div class="bg-pink-500 p-4 rounded-lg">
<h2 class="text-white text-2xl font-bold mb-2">Simple</h2>
<p class="text-white">Create and manage your notes with a simple and intuitive interface.</p>
</div>
<div class="bg-blue-500 p-4 rounded-lg">
<h2 class="text-white text-2xl font-bold mb-2">Fast</h2>
<p class="text-white">Everything from startup to search is lightning fast.</p>
</div>
<div class="bg-green-500 p-4 rounded-lg">
<h2 class="text-white text-2xl font-bold mb-2">OCR</h2>
<p class="text-white">Use Optical Character Recognition (OCR) to extract text from image files.</p>
</div>
<div class="bg-yellow-500 p-4 rounded-lg">
<h2 class="text-white text-2xl font-bold mb-2">Export</h2>
<p class="text-white">Export your notes in various formats such as TXT or Markdown.</p>
</div>
</div>
</body>
</html>

BIN
src/screenshot.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 47 KiB