Other useful pages

about.html

@@ -14,7 +14,7 @@
         Pastable is a lightweight and fast pastebin alternative, and URL-shortener made by Plabble and written in Rust.
       
       USAGE
-        Get /: Show this page
+        Get /about: Show this page
         Get /{id}: Get paste by ID and return in plain text
         Post /: Create new paste (plain text raw body or form parameter 'content') and return random generated key 
         Post /{id}: Create new paste (plain text raw body) and return requested key if available, else random generated key
@@ -30,6 +30,12 @@
 
         For links:
         Pipe your input into: curl -F 'link=<-' https://paste.plabble.org/to -w '\n'
+      
+      USING GUI
+          If you want to view a note using the GUI, add /#/ in the URL
+
+          For example:
+            https://paste.plabble.org/YOURID becomes https://paste.plabble.org/#/YOURID
     </pre>
   </body>
 </html>

pastabble-frontend/src/App.svelte

@@ -3,8 +3,10 @@
   import Router from 'svelte-spa-router'
   import Home from './lib/pages/Home.svelte';
   import Viewer from "./lib/pages/Viewer.svelte";
+  import About from "./lib/pages/About.svelte";
 
   const routes = {
+    '/about': About,
     '/:id': Viewer,
     '*': Home
   };
@@ -16,7 +18,12 @@
 
 <main class="p-10">
   <a href="/#/" class="text-3xl font-bold">Pastabble</a><br/>
-  <i>Fast and free pastebin alternative brought to you by the Plabble team</i>
+  <i>Fast and free pastebin alternative brought to you by the Plabble team</i><br/>
+  <div>
+    <a class="font-medium text-blue-600 dark:text-blue-500 hover:underline" href="/#/">Home</a>
+    -
+    <a class="font-medium text-blue-600 dark:text-blue-500 hover:underline" href="/#/about">About / using from terminal</a>
+  </div>
   
   <Router {routes} />
 </main>

pastabble-frontend/src/lib/components/CodeBlock.svelte

@@ -65,3 +65,9 @@
         </div>
     </div>
 </div>
+
+<style>
+    :global(.mockup-code pre::before) {
+        margin-right: 0 !important;
+    }
+</style>

pastabble-frontend/src/lib/pages/About.svelte

@@ -0,0 +1,32 @@
+<main>
+    <pre class="mt-10">
+        Welcome at PASTABBLE!
+        
+        ABOUT
+          Pastable is a lightweight and fast pastebin alternative, and URL-shortener made by Plabble and written in Rust.
+        
+        USAGE
+          Get /about: Show this page
+          Get /&#123;id&#125;: Get paste by ID and return in plain text
+          Post /: Create new paste (plain text raw body or form parameter 'content') and return random generated key 
+          Post /&#123;id&#125;: Create new paste (plain text raw body) and return requested key if available, else random generated key
+          
+          Get /to/&#123;id&#125;: Navigate to shortcut link (browser redirect)
+          Post /to: Create new link (plain text raw body or form parameter 'link') and return random generated key
+          Post /to/&#123;id&#125;: Create new link (plain text raw body) and return requested key if available, else random generated key
+        
+        FROM TERMINAL
+          Pipe your input into: curl -F 'content=&lt;-' https://paste.plabble.org -w '\n'
+          Or post it as raw data like: curl https://paste.plabble.org -H 'Content-Type: text/plain' -d @- -w '\n'
+          You can create an alias for this! To get the result: curl https://paste.plabble.org/YOURID
+  
+          For links:
+          Pipe your input into: curl -F 'link=&lt;-' https://paste.plabble.org/to -w '\n'
+
+        USING GUI
+          If you want to view a note using the GUI, add /#/ in the URL
+
+          For example:
+            https://paste.plabble.org/YOURID becomes https://paste.plabble.org/#/YOURID
+      </pre>
+</main>

pastabble-frontend/src/lib/pages/Home.svelte

@@ -107,6 +107,7 @@
 
 <div class="flex flex-col md:flex-row gap-5 justify-around">
     <div class="mt-10">
+        <p>Hint: you can also hit <kbd class="kbd kbd-sm my-3">Enter</kbd> to search/shorten</p>
         <div>
             <h2 class="text-2xl font-bold mb-3">Lookup existing note</h2>
 

src/main.rs

@@ -79,6 +79,9 @@ fn main() {
                     }
                 }
             },
+            (GET) (/about) => {
+                Response::html(&about)
+            },
             (GET) (/to/{id: String}) => {
                 match links.get(&id).expect("Failed to access links DB") {
                     Some(lnk) => {