Flow

Components

Accordion

Das Accordion dient dazu Content-Bereiche ein- und auszublenden.GitHub

Beispiel

import Heading from "@mittwald/flow-react-components/Heading";
import Accordion from "@mittwald/flow-react-components/Accordion";
import Content from "@mittwald/flow-react-components/Content";

<Accordion>
  <Heading>Accordion Titel</Heading>
  <Content>Inhalt des Accordions</Content>
</Accordion>

DefaultExpanded

import Heading from "@mittwald/flow-react-components/Heading";
import Accordion from "@mittwald/flow-react-components/Accordion";
import Content from "@mittwald/flow-react-components/Content";

<Accordion defaultExpanded>
  <Heading>Accordion Titel</Heading>
  <Content>Inhalt des Accordions</Content>
</Accordion>

Outline Variant

import Accordion from "@mittwald/flow-react-components/Accordion";
import Content from "@mittwald/flow-react-components/Content";
import Heading from "@mittwald/flow-react-components/Heading";

<Accordion variant="outline">
  <Heading>Accordion Titel</Heading>
  <Content>Inhalt des Accordions</Content>
</Accordion>

Mit Label

import Accordion from "@mittwald/flow-react-components/Accordion";
import Content from "@mittwald/flow-react-components/Content";
import Label from "@mittwald/flow-react-components/Label";

<Accordion>
  <Label>Accordion Titel</Label>
  <Content>Inhalt des Accordions</Content>
</Accordion>
Feedback geben