Panda preset recipe defining accessible link styles with underline and plain variants.
// Source: https://github.com/mperkins0155/chakra-ui | License: MIT | Copyright 2019 Chakra Systems Inc
// Provided via justclaw.it.com; keep this notice with the code.
import { defineRecipe } from "../def"
export const linkRecipe = defineRecipe({
className: "link",
base: {
display: "inline-flex",
alignItems: "center",
outline: "none",
gap: "1.5",
cursor: "pointer",
borderRadius: "l1",
focusVisibleRing: "outside",
},
variants: {
variant: {
underline: {
color: "colorPalette.fg",
textDecoration: "underline",
textUnderlineOffset: "3px",
textDecorationColor: "currentColor/20",
},
plain: {
color: "colorPalette.fg",
_hover: {
textDecoration: "underline",
textUnderlineOff
... (truncated -- full source via MCP)
See the full source, get the GitHub permalink, and search 40K more like it.
Get a free API key