carbon-components-svelte/docs/src/pages/components/ToastNotification.svx
Eric Liu 63e7965745
Fixes (#575)
* fix(context-menu): only prevent default keydown behavior if menu is open

* docs(notification): update copy

* docs(select): update item groups example to use hidden default option

* docs: increase max-height to render UIShell, UnorderedList items

* fix(ui-shell): remove iconDescription prop from HeaderNavMenu #566

Fixes #566
2021-03-20 16:28:29 -07:00

34 lines
2.3 KiB
Text

---
source: Notification/ToastNotification.svelte
---
<script>
import { ToastNotification } from "carbon-components-svelte";
import Preview from "../../components/Preview.svelte";
</script>
### Default (error)
<ToastNotification title="Error" subtitle="An internal server error occurred." caption="{new Date().toLocaleString()}" />
### Hidden close button
<ToastNotification hideCloseButton kind="warning" title="Scheduled maintenance" subtitle="Maintenance will last 2-4 hours." caption="{new Date().toLocaleString()}" />
### Notification variants
<ToastNotification kind="error" title="Error" subtitle="An internal server error occurred." caption="{new Date().toLocaleString()}" />
<ToastNotification kind="info" title="New updates" subtitle="Restart to get the latest updates." caption="{new Date().toLocaleString()}" />
<ToastNotification kind="info-square" title="New updates" subtitle="Restart to get the latest updates." caption="{new Date().toLocaleString()}" />
<ToastNotification kind="success" title="Success" subtitle="Your settings have been saved." caption="{new Date().toLocaleString()}" />
<ToastNotification kind="warning" title="Scheduled maintenance" subtitle="Maintenance will last 2-4 hours." caption="{new Date().toLocaleString()}" />
<ToastNotification kind="warning-alt" title="Scheduled maintenance" subtitle="Maintenance will last 2-4 hours." caption="{new Date().toLocaleString()}" />
### Low contrast
<ToastNotification lowContrast kind="error" title="Error" subtitle="An internal server error occurred." caption="{new Date().toLocaleString()}" />
<ToastNotification lowContrast kind="info" title="New updates" subtitle="Restart to get the latest updates." caption="{new Date().toLocaleString()}" />
<ToastNotification lowContrast kind="info-square" title="New updates" subtitle="Restart to get the latest updates." caption="{new Date().toLocaleString()}" />
<ToastNotification lowContrast kind="success" title="Success" subtitle="Your settings have been saved." caption="{new Date().toLocaleString()}" />
<ToastNotification lowContrast kind="warning" title="Scheduled maintenance" subtitle="Maintenance will last 2-4 hours." caption="{new Date().toLocaleString()}" />
<ToastNotification lowContrast kind="warning-alt" title="Scheduled maintenance" subtitle="Maintenance will last 2-4 hours." caption="{new Date().toLocaleString()}" />