Button Link
npx cascadekit add button-link
Files
Copied!
{%- liquid
assign button_variant = variant | default: 'primary'
assign button_href = href | default: '#'
assign button_classes = 'inline-flex min-h-11 items-center justify-center rounded-md px-6 py-3 text-sm font-semibold no-underline transition-colors'
case button_variant
when 'secondary'
assign button_classes = button_classes | append: ' border border-white bg-transparent text-white hover:bg-white hover:text-black'
when 'tertiary'
assign button_classes = button_classes | append: ' px-0 text-white underline underline-offset-4 hover:no-underline'
when 'transparent'
assign button_classes = button_classes | append: ' border border-white/60 bg-black/20 text-white hover:bg-black/35'
else
assign button_classes = button_classes | append: ' bg-white text-black hover:bg-white/90'
endcase
-%}
<a href="{{ button_href }}" class="{{ button_classes }}">
{{- text | escape -}}
</a>