mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-21 18:58:12 +08:00
Keavon Chambers
8a1dfb9d8f
* Fix gamma correction with HTML-based editable Text tool text * Migrate simple, undecorated classes to types * Remove TupleToVec2 transformation * Remove @Transform from tooltips * Cleanup: replace value.toString() with String(value) everywhere * Convert documentId from string to bigint * Migrate the rest of the easy @Transform/@Type decorations * Migrate FillChoice * Migrate WidgetDiffUpdate * Migrate WidgetInstance * Migrate away from classes that extend WidgetProps * Remove class-transformer and all classes in messages.ts * Migrate UI layout passing * Remove dead code * Remove unnecessary export and readonly prefixes * Remove HSVA type * Break out Color, Gradient, and FillChoice functions into a utility-functions file * Move widget helper functions from messages.ts into a new utility-functions file; restructure type imports * Reduce internal type defs * Rename JsMessage to FrontendMessage * Code review fixes * Fix other usages * Tidying up
47 lines
1.1 KiB
Svelte
47 lines
1.1 KiB
Svelte
<script lang="ts">
|
|
import type { LayoutTarget, WidgetTable as WidgetTableData } from "@graphite/messages";
|
|
|
|
import WidgetSpan from "@graphite/components/widgets/WidgetSpan.svelte";
|
|
|
|
export let widgetData: WidgetTableData;
|
|
export let layoutTarget: LayoutTarget;
|
|
export let unstyled = false;
|
|
|
|
$: columns = widgetData.tableWidgets.length > 0 ? widgetData.tableWidgets[0].length : 0;
|
|
</script>
|
|
|
|
<table class:unstyled>
|
|
<tbody>
|
|
{#each widgetData.tableWidgets as row}
|
|
<tr>
|
|
{#each row as cell}
|
|
<td colspan={row.length < columns ? columns - row.length + 1 : undefined}>
|
|
<WidgetSpan widgetData={{ rowWidgets: [cell] }} {layoutTarget} narrow={true} />
|
|
</td>
|
|
{/each}
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
|
|
<style lang="scss" global>
|
|
table:not(.unstyled) {
|
|
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>
|