Editing Playground

Custom colors and markers

Elemental colors

Legible on the Navy theme but on the Light theme they are not exactly great.

  • Sol
    <span class="sol">Sol</span>
  • Luna
    <span class="luna">Luna</span>
  • Dark
    <span class="dark">Dark</span>
  • Flame
    <span class="flame">Flame</span>
  • Frost
    <span class="frost">Frost</span>
  • Earth
    <span class="earth">Earth</span>
  • Cloud
    <span class="cloud">Cloud</span>

Markers

Used to mark headers and strategies. Font color changes on hover.

  • Safety / Backup strat
    <span class="safety">Safety / Backup strat</span>
  • Trap
    <span class="trap">Trap</span>
  • Mission
    <span class="mission">Mission</span>
  • Boss fight
    <span class="boss">Boss fight</span>
  • Purification
    <span class="purification">Purification</span>
  • Puzzle
    <span class="puzzle">Puzzle</span>

Video embeds

Make sure you use the /embed/ URL.
Set aspect-ratio to the aspect ratio of your video. Usually 16/9 but direct GBA exports are 3/2.
Title is not important but it helps to identify the video when you don't have a markdown preview.

<iframe
  style="aspect-ratio: 2/1"
  src="https://www.youtube.com/embed/uHMaErqqU_E"
  title="Boktai 1 28 Dungeons in 2:16:15"
  allowfullscreen
></iframe>

Interactive elements

You can use javascript within a book, which allows for some interactivity.
Below is a simple example but theoretically that allows for

  • conditional Guides that show/hide strats based user input
  • inlined tools like calculators, RNG manip helpers, ...
  • etc.

Example:
Write something here:
Then press this to show it as a popup.

Admonishments

These are styled messages that can have an icon, a color, a title and can be collapsible.
Documentation: https://tommilligan.github.io/mdbook-admonish/
Some examples:

Info

A beautifully styled message.

Data loss

The following steps can lead to irrecoverable data corruption.

Box without a title.

Markdown and HTML

Markdown and HTML can be used in the inner content and title.

Tip

Runnable rust code within an admonishment:

fn main() {
  println!("Hello, World!");
}

Collapsible:

Note

Collapsible.

Collapsible with no title:

Collapsible and no title

Table of Contents

The table of contents doesn't work correctly for level 5+ headers, so please avoid those.

ToC Level 3

Lorem ipsum dolor sit amet

ToC Level 4

Lorem ipsum dolor sit amet

ToC Level 5

The header is now smaller than the text + RIP ToC

ToC Level 6

The header is now smaller than the text + RIP ToC