Flow

Components

Link

Die Link-Komponente kann zur Navigation innerhalb der Seite oder zu externen Zielen genutzt werden.GitHub
Zum Dashboard

Beispiel

Zum Dashboard
import Link from "@mittwald/flow-react-components/Link";

<Link href="#">Zum Dashboard</Link>

Mit Icon

mittwald.de
import Link from "@mittwald/flow-react-components/Link";
import { IconExternalLink } from "@mittwald/flow-react-components/Icons";

<Link href="https://mittwald.de">
  mittwald.de
  <IconExternalLink aria-label="external link" />
</Link>

Inline

Benutze das inline Property wenn du den Link innerhalb eines Textblocks benutzen möchtest.

Inline link
import Link from "@mittwald/flow-react-components/Link";

<Link inline href="#">
  Inline link
</Link>

Links innerhalb der <Text /> Komponente werden automatisch als Inline Link gerendert.

Sieh dir unser Onboarding an um weitere Informationen zu erhalten.
import Link from "@mittwald/flow-react-components/Link";
import Text from "@mittwald/flow-react-components/Text";

<Text>
  Sieh dir unser <Link href="#">Onboarding</Link> an um
  weitere Informationen zu erhalten.
</Text>

Color Light und Dark

Dark

Zum Dashboard
import Link from "@mittwald/flow-react-components/Link";

<Link href="#" color="dark">
  Zum Dashboard
</Link>

Light

Zum Dashboard
import Link from "@mittwald/flow-react-components/Link";

<Link href="#" color="light">
  Zum Dashboard
</Link>
Feedback geben