2021-09-16 02:00:52 +08:00
|
|
|
<script>
|
|
|
|
|
export let title;
|
|
|
|
|
</script>
|
|
|
|
|
|
2021-12-28 23:55:14 +01:00
|
|
|
<div class="crd">
|
2021-12-28 01:06:01 +01:00
|
|
|
{#if title}
|
2021-12-28 23:55:14 +01:00
|
|
|
<h1 class="crd-hdr">{title}</h1>
|
2021-12-28 01:06:01 +01:00
|
|
|
{/if}
|
2021-09-17 23:18:06 +08:00
|
|
|
<slot />
|
2021-09-16 02:00:52 +08:00
|
|
|
</div>
|
2022-02-06 18:19:38 +01:00
|
|
|
|
|
|
|
|
<style lang="postcss" global>
|
|
|
|
|
@tailwind base;
|
|
|
|
|
@tailwind components;
|
|
|
|
|
@tailwind utilities;
|
|
|
|
|
|
|
|
|
|
@layer components {
|
|
|
|
|
.crd {
|
2022-02-07 23:40:00 +01:00
|
|
|
@apply w-full mb-2 p-2 sm:p-2 md:p-2 lg:p-2 xl:px-8 xl:py-4 2xl:px-8 2xl:py-4 bg-white shadow-md lg:shadow-lg border border-gray-200 rounded-lg;
|
2022-02-06 18:19:38 +01:00
|
|
|
}
|
|
|
|
|
.crd-hdr {
|
|
|
|
|
@apply text-center text-lg text-gray-500 font-bold pb-4;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
