mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2025-08-04 05:18:19 +00:00
49 lines
1 KiB
Svelte
49 lines
1 KiB
Svelte
<script lang="ts">
|
|
import { type WidgetTable as WidgetTableFromJsMessages } from "@graphite/messages";
|
|
|
|
import WidgetSpan from "@graphite/components/widgets/WidgetSpan.svelte";
|
|
|
|
|
|
interface Props {
|
|
widgetData: WidgetTableFromJsMessages;
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
layoutTarget: any; // TODO: Give this a real type
|
|
}
|
|
|
|
let { widgetData, layoutTarget }: Props = $props();
|
|
</script>
|
|
|
|
<table>
|
|
<tbody>
|
|
{#each widgetData.tableWidgets as row}
|
|
<tr>
|
|
{#each row as cell}
|
|
<td>
|
|
<WidgetSpan widgetData={{ rowWidgets: [cell] }} {layoutTarget} />
|
|
</td>
|
|
{/each}
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
|
|
<style lang="scss">
|
|
table {
|
|
background: var(--color-3-darkgray);
|
|
border: none;
|
|
border-spacing: 4px;
|
|
border-radius: 2px;
|
|
|
|
td {
|
|
background: var(--color-2-mildblack);
|
|
vertical-align: top;
|
|
border: none;
|
|
border-radius: 2px;
|
|
padding: 4px 8px;
|
|
}
|
|
|
|
tr:first-child td {
|
|
background-image: var(--inheritance-dots-background-4-dimgray);
|
|
}
|
|
}
|
|
</style>
|