docs: 💬 Add roadmap page

webapp/src/lib/components/Footer.svelte

@@ -1,7 +1,7 @@
 <hr class="border-zinc-200 dark:border-zinc-700 transition-colors" />
 
 <footer
-	class="px-3 py-6 md:p-8 text-center flex flex-wrap justify-center items-center gap-x-2 text-zinc-500 dark:text-zinc-400"
+	class="px-3 py-6 md:p-8 text-center flex flex-wrap justify-center items-center gap-x-2 gap-y-1.5 text-zinc-500 dark:text-zinc-400"
 >
 	<span>
 		Built with love by <a class="underline" href="https://mcndt.dev" alt="blog">mcndt</a>
@@ -11,6 +11,8 @@
 	<span>-</span>
 	<a class="underline" href="/changelog">Changelog</a>
 	<span>-</span>
+	<a class="underline" href="/roadmap">Roadmap</a>
+	<span>-</span>
 	<a class="underline" href="/contact">Contact</a>
 	<span>-</span>
 	<a class="underline" href="https://discord.gg/y3HqyGeABK">Discord</a>

webapp/src/routes/__layout.svelte

@@ -56,7 +56,6 @@
 								>
 							</span>
 						</NavBarLink>
-
 						<ThemeToggle bind:dark />
 					</svelte:fragment>
 					></NavBar

webapp/src/routes/roadmap.svelte

@@ -0,0 +1,45 @@
+<script context="module">
+	export const prerender = true;
+</script>
+
+<svelte:head>
+	<title>Roadmap | {import.meta.env.VITE_BRANDING}</title>
+</svelte:head>
+
+<div class="md:py-8 prose max-w-3xl dark:prose-invert">
+	<h1>Roadmap</h1>
+
+	<p>
+		Here you can find the current roadmap for the plugin. If you have any suggestions for the web
+		app or the Obsidian plugin is via the <a
+			href="https://github.com/mcndt/obsidian-quickshare/issues"
+		>
+			GitHub issues page
+		</a>. For a more detailed overview of open issues and bugs on this open source project, check
+		out the <a href="https://github.com/users/mcndt/projects/1/views/5">GitHub project page</a>.
+	</p>
+
+	<div class="md:grid md:grid-cols-3 gap-x-2 w-full">
+		<div>
+			<h2>⚙️ In progress</h2>
+			<ul>
+				<li>Adding embedded images to shared note.</li>
+			</ul>
+		</div>
+		<div>
+			<h2>🗓️ Planned</h2>
+			<ul>
+				<li>Deleting previously shared notes.</li>
+				<li>Manually setting an expire time.</li>
+			</ul>
+		</div>
+		<div>
+			<h2>💭 Potential features</h2>
+			<ul>
+				<li>Rendering DataView codeblocks before sharing.</li>
+				<li>Rendering Excalidraw embeds before sharing.</li>
+				<li>Rendering Mermaid diagrams in the web app.</li>
+			</ul>
+		</div>
+	</div>
+</div>