added ability to make tables
This commit is contained in:
36
src/routes/Table.svelte
Normal file
36
src/routes/Table.svelte
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
<script>
|
||||||
|
let { data, header, row } = $props();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<table class="w-full table-fixed">
|
||||||
|
{#if header}
|
||||||
|
<thead>
|
||||||
|
<tr>{@render header()}</tr>
|
||||||
|
</thead>
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
<tbody>
|
||||||
|
{#each data as d}
|
||||||
|
<tr>{@render row(d)}</tr>
|
||||||
|
{/each}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
table {
|
||||||
|
text-align: left;
|
||||||
|
border-spacing: 0;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
tbody tr:nth-child(2n + 1) {
|
||||||
|
background: blue;
|
||||||
|
}
|
||||||
|
|
||||||
|
table :global(th),
|
||||||
|
table :global(td) {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user