Zum Hauptinhalt springen

Quote

Diese neue Komponente wird als ungetestet markiert, da der vollständige Barrierefreiheitstest noch aussteht. Der vollständige Test kann bei neuen Komponenten und Funktionalitäten auch erst nach einem abgeschlossenen Release erfolgen.

Die Quote-Komponente verfügt über zwei Varianten, eine kurze Fließtext-(inline) und eine eingerückte(block) Variante. Beide Varianten enthalten einen Link auf die Quelle des Zitates.

Konstruktion

Code

<kol-quote
_label="RFC 1149"
_href="https://datatracker.ietf.org/doc/html/rfc1149"
_quote="Avian carriers can provide high delay, low throughput, and low altitude
service. The connection topology is limited to a single point-to-point path
for each carrier, used with standard carriers, but many carriers can be used
without significant interference with each other, outside early spring.
This is because of the 3D ether space available to the carriers, in contrast
to the 1D ether used by IEEE802.3. The carriers have an intrinsic collision
avoidance system, which increases availability."
_variant="block"
>
</kol-quote>
<kol-quote
_label="RFC 1149"
_href="https://datatracker.ietf.org/doc/html/rfc1149"
_quote="Avian carriers can provide high delay."
_variant="inline"
></kol-quote>

Beispiele

Verwendung

Mittels _label kann eine Überschrift gesetzt werden, während _quote das eigentliche Zitat enthält. Der Ursprung wird über _href gesetzt. Die inline-Variante ist Standard, sofern die Eingerückte gewünscht ist, kann _variant auf block gesetzt werden.

References

Properties

PropertyAttributeDescriptionTypeDefault
_href (required)_hrefSets the target URI of the link or citation source.stringundefined
_label_labelDefines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).string | undefinedundefined
_quote (required)_quoteDefines the text of the quote.stringundefined
_variant_variantDefines which variant should be used for presentation."block" | "inline" | undefined'inline'

Dependencies

Depends on

Graph


Live-Editor