85 lines
3.8 KiB
HTML
85 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<!-- (´･ω･`)? what's this? -->
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta property="og:title" content="Snotes App" />
|
|
<meta property="og:description"
|
|
content="Snotes is a free, simple notes app. Quickly create, paste, tag and search notes. No BS." />
|
|
<meta property="og:image" content="apple-touch-icon.png" />
|
|
<meta property="og:url" content="https://snotes.maidsin.space" />
|
|
|
|
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
|
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#5bbad5">
|
|
<meta name="theme-color" content="#ffffff">
|
|
|
|
<link href="output.css" rel="stylesheet">
|
|
<title>Snotes</title>
|
|
</head>
|
|
|
|
<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/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="index.html" class="text-white hover:text-gray-300"><code class="text-xl">SNOTES</code></a>
|
|
</li>
|
|
<li class="mr-6 ml-auto">
|
|
<a href="download.html"
|
|
class="text-white bg-purple-500 hover:bg-cyan-600 hover:text-white rounded-md px-4 py-2 transition-colors duration-200">DOWNLOAD</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<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 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>
|
|
|
|
<footer>
|
|
<div class="bg-black text-white m-10 text-right">
|
|
<p>© 2024 Snotes | <a class="hover:text-gray underline"
|
|
href="https://git.maidsin.space/catto/snotes-deck">Git</a></p>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
|
|
</html> |