various docs improvements

- add clickable anchors for headers
- add "outdated" warning for archived docs
- add "edit on github" button
- beautify template

4 files changed, 37 insertions, 20 deletions

diff --git a/docs/src/layouts/partials/add-anchors.html b/docs/src/layouts/partials/add-anchors.html
new file mode 100644
index 00000000..f7050f7f
--- /dev/null
+++ b/docs/src/layouts/partials/add-anchors.html
@@ -0,0 +1 @@
+{{ . | replaceRE "(<h[1-9] id=\"(.+?)\".*?>)(.+?</h[1-9]>)" "${1}<a class=\"anchor\" href=\"#${2}\">#&nbsp;&nbsp;</a>${3}" | safeHTML }}
diff --git a/docs/src/layouts/partials/edit-on-github.html b/docs/src/layouts/partials/edit-on-github.html
new file mode 100644
index 00000000..d2c3098c
--- /dev/null
+++ b/docs/src/layouts/partials/edit-on-github.html
@@ -0,0 +1,9 @@
+{{ if and .IsPage (not (getenv "DOCS_ARCHIVE")) }}
+<a class="button is-small is-outlined is-link is-pulled-right"
+   target="_blank"
+   href="https://github.com/mitmproxy/mitmproxy/blob/master/docs/src/content/{{ .File.Path }}"
+>
+    Edit on GitHub
+</a>
+{{ end }}
+
diff --git a/docs/src/layouts/partials/outdated.html b/docs/src/layouts/partials/outdated.html
new file mode 100644
index 00000000..5b3dd6ed
--- /dev/null
+++ b/docs/src/layouts/partials/outdated.html
@@ -0,0 +1,9 @@
+{{- if (getenv "DOCS_ARCHIVE") -}}
+<article class="message is-warning">
+    <div class="message-body">
+        You are not viewing the most up to date version of the documentation.
+        Click <a href="https://docs.mitmproxy.org/stable{{ .Page.URL }}">here</a>
+        to view the latest version.
+    </div>
+</article>
+{{- end -}}
diff --git a/docs/src/layouts/partials/sidebar.html b/docs/src/layouts/partials/sidebar.html
index ef853fc6..5ea41c12 100644
--- a/docs/src/layouts/partials/sidebar.html
+++ b/docs/src/layouts/partials/sidebar.html
@@ -1,24 +1,22 @@
-<div class="sidebar">
-    <div class="brand">
-        <img src='{{"logo-docs.png" | relURL}}' alt="mitmproxy docs">
-    </div>
-    <div class="version">
-        <span class="tag is-info is-rounded is-medium">v3.x</span>
-    </div>
-    <aside class="menu">
-        <p class="menu-label"> Overview </p>
-        {{ partial "sidemenu" (dict "ctx" . "menuname" "overview") }}
+<div class="brand">
+    <a href="https://mitmproxy.org/">
+        <img src='{{"logo-docs.png" | relURL}}' alt="mitmproxy docs"/>
+    </a>
 
-        <p class="menu-label">Core concepts</p>
-        {{ partial "sidemenu" (dict "ctx" . "menuname" "concepts") }}
+</div>
+<nav class="menu">
+    <p class="menu-label"> Overview </p>
+    {{ partial "sidemenu" (dict "ctx" . "menuname" "overview") }}
 
-        <p class="menu-label"> Addon Development </p>
-        {{ partial "sidemenu" (dict "ctx" . "menuname" "addons") }}
+    <p class="menu-label">Core concepts</p>
+    {{ partial "sidemenu" (dict "ctx" . "menuname" "concepts") }}
 
-        <p class="menu-label"> HOWTOs </p>
-        {{ partial "sidemenu" (dict "ctx" . "menuname" "howto") }}
+    <p class="menu-label"> Addon Development </p>
+    {{ partial "sidemenu" (dict "ctx" . "menuname" "addons") }}
 
-        <p class="menu-label"> Tutorials </p>
-        {{ partial "sidemenu" (dict "ctx" . "menuname" "tutes") }}
-    </aside>
-</div>
\ No newline at end of file
+    <p class="menu-label"> HOWTOs </p>
+    {{ partial "sidemenu" (dict "ctx" . "menuname" "howto") }}
+
+    <p class="menu-label"> Tutorials </p>
+    {{ partial "sidemenu" (dict "ctx" . "menuname" "tutes") }}
+</nav>