From 7fc7df9a20ee77f6d4b667974b52146fff02ed6f Mon Sep 17 00:00:00 2001
From: Eric Bower <me@erock.io>
Date: Sat, 16 Nov 2024 22:10:29 -0500
Subject: [PATCH] style: docs

---
 Makefile                              |   4 +-
 docs/static/favicon-16x16.png         | Bin 485 -> 0 bytes
 docs/static/favicon-32x32.png         | Bin 1136 -> 0 bytes
 docs/static/logo.png                  | Bin 0 -> 2993 bytes
 docs/static/logo.svg                  |  11 +++
 docs/static/main.css                  | 137 +++++++++++---------------
 docs/tmpl/base.layout.tmpl            |   4 +-
 docs/tmpl/home.page.tmpl              |   4 +-
 docs/tmpl/nav.partial.tmpl            |   2 +-
 docs/tmpl/post.page.tmpl              |  18 ++--
 docs/tmpl/sitemap-footer.partial.tmpl |  43 ++++----
 11 files changed, 109 insertions(+), 114 deletions(-)
 delete mode 100644 docs/static/favicon-16x16.png
 delete mode 100644 docs/static/favicon-32x32.png
 create mode 100644 docs/static/logo.png
 create mode 100644 docs/static/logo.svg

diff --git a/Makefile b/Makefile
index 8b36002..4b44a41 100644
--- a/Makefile
+++ b/Makefile
@@ -9,11 +9,11 @@ ssg:
 .PHONY: ssg
 
 docs: ssg
-	rsync -vr ./docs/public/ hey@pgs.sh:/sish-local
+	rsync -vr ./docs/public/ pgs.sh:/sish-local
 .PHONY: docs
 
 docs-prod: ssg
-	rsync -vr ./docs/public/ hey@pgs.sh:/sish-prod
+	rsync -vr ./docs/public/ pgs.sh:/sish-prod
 .PHONY: docs-prod
 
 dev:
