Slatecave Widget Zoo

A testpage that should contain all the slatecave widgets for testing.


This is a section with some text inside.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus feugiat dolor ac leo auctor, in placerat risus tincidunt. Sed vehicula dolor a magna dignissim placerat. Aenean libero urna, sodales sed arcu at, tincidunt scelerisque dolor.

Pellentesque vestibulum quis neque eget blandit. Aenean nec mauris lobortis, aliquet lacus eget, suscipit diam. Nulla ultricies, tortor sed convallis vehicula, purus nulla posuere arcu, sed sodales tortor dui id ipsum. Aliquam dapibus, ex vel sodales pretium, nulla sem pulvinar nunc, sit amet mollis ante elit eu diam.

Proin imperdiet elementum luctus. Aliquam erat volutpat.

  1. Number one.
  2. Number 2.
  3. This one is important!

Definition Lists!

I just love definition lists!

sid amet

Usually there is some text here that explains what the mapping is all about.

to many
sid amet
Nunquam latinuum

Notes, Figures, Blocks and Friends …

Note: I also love to leave notes all over my writing!

Disclaimer: This is a test page in case you have not figured out yet!

Warning: Das -f steht für "vorsichtig"!

Just to test the mergins, here is some more text!

Note: The top margins should also be tested against regular paragraphs.


Also there are some things worth quoting:

Humans are allergic to change. They love to say, "We've always done it this way." I try to fight that. That's why I have a clock on my wall that runs counter-clockwise.

Grace Hopper

However, there are also Inline quotes which are ssometime useful.

Code blocks

Codeblocks are usually used for interesting code-snippets:


echo "I'm a relatively boring shellscript!"
echo "Btw: My filename is $0"

They also integrate with figures:

Usually I explain what the code is about here
print("I jsut some unrelated lua example.")
-- with a comment
local with = "a variable" and 42
And interesting conclusions, facts or a short explanation of the code itself go here.

Links, everyone loves some links, they show the path to even more knowledge! Or sometimes are just examples in a widget zoo.

Links comes in some varieties here, not just inline.

I'm a plain link button for important links.

Warning: These linkbuttons take a lot of space and draw attenion, use sparingly.

Link buttons can be decoratated for different destinations:

Decorated for documentation.

Decorated for code.

Decorated for listings.

Contact Information

Or for different actions:





When one has a lot of links it might also make sense to put them into a list:

Trivia Note: This link style originated from the fact that the first prototype of the slatecave could also produce gemtext.


This is a test preview

Previews are usually more than one in their own section like it is here, this spot usually contains a paragraph of description.

This is another test preview

Fusce sed tellus ac risus ornare molestie. Nunc arcu orci, blandit sit amet viverra a, congue eget purus. Proin lacinia urna eget nibh aliquet fringilla. Cras convallis odio neque.


While definition lists are very useful, sometimes one needs a table:

An overview of html tags.
Name Syntax Example
Italics <i>text</i> idiom
Bold <b>text</b> slightly important
Quote <q>text</q> Lorem Ipsum
Emphasis <em>text</em> watch out here
Strong (Emphasis) <strong>text</strong> I really mean it!

Note on Small Screens: Tables don't work too well on small screens, depside best effords on the stylesheet side, you shouldn't let tables get too wide.

Note on Screenreaders: Screenreaders work great with tables as long as they aren't abused for visualizing non-table data. Consider definition lists, nested lists and sections with appropritate headlines instead.