Add tabbed codeblocks into documentation (#48)

docs/docs/installation.md

@@ -6,11 +6,11 @@ title: Installation
 
 # Installation
 
-## Via package managers
+## Using a package manager
 
-### `homebrew` (MacOS and Linux)
+### Homebrew
 
-```bash
+```bash tab={"label":"Homebrew"}
 brew tap futurice/jalapeno
 brew install jalapeno
 ```
@@ -22,7 +22,7 @@ downloaded and installed from [GitHub releases](https://github.com/futurice/jala
 
 In short the process is:
 
-1. Download [the latest version of jalapeno](https://github.com/futurice/jalapeno/releases/latest)
+1. Download [the latest version of Jalapeno](https://github.com/futurice/jalapeno/releases/latest)
 for your platform
 2. Extract the archive
 3. Make the binary executable
@@ -39,25 +39,19 @@ mv jalapeno /usr/local/bin/jalapeno
 
 ## Use via Docker
 
-It is possible to use jalapeno via Docker without installing it locally. Jalapeno image is available
+It is possible to use Jalapeno via Docker without installing it locally. Jalapeno image is available
 from the GitHub Container Registry, and thus the following command on a *nix system is equivalent
 to running `jalapeno` locally:
 
-MacOS and Linux:
-
-```bash
+```bash tab={"label":"MacOS and Linux"}
 docker run -it --rm -v $(pwd):/workdir ghcr.io/futurice/jalapeno:v0.1.4
 ```
 
-Windows Command Line:
-
-```batch
+```batch tab={"label":"Windows Command Line"}
 docker run -it --rm -v %cd%:/workdir ghcr.io/futurice/jalapeno:v0.1.4
 ```
 
-PowerShell:
-
-```powershell
+```powershell tab={"label":"PowerShell"}
 docker run -it --rm -v ${PWD}:/workdir ghcr.io/futurice/jalapeno:v0.1.4
 ```
 
@@ -75,3 +69,12 @@ task build
 ```
 
 After this the binary is available on path `./bin/jalapeno`.
+
+## Updating your Jalapeno version
+
+### Homebrew
+
+```bash tab={"label":"Homebrew"}
+brew update
+brew upgrade jalapeno
+```

docs/docusaurus.config.js

@@ -3,6 +3,7 @@
 
 const lightCodeTheme = require("prism-react-renderer/themes/github");
 const darkCodeTheme = require("prism-react-renderer/themes/dracula");
+const tabBlocksRemarkPlugin = require("docusaurus-remark-plugin-tab-blocks");
 
 /** @type {import('@docusaurus/types').Config} */
 const config = {
@@ -41,6 +42,9 @@ const config = {
           routeBasePath: "/",
           sidebarPath: require.resolve("./sidebars.js"),
           editUrl: "https://github.com/futurice/jalapeno/tree/main/docs/",
+          remarkPlugins: [
+            tabBlocksRemarkPlugin
+          ],
         },
         blog: false,
         theme: {

docs/package.json

@@ -19,6 +19,7 @@
     "@docusaurus/theme-mermaid": "^2.4.1",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.2.1",
+    "docusaurus-remark-plugin-tab-blocks": "^1.3.1",
     "prism-react-renderer": "^1.3.5",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"