You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
38 lines
760 B
38 lines
760 B
2 years ago
|
<script>
|
||
|
|
import Icon from "$/client/components/Icon.svelte";
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
callout {
|
||
|
|
margin: 1rem;
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<callout>
|
||
|
|
<span>This is a normal callout example.</span>
|
||
|
|
</callout>
|
||
|
|
|
||
|
|
<callout class="success">
|
||
|
|
<span>This is a success callout example.</span>
|
||
|
|
</callout>
|
||
|
|
|
||
|
|
<callout class="warning">
|
||
|
|
<span>This is a warning callout example.</span>
|
||
|
|
</callout>
|
||
|
|
|
||
|
|
<callout class="alert">
|
||
|
|
<span>This is an alert callout example.</span>
|
||
|
|
</callout>
|
||
|
|
|
||
|
|
<callout class="info">
|
||
|
|
<span>This is an info callout example.</span>
|
||
|
|
</callout>
|
||
|
|
|
||
|
|
<h2>Callout with Badges</h2>
|
||
|
|
|
||
|
|
<callout class="alert">
|
||
|
|
<span>This is an alert callout example with a badge.</span>
|
||
|
|
<badge class="top-right"><Icon name="alert-triangle" width="2px" size="18px" /></badge>
|
||
|
|
</callout>
|