till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-14 20:41:09 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix(manacore): fix dashboard grid layout - widgets were col-span-1

Browse source 
The animate:flip wrapper div in DashboardGrid was not passing through
the col-span classes, causing all widgets to render at minimum width.
Moved size classes from WidgetContainer to the grid wrapper div.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-03-24 11:49:12 +01:00
parent e060884881
commit 954b204bac
2 changed files with 4 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

3
apps/manacore/apps/web/src/lib/components/dashboard/DashboardGrid.svelte
View file

@ -8,6 +8,7 @@
import { dndzone, type DndEvent } from 'svelte-dnd-action';
import { flip } from 'svelte/animate';
import type { WidgetConfig } from '$lib/types/dashboard';
import { WIDGET_SIZE_CLASSES } from '$lib/types/dashboard';
import { dashboardStore } from '$lib/stores/dashboard.svelte';
import WidgetContainer from './WidgetContainer.svelte';
@ -44,7 +45,7 @@
onfinalize={handleFinalize}
>
{#each items as widget (widget.id)}
<div animate:flip={{ duration: flipDurationMs }}>
<div class={WIDGET_SIZE_CLASSES[widget.size]} animate:flip={{ duration: flipDurationMs }}>
<WidgetContainer {widget} />
</div>
{/each}

5
apps/manacore/apps/web/src/lib/components/dashboard/WidgetContainer.svelte
View file

@ -9,7 +9,7 @@
import { _ } from 'svelte-i18n';
import { Card } from '@manacore/shared-ui';
import type { WidgetConfig, WidgetSize } from '$lib/types/dashboard';
import { WIDGET_SIZE_CLASSES, getWidgetMeta } from '$lib/types/dashboard';
import { getWidgetMeta } from '$lib/types/dashboard';
import { dashboardStore } from '$lib/stores/dashboard.svelte';
// Widget components
@ -37,7 +37,6 @@
let { widget }: Props = $props();
const meta = $derived(getWidgetMeta(widget.type));
const sizeClasses = $derived(WIDGET_SIZE_CLASSES[widget.size]);
const sizes: WidgetSize[] = ['small', 'medium', 'large', 'full'];
const sizeLabels: Record<WidgetSize, string> = {
@ -78,7 +77,7 @@
const WidgetComponent = $derived(widgetComponents[widget.type]);
</script>
<div class={sizeClasses}>
<div>
<Card class="relative h-full">
<!-- Edit Mode Overlay -->
{#if dashboardStore.isEditing}