Markup Test

Date: 2025/02/23

Hello, world!

A Section

Hello again, world!

This is a section!

Another Section

This is a section with a custom id!

Text

The quick brown fox jumps over the lazy dog.

Fonts

Tags

Strong, Bold, Emphasized, Italic, Underline, Inserted, Deleted, Strikethrough, Small, Large, Extra Small, Extra Large, Marked, this should be quoted, x2, O3, ~/.config/helix/config.toml, ~/.config/helix, HTML (abbr), GNU (acronym).

Symbols

…, ‐, —, –, ↑, ↓, ←, →.

Keyboard

Alt+F4, Enter, Backspace, Return, Space, Tab, Shift, Compose, Ctrl, Meta, Super, Caps Lock, Esc.

Apple

Option, Command.

Commands

paru -Syu, pacman -Syu.

Figure

An example.
(print "Hello, world!")

Callouts

Lists

  1. Uno
  2. Two
  3. Tre

Tables

ABC
123
456

Source Code

(import ../../pages)
(import ../../markup)
(import ../../chronos)

(def page
  {:title "Markup Test"
   :path "/markup.html"
   :locale :en
   :date (chronos/make-date 2025 02 23)
   :content (markup/to-html
              @[[:p
                 "Hello, world!"]

                [:aside
                 [:p
                  "This is an aside!"]]

                [:section {:title "A Section"}
                 [:p
                  "Hello again, world!"]
                 [:p
                  "This is a section!"]]

                [:section {:title "Another Section" :id "section-with-id"}
                 [:p
                  "This is a section with a custom " [:var "id"] "!"]]

                [:section {:title "Text"}
                 [:p
                  "The quick brown fox jumps over the lazy dog."]]

                [:section {:title "Fonts"}
                 [:list
                  [:cursive "Cursive"]
                  [:fantasy "Fantasy"]
                  [:monospace "Monospace"]
                  [:sans-serif "Sans Serif"]
                  [:serif "Serif"]]]

                [:section {:title "Tags"}
                 [:p
                  [:sep {:by ", "}
                   [:strong "Strong"]
                   [:bold "Bold"]
                   [:emph "Emphasized"]
                   [:italic "Italic"]
                   [:under "Underline"]
                   [:ins "Inserted"]
                   [:del "Deleted"]
                   [:strike "Strikethrough"]
                   [:small "Small"]
                   [:large "Large"]
                   [:xsmall "Extra Small"]
                   [:xlarge "Extra Large"]
                   [:mark "Marked"]
                   @["this should be " [:quot "quoted"]]
                   @[[:var "x"] [:sup 2]]
                   @["O" [:sub 3]]
                   [:file "~/.config/helix/config.toml"]
                   [:directory "~/.config/helix"]
                   @[[:abbr {:title "HyperText Markup Language"} "HTML"] " (" [:code "abbr"] ")"]
                   @[[:acronym {:title "GNU's Not Unix"} "GNU"] " (" [:code "acronym"] ")"]]
                  "."]]

                [:section {:title "Symbols"}
                 [:p
                  [:sep {:by ", "}
                   :ellipsis
                   :dash
                   :mdash
                   :ndash
                   :arrowu
                   :arrowd
                   :arrowl
                   :arrowr]
                  "."]]

                [:section {:title "Keyboard"}
                 [:p
                  [:sep {:by ", "}
                   [:kbd [:key :alt] "+" [:kbd "F4"]]
                   [:key :enter] [:key :backspace]
                   [:key :return] [:key :space]
                   [:key :tab] [:key :shift]
                   [:key :compose] [:key :control]
                   [:key :meta] [:key :super]
                   [:key :capslock] [:key :escape]]
                  "."]

                 [:section {:title "Apple"}
                  [:p
                   [:sep {:by ", "}
                    [:key :option] [:key :command]]
                   "."]]

                 [:section {:title "Commands"}
                  [:p
                   [:sep {:by ", "}
                    [:command "paru -Syu"]
                    [:command {:root? true} "pacman -Syu"]]
                   "."]]

                 [:section {:title "Menu"}
                  [:p
                   [:sep {:by ", "}
                    [:menu "File"]
                    [:menu "File" "New..."]]
                   "."]]]

                [:section {:title "Figure"}
                 [:figure {:caption "An example."}
                  [:source `(print "Hello, world!")`]]]

                [:section {:title "Callouts"}
                 [:callout/note
                  [:p
                   "This is a note callout!"]]

                 [:callout/tip {:title "Life Pro Tip"}
                  [:p
                   "Breath."]]

                 [:callout/hint {:title @["A little hint" :ellipsis]}
                  [:p
                   "TODO: Hint text."]]

                 [:callout/important
                  [:p
                   "This is " [:emph "really"] " important"]]

                 [:callout/warning {:title "This callout has a warning!"}
                  [:p
                   "Consider yourself warned."]]

                 [:callout/caution
                  [:p
                   "Proceed with caution."]]

                 [:callout/question
                  [:p
                   "What?"]]

                 [:callout/tip {:title "Did You Know?"}
                  [:callout/note
                   [:p
                    "Callouts can be nested!"]

                   [:callout/warning
                    [:p
                     "Just make sure to not nest them too deeply" :ellipsis]]]]]

                [:section {:title "Lists"}
                 [:list
                  "meow"
                  "nya"
                  "mrrp"]

                 [:enum
                  "Uno"
                  "Two"
                  "Tre"]]

                [:section {:title "Tables"}
                 [:table {:head ["A" "B" "C"]}
                  ["1" "2" "3"]
                  ["4" "5" "6"]]]

                [:section {:title "Source Code"}
                 [:source (slurp (dyn *current-file*))]]])})