Reformat readme

README.md

@@ -1,3 +1,4 @@
+[preview]:              https://minidiscordthemes.github.io/Demonstration/preview/preview.png
 [preview-dark]:         https://minidiscordthemes.github.io/Demonstration/preview/preview-dark.png
 [preview-light]:        https://minidiscordthemes.github.io/Demonstration/preview/preview-light.png
 [preview-neobrutal]:    https://minidiscordthemes.github.io/Demonstration/preview/preview-neobrutal.png
@@ -39,23 +40,34 @@
 
 ***A Discord theme for demonstrating Discord themes.***
 
-| Dark mode                                 | Light mode                                 |
+![Demonstration banner][preview]
+
+| Demonstrating themes in dark mode         | Demonstrating themes in light mode         |
 | ----------------------------------------- | ------------------------------------------ |
-| ![Default dark mode][preview-dark]        | ![Default light mode][preview-light]       |
-| ![Synthesis dark mode][preview-synthesis] | ![Neobrutal light mode][preview-neobrutal] |
-| ![Tritone dark mode][preview-tritone]     | ![Ninex light mode][preview-ninex]         |
+| ![Synthesis dark mode][preview-synthesis] | ![Ninex light mode][preview-ninex]         |
+| ![Tritone dark mode][preview-tritone]     | ![Neobrutal light mode][preview-neobrutal] |
+
+<!-- | ![Default dark mode][preview-dark]        | ![Default light mode][preview-light]       | -->
 
 ## Installation
+Install a client mod, then follow the instructions below.
 
 ### [BetterDiscord][BetterDiscord]
+<details>
+    <summary>Click to expand</summary>
+
 1. Download `Demonstration.theme.css`:
     <!-- - [BetterDiscord store][release-bd] -->
     - [GitHub][release-bd-gh]
 2. Place the file in the themes folder:
     - `Settings` > `BetterDiscord` > `Themes` > `Open Themes Folder`
 3. Toggle on the theme card.
+</details>
 
 ### [Replugged][Replugged]
+<details>
+    <summary>Click to expand</summary>
+
 #### Automatic
 1. Click to install:
     - [Replugged store][release-rp]
@@ -65,8 +77,12 @@
 2. Place the file in the themes folder:
     - `Settings` > `Replugged` > `Themes` > `Open Themes Folder`
 3. Click `Load Missing Themes` and toggle on the theme card.
+</details>
 
 ### [Vencord][Vencord]
+<details>
+    <summary>Click to expand</summary>
+
 #### Local
 1. Download `Demonstration.theme.css`:
     <!-- - [BetterDiscord store][release-bd] -->
@@ -77,34 +93,47 @@
 #### Online
 1. Paste the link in `Settings` > `Vencord` > `Themes` > `Online Themes`:
     - `https://minidiscordthemes.github.io/Demonstration/Demonstration.theme.css`
+</details>
 
 ## Customisation
-
-| Variable               | Description                           | Valid values                       | Default value |
-| ---------------------- | ------------------------------------- | ---------------------------------- | ------------- |
-| `--demo-font-variant`  | Censored font style                   | `Circular` or `Rounded` or `Block` | `Circular`    |
-| `--demo-font-emoji`    | Emoji font style                      | `Noto` or `none`                   | `Noto`        |
-| `--demo-text`          | Show or censor text                   | `normal` or `censor`               | `censor`      |
-| `--demo-clientmod`     | Show or hide client mod elements      | `visible` or `hidden`              | `visible`     |
-| `--demo-emoji-radius`  | Additional corner rounding for emojis | Any [length][css-length].          | `4px`         |
-| `--demo-emoji-opacity` | Opacity for emojis                    | `0` to `1`.                        | `0.5`         |
-| `--demo-icon-hue`      | Hue for icons, emojis, badges         | `0` to `360`.                      | `240`         |
-| `--demo-image-hue`     | Hue for image attachments             | `0` to `360`.                      | `270`         |
-| `--demo-banner-hue`    | Hue for server banners                | `0` to `360`.                      | `180`         |
-| `--demo-self-hue`      | Hue for your own avatar               | `0` to `360`.                      | `300`         |
+To edit the following variables, follow the instructions for your client mod.
+
+| Variable               | Description                          | Valid values                       | Default value |
+| ---------------------- | ------------------------------------ | ---------------------------------- | ------------- |
+| `--demo-font-variant`  | Font style for censored text         | `Circular` or `Rounded` or `Block` | `Circular`    |
+| `--demo-font-emoji`    | Font style for emojis                | `Noto` or `none`                   | `Noto`        |
+| `--demo-text`          | Toggle text censor                   | `censor` or `normal`               | `censor`      |
+| `--demo-clientmod`     | Toggle client mod element visibility | `visible` or `hidden`              | `visible`     |
+| `--demo-emoji-radius`  | Corner rounding for emojis           | Any [length][css-length]           | `4px`         |
+| `--demo-emoji-opacity` | Opacity for emojis                   | `0` to `1`                         | `0.5`         |
+| `--demo-icon-hue`      | Hue for icons, emojis, badges        | `0` to `360`                       | `240`         |
+| `--demo-image-hue`     | Hue for image attachments            | `0` to `360`                       | `270`         |
+| `--demo-banner-hue`    | Hue for server banners               | `0` to `360`                       | `180`         |
+| `--demo-self-hue`      | Hue for your own avatar              | `0` to `360`                       | `300`         |
 
 ### BetterDiscord
+<details>
+    <summary>Click to expand</summary>
+
 1. Open `Settings` > `BetterDiscord` > `Themes`.
 2. Click the pencil icon on this theme.
 3. Edit the variable values and save changes.
+</details>
 
 ### Replugged
+<details>
+    <summary>Click to expand</summary>
+
 1. Enable `Automatically Apply Quick CSS` in `Settings` > `Replugged` > `General`.
 2. Open `Settings` > `Replugged` > `Quick CSS`.
 3. Copy and paste lines 15-27 of [`Demonstration.theme.css`][.theme.css].
 4. Edit the variable values and save.
+</details>
 
 ### Vencord
+<details>
+    <summary>Click to expand</summary>
+
 #### Local
 1. `Open Themes Folder` in `Settings` > `Vencord` > `Themes` > `Local Themes`
 2. Open `Demonstration.theme.css` with your favourite text editor.
@@ -113,11 +142,12 @@
 1. `Enable Custom CSS` in `Settings` > `Vencord` > `Vencord` and click `Open QuickCSS File`.
 2. Copy and paste lines 15-27 of [`Demonstration.theme.css`][.theme.css].
 3. Edit the variable values.
+</details>
 
 ## License
 [MIT License][license]
 - <span title="Too long; didn't read; not a lawyer">TL;DR;NAL</span>: Do whatever you want with this theme, just include the original license.
 
 ## Questions or suggestions?
-- Post [an issue][issues] on GitHub.
-- Post in `#theme-support` on [my support server][discord].
+- [Post an issue on GitHub.][issues]
+- [Post in `#theme-support` on my support server.][discord]