Phoenix Reisen Styleguide
Examples
Default styling
Ich wurde geklickt!
HTML Box

Ich beinhalte etwas mehr als nur einen kurzen Infotext.

Für mein Aussehen muss ich selbst sorgen.

Sogar einen Button:

.tip--component
rendert eine Box für HTML Content
Ich wurde geklickt!
HTML Box

Ich beinhalte etwas mehr als nur einen kurzen Infotext.

Für mein Aussehen muss ich selbst sorgen.

Sogar einen Button:

Markup
<div class="tc" style="height: 300px;">
    <article class="tooltip">
        Ich wurde geklickt!
        <span class="tip [modifier class] tip--below tip--visible">
            <!-- Individulles HTML -->
            <div class="whitegray pa3">
                <strong>HTML Box</strong>
                <p>Ich beinhalte etwas mehr als nur einen kurzen Infotext.</p>
                <p>Für mein Aussehen muss ich selbst sorgen.</p>
                <p>Sogar einen Button:</p>
                <button type="button">
                    Ich mache nichts
                </button>
            </div>
            <!-- /Individulles HTML -->
        </span>
    </article>
</div>
Source: src/components/_tooltip.scss, line 65