diff --git a/docs/static/favicon-16x16.png b/docs/static/favicon-16x16.png
deleted file mode 100644
index 9775c56aa7d061bd62fadfa96e017fcb3b813b66..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 485
zcmV<B0UG{^P)<h;3K|Lk000e1NJLTq000mG000mO1^@s6AM^iV00053Nkl<ZI8UXM
zzpKGv6vm&g0Rx#xQU*!}76w@;ix4SgqpbcEgHaZ;h?2}Cn}vVCBm*IY{D|V-d(ORd
zzqz;j)qSUTIM3&Oo^#GCynP(};|SjYx7!W1S`A*W7Y2ht5>^B_9*-y#3NV|^h(sc<
z14yyiY|w7E5s$|iK(1sm83aN25h!wSujq6-7z_q58jUy{4%qMa2!%qhTCGozC%|Mf
zL9f^2S4pH)D%nM;RD#Fjfz4(UL7o7`ViBoS3g`0~tyT-sXq4>}B%jYClga!JxLhu%
zR;x%RlU!7<*SRO@bebJC8V!WQVaVn32SnuHbULBgY$6Z{aE$SI3|bStUJtESi{*03
zu@nl07(jN{>osPx87M+57UR5>|GsCd)e6~c7H+qjT{#>MIGs+ggG!}>`FxIGFo^5*
zis^I;zu*5D9YMO?E_6B_H?dqU!(=jj))0UM!{HD<pN~Z}!hXNc+ej|9+bs+2cKhFB
zyjRexv;)+AwOak!B9Uk`8gUf5Ycv{IEEcF#DrpWDiv@DI9Co`MiwNR!xsXUCqyZ%T
bqOYQNc0u{kqu>6D00000NkvXXu0mjfkSfsE

diff --git a/docs/static/favicon-32x32.png b/docs/static/favicon-32x32.png
deleted file mode 100644
index eb91b354a410043c0f93667fdf06dc62375a9c8a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1136
zcmV-$1dscPP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F8000CxNkl<ZSVz@X
zStzw@7+vN$!-cU-Auf<8V-oSpkhn9HOl1ru%5)*~7|8{Gxl%5W3<(z$7bJ<eAS4;m
z&wpc{&N=Jt?A_T1dvCix|2bdnzP-Qi+uyU^^{lm?SM86#4*bSL?LQCT@$nJ&_xCU~
zG=#dk`Y-27E(0u_m6e5uhX+JNL?9z018Qn&zZ8UA07pkhXlZE?pW@<Tw6(Rtz`)?^
z0FZ&)++3KOo8$KO79AZO(9qEMIsmM6eSMAH-Cgwe_oJz)2}VXnUkgA|ZEkK(03jpP
z0p0uh`YJtZYHF$^Ql)LkVwIJZ2nq_q!NCCz4-av5btMFPd3gypH#elFrozL+<5O)?
z8UXFs+}w<@u`!gCl)&BH9hR1s(AU=&fVQ@_FfuX%7Z(?lmX^ZA#6+o9DFuMV8yg#8
zZEY<IzP!93B_-vJB`MmTo*t~Ou8OmnnVCWm3IVX!0|NuNxw%1pe!eJPR#t|>!a~^D
z*}W;i``z8$poLpoTNUa;A%N4<Q$cxOU!ODs_V)I~@4C7=XlZG^0YN4*Gc%Ewmj{1;
zf4M9u1kl;pDRLk&F;V&=2`d&B7Ko0Hem5N#7Z));K92VGcGUqqKR+WWDM<v7jg5`W
zi@3^yf&zGXc_At)3ikH)GWVGu+1c5mecIaEAA*p}z|WsQ#Vi;a8hY~*+Al3F4Pjwn
zSXfvPEz#B0m0^jQ!8XYgqg((N7Z*Z!!^6W;nwbaZ=jVdn$;nCd_Vx-Ue0_Zp8yhQZ
z$WY=@R8)lO>T1;iQ27j(!NEZxwzai2OifJ*Cy;jDpPijWNJt25ZEeMOiq_lP8=;}0
zsI9F<S63HwbaYf}0awdD(rzawCnDuyVq!!dNcIL4q+~?%JBQZF%8Cdjh7%nW92^X0
z$^87h0BdDsCH;>~3y6MWV?(Tf={7MjfwQwSu>uN_JyvEvKp-_WHA0{)yu7?DqB|}w
z4ogc*A|FgmO$94b090*GP7VSB0x&&2jqvbr#K*@A3vvb|Cnv+x(^DY;7H2`~h8AS&
z$O?5rQL-gWRk9!hfPy1k^nH1GIT{)oq<Jp6M@Iw(27Z`sEWW+HE!d*^IV*VZ`uh61
z5U!7pj}WVbNht&D_xJDLMUMOV`5`?$U1qhUu&Sy`=z(*<$;nBmoiCy&X;~K7+}sqy
z=-;{VkqTurAer$L*n7Pul`}Il7#$r2LyASXL7^=PCNeS--@bi&H=dOOpm22k{Q!$I
z3E7&brzbFy2}G6cn!;J2EGSi<`+or--BkI`&W=btT9?%S`0+z1-oe2Ej*gCSb#;}-
zu_9(Z#Q?=uQBi@ryF0NVm82niPXY78(5kPmM?yk^qS~@Kpv=>>+wt)+_V@P%2qvSR
zo*s;ijm74a*O+k5&dzd2@IPyPiUDOne)gH)4&YB}NqxWiXhR490000<MNUMnLSTXp
CF$Ajs

diff --git a/docs/static/logo.png b/docs/static/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..a2ce1b3a2a8924a57c305a53d8a6e142e25daac3
GIT binary patch
literal 2993
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

literal 0
HcmV?d00001

diff --git a/docs/static/logo.svg b/docs/static/logo.svg
new file mode 100644
index 0000000..50d8319
--- /dev/null
+++ b/docs/static/logo.svg
@@ -0,0 +1,11 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <style>
+		@media (prefers-color-scheme: light) {
+			#logo { stroke: #414558 }
+		}
+		@media (prefers-color-scheme: dark) {
+			#logo { stroke: #f2f2f2 }
+		}
+	</style>
+  <path id="logo" d="M107.301 39C111.645 46.5241 113.954 55.0503 113.999 63.7382C114.045 72.4262 111.826 80.9761 107.561 88.5452C103.296 96.1144 97.1319 102.442 89.677 106.903C82.222 111.365 73.7332 113.807 65.047 113.989C56.3608 114.171 47.7772 112.086 40.1419 107.941C32.5067 103.795 26.0835 97.7316 21.5053 90.3476C16.9271 82.9637 14.3519 74.5142 14.0336 65.832C13.7152 57.1497 15.6647 48.5344 19.6899 40.835L64 64L107.301 39Z" stroke="#414558" stroke-width="12"/>
+</svg>
diff --git a/docs/static/main.css b/docs/static/main.css
index 16a25dd..cf082f4 100644
--- a/docs/static/main.css
+++ b/docs/static/main.css
@@ -1,77 +1,72 @@
-.visited {
-  color: var(--visited);
+@media (prefers-color-scheme: light) {
+  .logo { stroke: #414558; fill: none; }
 }
-
-.sitemap {
-  width: 250px;
+@media (prefers-color-scheme: dark) {
+  .logo { stroke: #f2f2f2; fill: none; }
 }
 
-.post {
-  max-width: 700px;
+.logo-sm svg {
+  width: 10px;
+  height: 10px;
 }
 
-.container-xs {
-  max-width: 20em;
-  width: 100%;
+.logo-md svg {
+  width: 25px;
+  height: 25px;
 }
 
-.post-container {
-  display: flex;
-  gap: 1rem;
-  flex-direction: row-reverse;
+.logo-lg svg {
+  width: 50px;
+  height: 50px;
 }
 
-.hiw {
-  background-color: #282a36;
+.divider {
+  width: 1px;
+  height: auto;
+  background-color: var(--grey-light);
 }
 
-.link-alt-adj,
-.link-alt-adj:visited,
-.link-alt-adj:visited:hover,
-.link-alt-adj:hover {
-  color: var(--link-color);
-  text-decoration: none;
+.visited {
+  color: var(--visited);
 }
 
-.link-alt-adj:visited:hover,
-.link-alt-adj:hover {
-  text-decoration: underline;
+.sitemap {
+  width: 250px;
+  flex: 0 0 250px;
+  margin: 0;
+  padding-bottom: 2rem !important;
+  overflow-y: auto;
+  height: calc(100vh - 3px - (3 * var(--line-height)));
 }
 
-.link-alt-hover,
-.link-alt-hover:visited,
-.link-alt-hover:visited:hover,
-.link-alt-hover:hover {
-  color: var(--hover);
-  text-decoration: none;
+.post {
+  max-width: 600px;
+  height: calc(100vh - 3px - (3 * var(--line-height)));
+  overflow-y: auto;
+  padding-right: 20px;
 }
 
-.link-alt-hover:visited:hover,
-.link-alt-hover:hover {
-  text-decoration: underline;
+.post-container {
+  max-width: 60rem;
 }
 
-.link-alt,
-.link-alt:visited,
-.link-alt:visited:hover,
-.link-alt:hover {
-  color: var(--white);
-  text-decoration: none;
+.container-xs {
+  max-width: 20em;
+  width: 100%;
 }
 
-.link-alt:visited:hover,
-.link-alt:hover {
-  text-decoration: underline;
+.hero {
+  padding: calc(var(--line-height) * 3) 0 0 0;
 }
 
-.hero {
-  padding: 5rem 0;
+.home-features pre {
+  margin: 0;
 }
 
 .features {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(225px, 1fr));
-  gap: 1rem;
+  gap: calc(var(--line-height) - 4px);
 }
 
 .features h3 {
@@ -79,29 +74,7 @@
 }
 
 .mk-nav {
-  padding: 1rem;
-}
-
-.text-hdr {
-  color: var(--hover);
-}
-
-.text-underline-hdr {
-  border-bottom: 3px solid var(--hover);
-  padding-bottom: 3px;
-}
-
-.current {
-  background-color: var(--blockquote-bg) !important;
-  border-right: 5px solid var(--blockquote);
-}
-
-.current a {
-  color: var(--white);
-}
-
-.current-page a {
-  color: var(--white);
+  padding: var(--line-height);
 }
 
 .pager {
@@ -115,11 +88,13 @@
 }
 
 .sidebar-list {
-  padding: 0 0 0 1rem;
+  padding: 0 0 0 var(--line-height);
 }
 
-.sidebar-list li {
-  margin: 0 0 0.5rem 0;
+.post-group {
+  display: flex;
+  gap: 1rem;
+  flex-direction: row-reverse;
 }
 
 @media only screen and (max-width: 800px) {
@@ -131,15 +106,20 @@
     margin: 0;
   }
 
-  .post-container {
+  .post-group {
     display: block;
   }
 
+  .post {
+    height: 100%;
+    overflow-y: unset;
+    padding-right: 0;
+  }
+
   .sitemap {
-    text-align: center;
-    -moz-column-count: 2;
     column-count: 2;
     width: 100%;
+    margin-bottom: calc(2 * var(--line-height));
   }
 
   .sitemap-grid {
@@ -147,11 +127,10 @@
   }
 
   .mk-nav {
-    padding: 1rem 0;
+    padding: var(--line-height) 0;
   }
 
-  .sidebar-list {
-    padding: 0 0 0 0.6rem;
-    margin: 0;
+  .divider {
+    display: none;
   }
 }
diff --git a/docs/tmpl/base.layout.tmpl b/docs/tmpl/base.layout.tmpl
index 2c5837d..d41340a 100644
--- a/docs/tmpl/base.layout.tmpl
+++ b/docs/tmpl/base.layout.tmpl
@@ -6,8 +6,8 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="keywords" content="ngrok, sish, ssh, tunnel, self-hosted" />
-    <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 href="/logo.svg" rel="icon" type="image/svg+xml"/>
+    <link href="/logo.png" rel="icon" sizes="any" type="image/png"/>
     <link rel="stylesheet" href="https://pico.sh/syntax.css" />
     <link rel="stylesheet" href="https://pico.sh/smol.css" />
     <link rel="stylesheet" href="/main.css" />
diff --git a/docs/tmpl/home.page.tmpl b/docs/tmpl/home.page.tmpl
index a92e925..53dc555 100644
--- a/docs/tmpl/home.page.tmpl
+++ b/docs/tmpl/home.page.tmpl
@@ -15,7 +15,7 @@
     <div class="flex items-center justify-center hero">
       <div class="flex flex-col items-center gap-2">
         <h1 class="logo-header text-2xl">sish</h1>
-        <div class="text-center text-lg">Access localhost using https</div>
+        <div class="text-center text-lg">Host public web services on localhost</div>
         <a href="/getting-started" class="btn-link">GET STARTED</a>
       </div>
     </div>
@@ -39,7 +39,7 @@
         <h2 class="m-0 p-0 text-lg">
           Fully managed service <a href="https://tuns.sh">tuns.sh</a>
         </h2>
-        <p>We also manage an instance of <code>sish</code> so users don't have to worry about managing it.</p>
+        <p>We also manage an instance of <code>sish</code> so you can start using it immediately.</p>
       </div>
     </article>
 
diff --git a/docs/tmpl/nav.partial.tmpl b/docs/tmpl/nav.partial.tmpl
index 21937ac..e744fd0 100644
--- a/docs/tmpl/nav.partial.tmpl
+++ b/docs/tmpl/nav.partial.tmpl
@@ -1,6 +1,6 @@
 {{define "nav"}}
 <nav class="mk-nav">
-  <div class="flex items-center justify-center gap-2 text-md">
+  <div class="flex flex-wrap items-center justify-center gap-2">
     <a href="/" class="link-alt">
       sish
     </a>
diff --git a/docs/tmpl/post.page.tmpl b/docs/tmpl/post.page.tmpl
index 97fbe92..b493149 100644
--- a/docs/tmpl/post.page.tmpl
+++ b/docs/tmpl/post.page.tmpl
@@ -2,17 +2,21 @@
 
 {{define "title"}}{{.Data.Title}}{{end}}
 
-{{define "meta"}}{{end}}
+{{define "meta"}}
+<meta name="description" content="{{.Data.Description}}" />
+{{end}}
 
-{{define "attrs"}}class="container"{{end}}
+{{define "attrs"}}class="post-container"{{end}}
 
 {{define "body"}}
 {{template "nav" .}}
 
-<div class="post-container">
-  <main class="post flex-1">
-    <h1 class="text-2xl text-underline-hdr text-hdr inline-block">{{.Data.Title}}</h1>
-    <h2 class="text-xl">{{.Data.Description}}</h2>
+<div class="post-group">
+  <main class="post">
+    <h1 class="text-2xl text-hdr m-0 flex items-center">
+      {{.Data.Title}}
+    </h1>
+    <p class="m-0">{{.Data.Description}}</p>
 
     <hr />
 
@@ -21,10 +25,10 @@
     </article>
 
     {{template "pager" .}}
+    {{template "footer" .}}
   </main>
 
   {{template "sitemap-footer" .}}
 </div>
 
-{{template "footer" .}}
 {{end}}
diff --git a/docs/tmpl/sitemap-footer.partial.tmpl b/docs/tmpl/sitemap-footer.partial.tmpl
index 856cf3f..d20eb57 100644
--- a/docs/tmpl/sitemap-footer.partial.tmpl
+++ b/docs/tmpl/sitemap-footer.partial.tmpl
@@ -1,31 +1,32 @@
 {{define "sitemap-footer"}}
-<div class="sitemap text-sm mb-4">
-  <ul class="list-none sidebar-list">
+  <ul class="sitemap list-none sidebar-list">
   {{range .Sitemap.Children}}
     {{if .Href}}
-    <li class="text-md">
-      {{if (eq $.Href .GenHref)}}
-      <a href="{{.GenHref}}" class="link-alt-hover">{{.Text}}</a>
-      {{else}}
-      <a href="{{.GenHref}}" class="link-alt">{{.Text}}</a>
-      {{end}}
-    </li>
+    <li>
+      <span class="font-bold">
+        {{if (eq $.Href .GenHref)}}
+        <a href="{{.GenHref}}" class="link-alt-hover">{{.Text}}</a>
+        {{else}}
+        <a href="{{.GenHref}}" class="link-alt">{{.Text}}</a>
+        {{end}}
+      </span>
     {{else}}
-    <li class="text-md">{{.Text}}</li>
+    <li>
+      <span class="font-bold">{{.Text}}</span>
     {{end}}
 
-    {{range .Children}}
-      <ul class="list-none sidebar-list">
-        <li>
-          {{if (eq $.Href .GenHref)}}
-          <a href="{{.GenHref}}" class="link-alt-hover">{{.Text}}</a>
-          {{else}}
-          <a href="{{.GenHref}}" class="link-alt">{{.Text}}</a>
-          {{end}}
-        </li>
+      {{if .Children}}
+      <ul class="list-square sidebar-list">
+        {{range .Children}}
+          <li>
+            <a href="{{.GenHref}}" class="link-alt{{if (eq $.Href .GenHref)}}-hover{{end}}">
+              {{.Text}}
+            </a>
+          </li>
+        {{end}}
       </ul>
-    {{end}}
+      {{end}}
+    </li>
   {{end}}
   </ul>
-</div>
 {{end}}