Content-Block v2

Content blocks present different content in areas.

Options

Option	Description
&.small|medium|large|xlarge	Changes the Padding of the Block and makes it look larger/smaller
&.no-bottom-padding	Sets back the padding-bottom to 0
&.no-top-padding	Sets back the padding-top to 0
&.no-padding	Sets back the padding to 0
&.overflow-hide	Setzt die overflow: hidden Option
&.{\$component-color}	Sets the background color to the component-color and the text-color to inverse

Markup

<div class="content-block v2">
    <h3>Heading</h3>
    <p>
        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, 
        sed diam nonumy eirmod tempor invidunt ut labore et dolore 
        magna aliquyam erat, sed diam voluptua. At vero eos et 
        accusam et justo duo dolores et ea rebum. Stet clita kasd 
        gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
    </p>
</div>

Example

Heading

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Component Colors

Heading &.primary

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.