Tailwind removes the styling on standard links so we provide an easy way to re-add them. This works very similarly to the link_to helper in Rails.
Basic links are styled with the .link class. The title and href
options can be passed as keyword arguments, or as the first two positional
arguments.
The title can also be passed as a block.
Links support icon, left_icon, and right_icon options just like
buttons. You can use these to add icons to the left and/or right of the
link text.
.flex.flex-wrap.items-end.gap-x-4.gap-y-2
= daisy_link title: "Home", href: "#", icon: "home"
= daisy_link title: "Settings", href: "#", icon: "cog-6-tooth", css: "link-primary"
= daisy_link title: "Navigate", href: "#", left_icon: "arrow-left", right_icon: "arrow-right", css: "link-secondary"
Links accept a first-class action option — Stimulus data-action sugar
— just like buttons and the Turbo options, so you don't have to
hand-write a nested html: { data: { action: … } } hash. Stimulus infers
the click event, so action: "controller#method" is shorthand for
action: "click->controller#method".
When a link only drives a controller (rather than navigating), have the
controller call event.preventDefault() — or omit href entirely — so
the browser doesn't follow the link. The example below points at a real
page, but shows the rendered data-action.
Create virtual credit / debit cards to keep your real info safe.
Get $5 when you sign up — free to start!
Everything you need to grow your business with confidence!
CRM, Lead Generation, Project Management, Contracts, Online Payments, and more!
The ads above are affiliate links to products I regularly use and highly
recommend.
I may receive a commission if you decide to purchase.