Toast - Web Component
...
Browser support
Parameters
The Web component uses a <z-toast> tag.
The parametrization of the component can be done with the following custom HTML params:
| Name | Type | Description |
|---|---|---|
config(optional) | string | |
timestamp(optional) | string | The timestamp of the toast. If not, current time is used |
content(optional) | string | The text of the toast |
Playground
Customization
HTML Examples
Imports
html
<link rel="stylesheet" href="/0.3.7/@zurich/web-components/styles.css" />
<script type="module" src="/0.3.7/@zurich/web-components/toast.js"></script>Code
html
<z-toast config="info" timestamp="15:46">Toast text</z-toast>
<z-toast config="alert" timestamp="15:46">Toast text</z-toast>
<z-toast config="positive" timestamp="15:46">Toast text</z-toast>
<z-toast config="negative" timestamp="15:46">Toast text</z-toast>