style: tweaks

picosh · Sep 2, 2024 · 2ab6343 · 2ab6343
1 parent f801f00
commit 2ab6343
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 11 deletions.
diff --git a/posts/how-it-works.md b/posts/how-it-works.md
@@ -21,7 +21,7 @@ easy to programmatically compose and extend a traditional SSH server. So we have
 built middleware to serve our needs:
 
 - Authentication and authorization with keypairs and a database
-- Uploading files with `scp`, `sftp`, and `rsync`
+- Uploading files with `scp`, `sftp`, `rsync`, and `sshfs`
 - Piping into an SSH server
 - Rendering a TUI
 - Remote CLI

diff --git a/static/main.css b/static/main.css
@@ -5,6 +5,12 @@
   #logo { stroke: #f2f2f2; fill: none; }
 }
 
+.divider {
+  width: 1px;
+  height: auto;
+  background-color: var(--grey-light);
+}
+
 .visited {
   color: var(--visited);
 }
@@ -103,4 +109,8 @@
   .mk-nav {
     padding: var(--line-height) 0;
   }
+
+  .divider {
+    display: none;
+  }
 }
diff --git a/tmpl/home.page.tmpl b/tmpl/home.page.tmpl
@@ -23,22 +23,18 @@
       </div>
     </div>
 
-    <div><hr /></div>
-
     <div class="flex flex-col items-center group-2">
       <div class="container-sm">
         The secret ingredient to all our services is how we let users
         publish content without needing to install anything.
-        We accomplish this with the SSH tools you already have installed on your system.
-      </div>
-
-      <div class="container-sm">
-        Want to publish a blog post? Use rsync, scp, or sftp.  Want to publish a
-        website?  Use rsync, scp, or sftp.  Want to share a code snippet with a
-        colleague?  Use rsync, scp, or sftp.  Hopefully you see the trend.
+        We accomplish this with the SSH tools (<code>rsync</code>,
+        <code>sftp</code>, <code>sshfs</code>) you already have
+        installed on your system.
       </div>
     </div>
 
+    <div><hr /></div>
+
     <article class="features">
       <div class="box">
         <h3 class="m-0 p-0 text-lg">
@@ -93,11 +89,14 @@
         <div class="flex gap-2 flex-collapse">
           <div class="flex-1 group">
             <div>
-              if you have a local webserver on <code>localhost:8000</code>,
+              If you have a local webserver on <code>localhost:8000</code>,
               activate an SSH tunnel to us:
             </div>
             <pre>ssh -R dev:80:localhost:8000 tuns.sh</pre>
           </div>
+
+          <div class="divider"></div>
+
           <div class="flex-1">
             Now your local dev server is available on the web: <strong>https://{user}-dev.tuns.sh</strong>
           </div>
@@ -111,6 +110,9 @@
             <div>Upload your static site to us:</div>
             <pre>rsync -rv ./public/ pgs.sh:/mysite/</pre>
           </div>
+
+          <div class="divider"></div>
+
           <div class="flex-1 group">
             <div>Now your site is available with TLS handled for you: <strong>https://{user}-mysite.pgs.sh</strong></div>
             <div>We also automatically handle TLS for your custom domains!</div>
@@ -129,6 +131,9 @@ This is my first blog post.
 
 Cya!</pre>
           </div>
+
+          <div class="divider"></div>
+
           <div class="flex-1 group">
             <div>Upload the post to us:</div>
             <pre>scp hello-world.md prose.sh:/</pre>
@@ -147,6 +152,9 @@ Cya!</pre>
             <div>Pipe some stdout to us:</div>
             <pre>git diff | ssh pastes.sh changes.patch</pre>
           </div>
+
+          <div class="divider"></div>
+
           <div class="flex-1">
             And instantly share your code snippets:
             <strong>https://{user}.pastes.sh/changes.patch</strong>
@@ -164,6 +172,9 @@ Cya!</pre>
 => https://pico.prose.sh/rss
 => https://erock.prose.sh/rss</pre>
           </div>
+
+          <div class="divider"></div>
+
           <div class="flex-1 group">
             <div>Then upload it to us:</div>
             <pre>scp blogs.txt feeds.pico.sh:/</pre>
@@ -182,6 +193,9 @@ Cya!</pre>
             <div>Open a tunnel to our docker registry:</div>
             <pre>ssh -L 1338:localhost:80 -N imgs.sh</pre>
           </div>
+
+          <div class="divider"></div>
+
           <div class="flex-1 group">
             <div>
               Now you are authenticated!  You are now able to push