This commit is contained in:
1 parent
ee67a5206d
commit
93eac7e146
1 file changed
+14
-3
@@ -1,10 +1,17 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { Snippet } from 'svelte';
|
import type { Snippet } from 'svelte';
|
||||||
let { children }: { children: Snippet } = $props();
|
|
||||||
|
let {
|
||||||
|
children,
|
||||||
|
striped = true
|
||||||
|
}: {
|
||||||
|
children: Snippet;
|
||||||
|
striped?: boolean;
|
||||||
|
} = $props();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="table-container">
|
<div class="table-container">
|
||||||
<table class="data-table">
|
<table class="data-table" class:striped>
|
||||||
{@render children()}
|
{@render children()}
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
@@ -58,7 +65,11 @@
|
|||||||
transition: background-color 0.2s ease;
|
transition: background-color 0.2s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:global(.data-table.striped tbody tr:nth-child(even)) {
|
||||||
|
background-color: rgba(0, 0, 0, 0.025);
|
||||||
|
}
|
||||||
|
|
||||||
:global(.data-table tbody tr:hover) {
|
:global(.data-table tbody tr:hover) {
|
||||||
background-color: rgba(0, 0, 0, 0.02);
|
background-color: rgba(0, 0, 0, 0.05);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in new issue
Block a user