Thinkport

Lorem ipsum dolor sit amet?

Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

CallToAction

Den Nutzer zu Interaktion anregen

Die CallToAction-Komponente dient dazu, Benutzer zu einer bestimmten Aktion zu motivieren. Sie kann mit einem oder mehreren Buttons konfiguriert werden und eignet sich besonders für verschiedene Zwecke wie Newsletter-Anmeldung, Kontaktaufnahme oder Produktdemo.

Codebeispiel

<CallToAction
    title="Lorem ipsum dolor sit amet?"
    subtitle="Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat."
    tagline="Lorem ipsum"
    actions={[{ variant: 'primary', text: 'Lorem ipsum', href: '/kontakt', target: '_blank' }, { variant: 'secondary', text: 'Consetetur sadipscing', href: '/ueber-uns' }]}
    isDark={false}
    classes={{ container: 'custom-container-class' }}
    bg={<div class="absolute inset-0 bg-blue-50 dark:bg-transparent"></div>}
  />

Parameter

Bezeichner	Typ	Beschreibung	Default
title	string	Titel der Komponente	-
subtitle	string	Untertitel der Komponente	-
tagline	string	Tagline über dem Titel	-
actions	CallToAction[]	Liste von Aktionen/Buttons	[]
isDark	boolean	Dunkles Design	false
classes	object	Zusätzliche CSS-Klassen	{}
bg	string	Hintergrundinhalt

Bezeichner

Typ

Beschreibung

Default

title

string

Titel der Komponente

subtitle

string

Untertitel der Komponente

tagline

string

Tagline über dem Titel

actions

CallToAction[]

Liste von Aktionen/Buttons

[]

isDark

boolean

Dunkles Design

false

classes

object

Zusätzliche CSS-Klassen

{}

string

Hintergrundinhalt

Fragments

Bezeichner	Beschreibung	Default
default	Standardinhalt

Bezeichner

Beschreibung

Default

default

Standardinhalt