2019-07-13 21:35:57 +12:00
|
|
|
<script>
|
2020-02-03 22:50:30 +13:00
|
|
|
export let errors = []
|
2019-07-13 21:35:57 +12:00
|
|
|
|
2020-02-03 22:50:30 +13:00
|
|
|
$: hasErrors = errors.length > 0
|
2019-07-13 21:35:57 +12:00
|
|
|
</script>
|
|
|
|
|
|
|
|
{#if hasErrors}
|
2020-10-03 06:49:00 +13:00
|
|
|
<div class="container bb__alert bb__alert--danger">
|
2019-07-13 21:35:57 +12:00
|
|
|
{#each errors as error}
|
2020-10-03 06:49:00 +13:00
|
|
|
<div class="error">{error.dataPath} {error.message}</div>
|
2019-07-13 21:35:57 +12:00
|
|
|
{/each}
|
2020-03-28 05:58:32 +13:00
|
|
|
</div>
|
2020-03-26 05:57:04 +13:00
|
|
|
{/if}
|
2020-10-03 06:49:00 +13:00
|
|
|
|
|
|
|
<style>
|
|
|
|
.container {
|
|
|
|
border-radius: var(--border-radius-m);
|
|
|
|
margin: 0;
|
|
|
|
padding: var(--spacing-m);
|
|
|
|
}
|
|
|
|
|
|
|
|
.error {
|
|
|
|
font-size: var(--font-size-xs);
|
|
|
|
font-weight: 500;
|
|
|
|
}
|
|
|
|
.error:first-letter {
|
|
|
|
text-transform: uppercase;
|
|
|
|
}
|
|
|
|
</style>
|