Phlex Components
x
1
2
3
4
5
6
<div>
  <div class="backdrop-blur relative w-full ring-1 ring-inset rounded-lg px-4 py-4 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg~*]:pl-8 ring-border bg-muted/20 text-foreground [&>svg]:opacity-80">
    <h5 class="mb-1 font-medium leading-none tracking-tight">Pro tip</h5>
    <div class="text-sm [&_p]:leading-relaxed">With PhlexUI you'll ship faster.</div>
  </div>
</div>
1
2
3
4
5
6
render(TestView.new) do
  Alert(variant:) do
    AlertTitle { "Pro tip" }
    AlertDescription { "With PhlexUI you'll ship faster." }
  end
end

Default Alert

Param Description Input

—