Merge pull request #3004 from mhils/docs-improvements

Docs Improvements

docs/README.md

@@ -0,0 +1,22 @@
+# Mitmproxy Documentation
+
+This directory houses the mitmproxy documentation available at <https://docs.mitmproxy.org/>.
+
+## Quick Start
+
+ 1. Install [hugo](https://gohugo.io/).
+ 2. Windows users: Depending on your git settings, you may need to manually create a symlink from 
+ /docs/src/examples to /examples.
+
+
+Now you can run `hugo server -D` in ./src.
+
+
+## Extended Install
+
+This is required to modify CSS files.
+
+ 1. Install node, yarn, and [modd](https://github.com/cortesi/modd).
+ 2. Run `yarn` in this directory to get node-sass.
+
+You can now run `modd` in this directory instead of running hugo directly.

docs/build

@@ -1,3 +0,0 @@
-#!/bin/sh
-
-cd src; hugo

docs/build-archive

@@ -0,0 +1,5 @@
+#!/bin/sh
+set -e
+
+cd src
+DOCS_ARCHIVE=true hugo

docs/build-current

@@ -0,0 +1,5 @@
+#!/bin/sh
+set -e
+
+cd src
+hugo

docs/ci

@@ -1,8 +1,9 @@
 #!/bin/bash
+set -e
 
 # This script gets run from CI to render and upload docs
 
-./build
+./build-current
 
 # Only upload if we have defined credentials - we only have these defined for
 # trusted commits (i.e. not PRs).

docs/setup

@@ -1,4 +1,5 @@
 #!/bin/sh
+set -e
 
 aws configure set preview.cloudfront true
 aws --profile mitmproxy \

docs/src/config.toml

@@ -4,6 +4,7 @@ title = "mitmproxy.org docs"
 theme = "mitmproxydocs"
 publishDir = "../public"
 RelativeURLs = true
+googleAnalytics = "UA-4150636"
 
 [indexes]
   tag = "tags"

docs/src/content/_index.md

@@ -1,5 +1,6 @@
 ---
 title: "Introduction"
+layout: single
 menu:
     overview:
         weight: 1

docs/src/content/concepts-certificates.md

@@ -19,7 +19,7 @@ configure your target device with the correct proxy settings. Now start a
 browser on the device, and visit the magic domain **mitm.it**. You should see
 something like this:
 
-{{< figure src="/certinstall-webapp.png" >}}
+{{< figure src="/certinstall-webapp.png" class="has-border" >}}
 
 Click on the relevant icon, follow the setup instructions for the platform
 you're on and you are good to go.
@@ -32,8 +32,8 @@ reason. Below is a list of pointers to manual certificate installation
 documentation for some common platforms. The mitmproxy CA cert is located in
 `~/.mitmproxy` after it has been generated at the first start of mitmproxy.
 
-- [IOS](http://jasdev.me/intercepting-ios-traffic) On
-  iOS 10.3 and onwards, you also need to enable full trust for the mitmproxy
+- [IOS](http://jasdev.me/intercepting-ios-traffic)  
+  On iOS 10.3 and onwards, you also need to enable full trust for the mitmproxy
   root certificate:
     1. Go to Settings > General > About > Certificate Trust Settings.
     2. Under "Enable full trust for root certificates", turn on trust for
@@ -42,13 +42,13 @@ documentation for some common platforms. The mitmproxy CA cert is located in
 - [Java](https://docs.oracle.com/cd/E19906-01/820-4916/geygn/index.html)
 - [Android/Android Simulator](http://wiki.cacert.org/FAQ/ImportRootCert#Android_Phones_.26_Tablets)
 - [Windows](https://web.archive.org/web/20160612045445/http://windows.microsoft.com/en-ca/windows/import-export-certificates-private-keys#1TC=windows-7)
-- [Windows (automated)](https://technet.microsoft.com/en-us/library/cc732443.aspx)
+- [Windows (automated)](https://technet.microsoft.com/en-us/library/cc732443.aspx)  
 
 {{< highlight bash  >}}
 certutil.exe -importpfx Root mitmproxy-ca-cert.p12
 {{< / highlight >}}
-
-- [Mac OS X](https://support.apple.com/kb/PH7297?locale=en_US)
+  
+- [Mac OS X](https://support.apple.com/kb/PH20129)
 - [Ubuntu/Debian]( https://askubuntu.com/questions/73287/how-do-i-install-a-root-certificate/94861#94861)
 - [Mozilla Firefox](https://wiki.mozilla.org/MozillaRootCertificate#Mozilla_Firefox)
 - [Chrome on Linux](https://stackoverflow.com/a/15076602/198996)
@@ -90,7 +90,7 @@ The files created by mitmproxy in the .mitmproxy directory are as follows:
 | mitmproxy-ca-cert.p12 | The certificate in PKCS12 format. For use on Windows.                                |
 | mitmproxy-ca-cert.cer | Same file as .pem, but with an extension expected by some Android devices.           |
 
-## Using a custom certificate
+## Using a custom server certificate
 
 You can use your own (leaf) certificate by passing the `--cert
 [domain=]path_to_certificate` option to mitmproxy. Mitmproxy then uses the
@@ -156,7 +156,7 @@ hostname, while using a filename allows a single specific certificate to be used
 for all SSL connections. Certificate files must be in the PEM format and should
 contain both the unencrypted private key and the certificate.
 
-### Multiple certs by Hostname
+### Multiple client certificates
 
 You can specify a directory to `--client-certs`, in which case the matching
 certificate is looked up by filename. So, if you visit example.org, mitmproxy

docs/src/content/howto-transparent.md

@@ -27,7 +27,209 @@ At the moment, mitmproxy supports transparent proxying on OSX Lion and above,
 and all current flavors of Linux.
 
 
-## Linux fully transparent mode
+## Linux
+
+On Linux, mitmproxy integrates with the iptables redirection mechanism to
+achieve transparent mode.
+
+### 1. Enable IP forwarding.
+
+{{< highlight bash  >}}
+sysctl -w net.ipv4.ip_forward=1
+sysctl -w net.ipv6.conf.all.forwarding=1
+{{< / highlight >}}
+
+This makes sure that your machine forwards packets instead of rejecting them.
+
+If you want to persist this across reboots, you need to adjust your `/etc/sysctl.conf` or
+a newly created `/etc/sysctl.d/mitmproxy.conf` (see [here](https://superuser.com/a/625852)).
+
+### 2. Disable ICMP redirects.
+
+{{< highlight bash  >}}
+sysctl -w net.ipv4.conf.all.send_redirects=0
+{{< / highlight >}}
+
+If your test device is on the same physical network, your machine shouldn't inform the device that 
+there's a shorter route available by skipping the proxy.
+
+If you want to persist this across reboots, see above.
+
+### 3. Create an iptables ruleset that redirects the desired traffic to mitmproxy.
+
+Details will differ according to your setup, but the ruleset should look
+something like this:
+
+{{< highlight bash  >}}
+iptables -t nat -A PREROUTING -i eth0 -p tcp --dport 80 -j REDIRECT --to-port 8080
+iptables -t nat -A PREROUTING -i eth0 -p tcp --dport 443 -j REDIRECT --to-port 8080
+ip6tables -t nat -A PREROUTING -i eth0 -p tcp --dport 80 -j REDIRECT --to-port 8080
+ip6tables -t nat -A PREROUTING -i eth0 -p tcp --dport 443 -j REDIRECT --to-port 8080
+{{< / highlight >}}
+
+If you want to persist this across reboots, you can use the `iptables-persistent` package (see
+[here](http://www.microhowto.info/howto/make_the_configuration_of_iptables_persistent_on_debian.html)).
+
+### 4. Fire up mitmproxy.
+
+You probably want a command like this:
+
+{{< highlight bash  >}}
+mitmproxy --mode transparent --showhost
+{{< / highlight >}}
+
+The `--mode transparent` option turns on transparent mode, and the `--showhost` argument tells
+ mitmproxy to use the value of the Host header for URL display.
+
+### 5. Finally, configure your test device.
+
+Set the test device up to use the host on which mitmproxy is running as the default gateway and 
+[install the mitmproxy certificate authority on the test device]({{< relref "concepts-certificates" >}}).
+
+
+
+## OpenBSD
+
+### 1. Enable IP forwarding.
+
+{{< highlight bash  >}}
+sudo sysctl -w net.inet.ip.forwarding=1
+{{< / highlight >}}
+
+### 2. Place the following two lines in **/etc/pf.conf**.
+
+{{< highlight none  >}}
+mitm_if = "re2"
+pass in quick proto tcp from $mitm_if to port { 80, 443 } divert-to 127.0.0.1 port 8080
+{{< / highlight >}}
+
+These rules tell pf to divert all traffic from `$mitm_if` destined for port 80
+or 443 to the local mitmproxy instance running on port 8080. You should replace
+`$mitm_if` value with the interface on which your test device will appear.
+
+### 3. Configure pf with the rules.
+
+{{< highlight bash  >}}
+doas pfctl -f /etc/pf.conf
+{{< / highlight >}}
+
+### 4. And now enable it.
+
+{{< highlight bash  >}}
+doas pfctl -e
+{{< / highlight >}}
+
+### 5. Fire up mitmproxy.
+
+You probably want a command like this:
+
+{{< highlight bash  >}}
+mitmproxy --mode transparent --showhost
+{{< / highlight >}}
+
+The `--mode transparent` option turns on transparent mode, and the `--showhost` argument tells
+mitmproxy to use the value of the Host header for URL display.
+
+### 6. Finally, configure your test device.
+
+Set the test device up to use the host on which mitmproxy is running as the default gateway and 
+[install the mitmproxy certificate authority on the test device]({{< relref "concepts-certificates" >}}).
+
+
+
+{{% note %}}
+Note that the **divert-to** rules in the pf.conf given above only apply
+to inbound traffic. **This means that they will NOT redirect traffic
+coming from the box running pf itself.** We can't distinguish between an
+outbound connection from a non-mitmproxy app, and an outbound connection
+from mitmproxy itself - if you want to intercept your traffic, you
+should use an external host to run mitmproxy. Nonetheless, pf is
+flexible to cater for a range of creative possibilities, like
+intercepting traffic emanating from VMs. See the **pf.conf** man page
+for more.
+{{% /note %}}
+
+
+## macOS
+
+OSX Lion integrated the [pf](https://en.wikipedia.org/wiki/PF_(firewall))
+packet filter from the OpenBSD project, which mitmproxy uses to implement
+transparent mode on OSX. Note that this means we don't support transparent mode
+for earlier versions of OSX.
+
+### 1. Enable IP forwarding.
+
+{{< highlight bash  >}}
+sudo sysctl -w net.inet.ip.forwarding=1
+{{< / highlight >}}
+
+### 2. Place the following two lines in a file called, say, **pf.conf**.
+
+
+{{< highlight none  >}}
+rdr on en0 inet proto tcp to any port {80, 443} -> 127.0.0.1 port 8080
+{{< / highlight >}}
+
+These rules tell pf to redirect all traffic destined for port 80 or 443
+to the local mitmproxy instance running on port 8080. You should replace
+`en2` with the interface on which your test device will appear.
+
+### 3. Configure pf with the rules.
+
+{{< highlight bash  >}}
+sudo pfctl -f pf.conf
+{{< / highlight >}}
+
+### 4. And now enable it.
+
+{{< highlight bash  >}}
+sudo pfctl -e
+{{< / highlight >}}
+
+### 5. Configure sudoers to allow mitmproxy to access pfctl.
+
+Edit the file **/etc/sudoers** on your system as root. Add the following line to
+the end of the file:
+
+{{< highlight none  >}}
+ALL ALL=NOPASSWD: /sbin/pfctl -s state
+{{< / highlight >}}
+
+Note that this allows any user on the system to run the command `/sbin/pfctl -s
+state` as root without a password. This only allows inspection of the state
+table, so should not be an undue security risk. If you're special feel free to
+tighten the restriction up to the user running mitmproxy.
+
+### 6. Fire up mitmproxy.
+
+You probably want a command like this:
+
+{{< highlight bash  >}}
+mitmproxy --mode transparent --showhost
+{{< / highlight >}}
+
+The `--mode transparent` flag turns on transparent mode, and the `--showhost` argument tells
+mitmproxy to use the value of the Host header for URL display.
+
+### 7. Finally, configure your test device.
+
+Set the test device up to use the host on which mitmproxy is running as the default gateway and 
+[install the mitmproxy certificate authority on the test device]({{< relref "concepts-certificates" >}}).
+
+{{% note %}}
+Note that the **rdr** rules in the pf.conf given above only apply to
+inbound traffic. **This means that they will NOT redirect traffic coming
+from the box running pf itself.** We can't distinguish between an
+outbound connection from a non-mitmproxy app, and an outbound connection
+from mitmproxy itself - if you want to intercept your OSX traffic, you
+should use an external host to run mitmproxy. Nonetheless, pf is
+flexible to cater for a range of creative possibilities, like
+intercepting traffic emanating from VMs. See the **pf.conf** man page
+for more.
+{{% /note %}}
+
+
+## "Full" transparent mode on Linux
 
 By default mitmproxy will use its own local IP address for its server-side
 connections. In case this isn't desired, the --spoof-source-address argument can
@@ -60,210 +262,3 @@ sudo chown root:root mitmproxy_shim
 sudo chmod u+s mitmproxy_shim
 ./mitmproxy_shim $(which mitmproxy) --mode transparent --set spoof-source-address
 {{< / highlight >}}
-
-
-
-## Linux
-
-On Linux, mitmproxy integrates with the iptables redirection mechanism to
-achieve transparent mode.
-
-### 1. [Install the mitmproxy certificate on the test device]({{< relref "concepts-certificates" >}})
-
-### 2. Enable IP forwarding:
-
-{{< highlight bash  >}}
-sysctl -w net.ipv4.ip_forward=1
-sysctl -w net.ipv6.conf.all.forwarding=1
-{{< / highlight >}}
-
-You may also want to consider enabling this permanently in `/etc/sysctl.conf` or
-newly created `/etc/sysctl.d/mitmproxy.conf`, see
-[here](https://superuser.com/a/625852).
-
-### 3. If your target machine is on the same physical network and you configured it to use a custom  gateway, disable ICMP redirects:
-
-{{< highlight bash  >}}
-sysctl -w net.ipv4.conf.all.send_redirects=0
-{{< / highlight >}}
-
-You may also want to consider enabling this permanently in `/etc/sysctl.conf` or
-a newly created `/etc/sysctl.d/mitmproxy.conf`, see
-[here](https://superuser.com/a/625852).
-
-### 4. Create an iptables ruleset that redirects the desired traffic to the mitmproxy port
-
-Details will differ according to your setup, but the ruleset should look
-something like this:
-
-{{< highlight bash  >}}
-    iptables -t nat -A PREROUTING -i eth0 -p tcp --dport 80 -j REDIRECT --to-port 8080
-    iptables -t nat -A PREROUTING -i eth0 -p tcp --dport 443 -j REDIRECT --to-port 8080
-    ip6tables -t nat -A PREROUTING -i eth0 -p tcp --dport 80 -j REDIRECT --to-port 8080
-    ip6tables -t nat -A PREROUTING -i eth0 -p tcp --dport 443 -j REDIRECT --to-port 8080
-{{< / highlight >}}
-
-   You may also want to consider enabling this permanently with the
-`iptables-persistent` package, see
-[here](http://www.microhowto.info/howto/make_the_configuration_of_iptables_persistent_on_debian.html).
-
-### 5. Fire up mitmproxy
-
-You probably want a command like this:
-
-{{< highlight bash  >}}
-mitmproxy --mode transparent --showhost
-{{< / highlight >}}
-
-The `--mode transparent` option turns on transparent mode, and the `--showhost` argument tells
- mitmproxy to use the value of the Host header for URL display.
-
-### 6. Finally, configure your test device
-
-Set the test device up to use the host on which mitmproxy is running as the
-default gateway. For a detailed walkthrough, have a look at the [tutorial for
-transparently proxying VMs]({{< relref "howto-transparent-vms" >}}).
-
-
-## OpenBSD
-
-### 1  [Install the mitmproxy certificate on the test device]({{< relref "concepts-certificates" >}})
-
-### 2. Enable IP forwarding
-
-{{< highlight bash  >}}
-sudo sysctl -w net.inet.ip.forwarding=1
-{{< / highlight >}}
-
-### 3. Place the following two lines in **/etc/pf.conf**
-
-{{< highlight none  >}}
-mitm_if = "re2"
-pass in quick proto tcp from $mitm_if to port { 80, 443 } divert-to 127.0.0.1 port 8080
-{{< / highlight >}}
-
-These rules tell pf to divert all traffic from `$mitm_if` destined for port 80
-or 443 to the local mitmproxy instance running on port 8080. You should replace
-`$mitm_if` value with the interface on which your test device will appear.
-
-### 4. Enable the pf ruleset and enable it
-
-{{< highlight bash  >}}
-doas pfctl -f /etc/pf.conf
-{{< / highlight >}}
-
-And now enable it:
-
-{{< highlight bash  >}}
-doas pfctl -e
-{{< / highlight >}}
-
-### 5. Fire up mitmproxy
-
-You probably want a command like this:
-
-{{< highlight bash  >}}
-mitmproxy --mode transparent --showhost
-{{< / highlight >}}
-
-The `--mode transparent` option turns on transparent mode, and the `--showhost` argument tells
-mitmproxy to use the value of the Host header for URL display.
-
-### 6. Finally, configure your test device
-
-Set the test device up to use the host on which mitmproxy is running as the
-default gateway.
-
-
-{{% note %}}
-Note that the **divert-to** rules in the pf.conf given above only apply
-to inbound traffic. **This means that they will NOT redirect traffic
-coming from the box running pf itself.** We can't distinguish between an
-outbound connection from a non-mitmproxy app, and an outbound connection
-from mitmproxy itself - if you want to intercept your traffic, you
-should use an external host to run mitmproxy. Nonetheless, pf is
-flexible to cater for a range of creative possibilities, like
-intercepting traffic emanating from VMs. See the **pf.conf** man page
-for more.
-{{% /note %}}
-
-
-## macOS
-
-OSX Lion integrated the [pf](https://en.wikipedia.org/wiki/PF_(firewall))
-packet filter from the OpenBSD project, which mitmproxy uses to implement
-transparent mode on OSX. Note that this means we don't support transparent mode
-for earlier versions of OSX.
-
-### 1. [Install the mitmproxy certificate on the test device]({{< relref "concepts-certificates" >}})
-
-### 2. Enable IP forwarding
-
-{{< highlight bash  >}}
-sudo sysctl -w net.inet.ip.forwarding=1
-{{< / highlight >}}
-
-### 3. Place the following two lines in a file called, say, **pf.conf**
-
-
-{{< highlight none  >}}
-rdr on en0 inet proto tcp to any port {80, 443} -> 127.0.0.1 port 8080
-{{< / highlight >}}
-
-These rules tell pf to redirect all traffic destined for port 80 or 443
-to the local mitmproxy instance running on port 8080. You should replace
-`en2` with the interface on which your test device will appear.
-
-### 4. Configure pf with the rules
-
-{{< highlight bash  >}}
-sudo pfctl -f pf.conf
-{{< / highlight >}}
-
-### 5. And now enable it
-
-{{< highlight bash  >}}
-sudo pfctl -e
-{{< / highlight >}}
-
-### 6. Configure sudoers to allow mitmproxy to access pfctl
-
-Edit the file **/etc/sudoers** on your system as root. Add the following line to
-the end of the file:
-
-{{< highlight none  >}}
-ALL ALL=NOPASSWD: /sbin/pfctl -s state
-{{< / highlight >}}
-
-Note that this allows any user on the system to run the command `/sbin/pfctl -s
-state` as root without a password. This only allows inspection of the state
-table, so should not be an undue security risk. If you're special feel free to
-tighten the restriction up to the user running mitmproxy.
-
-### 7. Fire up mitmproxy
-
-You probably want a command like this:
-
-{{< highlight bash  >}}
-mitmproxy --mode transparent --showhost
-{{< / highlight >}}
-
-The `--mode transparent` flag turns on transparent mode, and the `--showhost` argument tells
-mitmproxy to use the value of the Host header for URL display.
-
-### 6. Finally, configure your test device
-
-Set the test device up to use the host on which mitmproxy is running as the
-default gateway.
-
-{{% note %}}
-Note that the **rdr** rules in the pf.conf given above only apply to
-inbound traffic. **This means that they will NOT redirect traffic coming
-from the box running pf itself.** We can't distinguish between an
-outbound connection from a non-mitmproxy app, and an outbound connection
-from mitmproxy itself - if you want to intercept your OSX traffic, you
-should use an external host to run mitmproxy. Nonetheless, pf is
-flexible to cater for a range of creative possibilities, like
-intercepting traffic emanating from VMs. See the **pf.conf** man page
-for more.
-{{% /note %}}

docs/src/layouts/_default/single.html

@@ -1,10 +1,12 @@
-{{ partial "header.html" . }}
-<div class="columns">
-    <div class="column is-one-quarter sidebody">
-        {{ partial "sidebar.html" . }}
+{{ partial "header" . }}
+<div class="columns container is-marginless">
+    <div id="sidebar" class="column is-one-quarter">
+        {{ partial "sidebar" . }}
     </div>
-    <div class="column content mainbody">
-        {{.Content}}
+    <div id="main" class="column content">
+        {{ partial "outdated" . }}
+        {{ partial "edit-on-github" . }}
+        {{ partial "add-anchors" .Content}}
     </div>
 </div>
 {{ partial "footer.html" . }}

docs/src/layouts/index.html

@@ -1,10 +0,0 @@
-{{ partial "header.html" . }}
-<div class="columns">
-    <div class="column is-one-quarter sidebody">
-        {{ partial "sidebar.html" . }}
-    </div>
-    <div class="column content mainbody">
-        {{.Content}}
-    </div>
-</div>
-{{ partial "footer.html" . }}

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 }}

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 }}
+

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 -}}

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>
+    <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>

docs/src/themes/mitmproxydocs/layouts/partials/footer.html

@@ -1,2 +1,3 @@
+{{ template "_internal/google_analytics_async.html" . }}
 </body>
 </html>

docs/src/themes/mitmproxydocs/static/css/style.css

@@ -6717,9 +6717,17 @@ label.panel-block {
   background-color: whitesmoke;
   padding: 3rem 1.5rem 6rem; }
 
-.sidebody {
-  overflow-x: hidden;
-  overflow-y: scroll; }
+#sidebar {
+  background-color: #eee;
+  border-right: 1px solid #c1c1c1;
+  box-shadow: 0 0 20px rgba(50, 50, 50, 0.2) inset;
+  padding: 1.75rem; }
+  #sidebar .brand {
+    padding: 1rem 0;
+    text-align: center; }
+
+#main {
+  padding: 3rem; }
 
 .example {
   margin-bottom: 1em; }
@@ -6730,21 +6738,6 @@ label.panel-block {
     width: 100%;
     text-align: right; }
 
-.sidebar {
-  background-color: #F1F1F1; }
-  .sidebar .version {
-    padding: 1em; }
-  .sidebar .brand {
-    background-color: #303030;
-    color: #c0c0c0;
-    padding: 1em;
-    top: 0; }
-  .sidebar .menu {
-    padding: 1em; }
-
-.mainbody {
-  padding: 3em; }
-
 code {
   color: #1a9f1a;
   font-size: 0.875em;
@@ -6753,3 +6746,26 @@ code {
 .content h2 {
   padding-top: 1em;
   border-top: 1px solid #c0c0c0; }
+
+h1 .anchor, h2 .anchor, h3 .anchor, h4 .anchor, h5 .anchor, h6 .anchor {
+  display: inline-block;
+  width: 0;
+  margin-left: -1.5rem;
+  margin-right: 1.5rem;
+  transition: all 100ms ease-in-out;
+  opacity: 0; }
+
+h1:hover .anchor, h2:hover .anchor, h3:hover .anchor, h4:hover .anchor, h5:hover .anchor, h6:hover .anchor {
+  opacity: 1; }
+
+h1:target, h2:target, h3:target, h4:target, h5:target, h6:target {
+  color: #C93312; }
+  h1:target .anchor, h2:target .anchor, h3:target .anchor, h4:target .anchor, h5:target .anchor, h6:target .anchor {
+    opacity: 1;
+    color: #C93312; }
+
+.footnotes p {
+  display: inline; }
+
+figure.has-border img {
+  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.25); }

docs/style/style.scss

@@ -10,9 +10,20 @@ $family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Ox
 @import "../node_modules/bulma/sass/components/_all";
 @import "../node_modules/bulma/sass/layout/_all";
 
-.sidebody {
-    overflow-x: hidden;
-    overflow-y: scroll;
+#sidebar {
+    background-color: #eee;
+    border-right: 1px solid #c1c1c1;
+    box-shadow: 0 0 20px rgba(50, 50, 50, .2) inset;
+    padding: $column-gap + 1rem;
+
+    .brand {
+        padding: 1rem 0;
+        text-align: center;
+    }
+}
+
+#main {
+    padding: 3rem;
 }
 
 .example {
@@ -27,30 +38,10 @@ $family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Ox
     margin-bottom: 1em;
 }
 
-.sidebar {
-    background-color: #F1F1F1;
-    .version {
-        padding: 1em;
-    }
-    .brand {
-        background-color: #303030;
-        color: #c0c0c0;
-        padding: 1em;
-        top: 0;
-    }
-    .menu {
-        padding: 1em;
-    }
-}
-
-.mainbody {
-  padding: 3em;
-}
-
 code {
-  color: #1a9f1a;
-  font-size: 0.875em;
-  font-weight: normal;
+    color: #1a9f1a;
+    font-size: 0.875em;
+    font-weight: normal;
 }
 
 .content {
@@ -59,3 +50,32 @@ code {
         border-top: 1px solid #c0c0c0;
     }
 }
+
+h1, h2, h3, h4, h5, h6 {
+    .anchor {
+        display: inline-block;
+        width: 0;
+        margin-left: -1.5rem;
+        margin-right: 1.5rem;
+        transition: all 100ms ease-in-out;
+        opacity: 0;
+    }
+    &:hover .anchor {
+        opacity: 1;
+    }
+    &:target {
+        color: $primary;
+        .anchor {
+            opacity: 1;
+            color: $primary
+        }
+    }
+}
+
+.footnotes p {
+    display: inline;
+}
+
+figure.has-border img {
+    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.25);
+}

docs/upload-archive

@@ -1,4 +1,5 @@
-#!/bin/sh
+#!/bin/bash
+set -e
 
 if [[ $# -eq 0 ]] ; then
     echo "Please supply a version, e.g. 'v3'"

docs/upload-stable

@@ -1,4 +1,5 @@
-#!/bin/sh
+#!/bin/bash
+set -e
 
 aws configure set preview.cloudfront true
 aws --profile mitmproxy \