List items as buttons 

How does it work? 

The t3SphinxThemeRtd theme for TYPO3 comes along with style that make the items of an unordered list appear as "buttons". To put this into action the <ul> tag needs to have one of the following (css-) classes.

To assign a class place a .. rst-class:: THENAME right in front of the list like so:

..  rst-class:: horizbuttons-attention-m

*   horizbuttons-attention-m
*   two
*   three `with link <#>`__
Copied!

Available styles 

horizbuttons-attention-m 

Like admonition attention (blue)

  • horizbuttons-attention-m
  • two
  • three with link

horizbuttons-important-m 

Like admonitions error, important (yellow)

  • horizbuttons-important-m
  • two
  • three with link

horizbuttons-note-m 

Like admonitions generic, note, see also (neutral, grey)

horizbuttons-primary-m 

Use the primary = key color (TYPO3 orange)

horizbuttons-striking-m 

Shall be very striking and unusual, something to not be be overseen.

  • horizbuttons-striking-m
  • two
  • three with link

horizbuttons-tip-m 

Like admonitions hint, tip (green)

horizbuttons-warning-m 

Like admonitions caution, danger, warning (red)

horizbuttons-attention-xxl 

Like admonition attention (blue)

  • horizbuttons-attention-xxl
  • two
  • three with link

horizbuttons-important-xxl 

Like admonitions error, important (yellow)

  • horizbuttons-important-xxl
  • two
  • three with link

horizbuttons-note-xxl 

Like admonitions generic, note, see also (neutral, grey)

horizbuttons-primary-xxl 

Use the primary = key color (TYPO3 orange)

  • horizbuttons-primary-xxl
  • two
  • three with link

horizbuttons-striking-xxl 

Shall be very striking and unusual, something to not be be overseen.

  • horizbuttons-striking-xxl
  • two
  • three with link

horizbuttons-tip-xxl 

Like admonitions hint, tip (green)

horizbuttons-warning-xxl 

Like admonitions caution, danger, warning (red)

  • horizbuttons-danger-xxl
  • two
  • three with link

horizbuttons-attention-xxxl 

Like admonition attention (blue)

  • horizbuttons-attention-xxxl
  • two
  • three with link

horizbuttons-important-xxxl 

Like admonitions error, important (yellow)

  • horizbuttons-important-xxxl
  • two
  • three with link

horizbuttons-note-xxxl 

Like admonitions generic, note, see also (neutral, grey)

horizbuttons-primary-xxxl 

Use the primary = key color (TYPO3 orange)

  • horizbuttons-primary-xxxl
  • two
  • three with link

horizbuttons-striking-xxxl 

Shall be very striking and unusual, something to not be be overseen.

  • horizbuttons-striking-xxxl
  • two
  • three with link

horizbuttons-tip-xxxl 

Like admonitions hint, tip (green)

horizbuttons-warning-xxxl 

Like admonitions caution, danger, warning (red)

  • horizbuttons-danger-xxxl
  • two
  • three with link