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
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
_href (required) | _href | Sets the target URI of the link or citation source. | string | undefined |
_label | _label | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | string | undefined | undefined |
_quote (required) | _quote | Defines the text of the quote. | string | undefined |
_variant | _variant | Defines which variant should be used for presentation. | "block" | "inline" | undefined | 'inline' |