mirror of
https://github.com/hunvreus/basecoat.git
synced 2026-11-14 05:58:19 +00:00
36 lines
853 B
Plaintext
36 lines
853 B
Plaintext
---
|
|
layout: layouts/component.njk
|
|
title: Toast
|
|
description: A succinct message that is displayed temporarily.
|
|
---
|
|
|
|
{% from "macros/code_preview.njk" import code_preview %}
|
|
{% set code %}<button
|
|
class="btn-outline"
|
|
hx-trigger="click"
|
|
hx-get="/fragments/toast/success"
|
|
hx-target="#toast-htmx"
|
|
>
|
|
Toast from backend
|
|
</button>
|
|
<div id="toast-htmx"></div>{% endset %}
|
|
{{ code_preview("toast-htmx", code, "max-w-md") }}
|
|
|
|
{% from "macros/code_preview.njk" import code_preview %}
|
|
{% set code %}<button
|
|
class="btn-outline"
|
|
@click='
|
|
$toast({
|
|
category: "success",
|
|
title: "Great success",
|
|
description: "Tremendous success toast.",
|
|
action: {
|
|
label: "Go to Google",
|
|
url: "https://google.com"
|
|
}
|
|
})
|
|
'>
|
|
Toast from front-end
|
|
</button>
|
|
{% endset %}
|
|
{{ code_preview("toast-alpine", code, "max-w-md") }} |