Thinkport

Lorem ipsum

Dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.

WidgetWrapper

Widget-Container

Minimales Beispiel für die WidgetWrapper-Komponente.

Codebeispiel

<WidgetWrapper id="demo-section">
<div class="text-center">
  <h2>Lorem ipsum</h2>
  <p>Dolor sit amet, consetetur sadipscing elitr</p>
</div>
</WidgetWrapper>

Wiki-Dokumentation Quellcode

Responsive Breiten

Die WidgetWrapper-Komponente verwendet standardmäßig responsive Breiten-Klassen für eine einheitliche Darstellung auf allen Bildschirmgrößen:

Mobile (default): max-w-full - Volle Breite mit Padding
Tablet (md: 768px): md:max-w-3xl
Desktop (lg: 1024px): lg:max-w-5xl
Large Desktop (xl: 1280px): xl:max-w-6xl
Extra Large (2xl: 1536px): 2xl:max-w-7xl

Das Padding ist ebenfalls responsive: px-4 md:px-6