Styleguide

General Blocks, Typography & Colors

The site title is an H1 heading, set in the Blackout font, as are the H2 headings. Smaller sub-headings may be used to structure content:

H3 Some Headline

H4 Some Headline

H5 Some Headline

H6 Some Headline

There are some inline text settings available. Like linking to another page or setting text in bold, italic or even the different theme colors.

Some blocks, like this paragraph, may appear with a background and/or text color chosen from the themes color palette.

Downloadable documents may be added using the “File” block. For links ending on .pdf a small hint is displayed next to the link.

Quotes

Blockquotes appear with a wave. When the text is lengthy, the wave sticks to the bottom of the blockquote. Quotation marks are inserted automatically.

One still needs to have Chaos inside to give birth to a dancing star.

F. Nietzsche

Liebe ist die Kraft, die Alles verbindet. Es ist mein Ziel mehr Menschen durch Liberation in die Lage zu bringen, ihrem Herzen folgend freie Liebe zu leben und dabei den Verstand als Werkzeug zur Problemlösung zu benutzen anstatt sich vom eigenen Verstand und dessen Inhalten dominieren zu lassen.

Mariana Pinzón

Tables

Tables must only be used to present tabular data. (Avoid using tables to position elements in a specific way; use Columns instead to create layouts.)

Tables may be styled in different ways. The header-, footer- and caption-content is optional.

Table style “Default”

Complete table with header, footer and caption.

English	Novice language
Calmness	C1 Nurturing Safety
Confindence	C2 Emotional Spaciousness
Clarity or Confusion	C3 Conceptual Flexibility
Compassion	C4 Loving Heremit
Connected	C5 Sensual Gelassenheit
Curiosity	C6 Playful Magickian
Creativity	C7 Archetypical Shapeshifter
Courage	C8 Emptiness and Silence
To be honest, I like the letter C as initial (table-footer for meta-info or sources)	8 Circuit Brain model (table-footer for meta-info or sources)

Table style “Simple Listing”

The style “Simple Listing” removes any borders and background, leaving us with an invisible table gutter.
This example also demonstrates the most basic table usage without header, footer or caption.

Calmness	C1 Nurturing Safety
Confindence	C2 Emotional Spaciousness
Clarity or Confusion	C3 Conceptual Flexibility
Compassion	C4 Loving Heremit
Connected	C5 Sensual Gelassenheit
Curiosity	C6 Playful Magickian
Creativity	C7 Archetypical Shapeshifter
Courage	C8 Emptiness and Silence

Table style “Stripes”

More stripes for more clarity. And in this case without fixed column layout.

English	Novice Language
Calmness	C1 Nurturing Safety
Confindence	C2 Emotional Spaciousness
Clarity or Confusion	C3 Conceptual Flexibility
Compassion	C4 Loving Heremit
Connected	C5 Sensual Gelassenheit
Curiosity	C6 Playful Magickian
Creativity	C7 Archetypical Shapeshifter
Courage	C8 Emptiness and Silence

Media

Image

Images may be uploaded to WordPress in high resolution and are resized on the server for different output sizes.

Default image include:

Default image include in size “Medium” with style “Rounded”:

Image with text overlay:

Full with image with text overlay and scroll-fixed background image:

Wide image:

Full width image:

Video

Videos are not uploaded to the Mediathek, but hosted via some video-streaming provider like Youtube or Vimeo. The external file may be embedded using the “Video” block.

Gallery

A gallery is a group of multiple images, which are linking to themselves and are displayed in lightbox-like overlay.

• 

• 

• 

• 

• 

Groups (Teaser)

Group blocks can be used to visually combine several other blocks and thus create varying teasers.

Columns