mittwald Flow Logo

Components

Align

Die Align Komponente dient dazu Komponenten miteinander zu kombinierenGitHub
MM
Max MustermannOrganisationsinhaber

Avatar + Text

MM
Max MustermannOrganisationsinhaber
import { Align } from "@mittwald/flow-react-components/Align";
import { Avatar } from "@mittwald/flow-react-components/Avatar";
import { Initials } from "@mittwald/flow-react-components/Initials";
import { Text } from "@mittwald/flow-react-components/Text";

<Align>
  <Avatar>
    <Initials>Max Mustermann</Initials>
  </Avatar>
  <Text>
    <b>Max Mustermann</b>
    Organisationsinhaber
  </Text>
</Align>

Input + Button

import { Align } from "@mittwald/flow-react-components/Align";
import { TextField } from "@mittwald/flow-react-components/TextField";
import { Label } from "@mittwald/flow-react-components/Label";
import { Button } from "@mittwald/flow-react-components/Button";

<Align>
  <TextField>
    <Label>Weiterleitungsziel</Label>
  </TextField>
  <Button>Hinzufügen</Button>
</Align>

Text + CopyButton

mail.agenturserver.de
import { Align } from "@mittwald/flow-react-components/Align";
import { Text } from "@mittwald/flow-react-components/Text";
import { CopyButton } from "@mittwald/flow-react-components/CopyButton";

<Align>
  <Text>mail.agenturserver.de</Text>
  <CopyButton text="mail.agenturserver.de" />
</Align>
Feedback geben