feat(quick-260916-bwo): Abstaende halbiert — Seitenrahmen p-3 (alle Seiten), Dashboard p-2, Grid 8 px, Widget-Innenabstaende

- app-shell.tsx: main p-3 (12 px statt 24) — gilt fuer alle Seiten, Nachtrag des Users
- page.tsx: Container relative p-2, Umschalter right-2 top-2; mt-8 bleibt (Umschalter 36 px hoch, sonst Ueberlappung)
- link/favorites p-1, calendar p-1.5 (Zustandsansichten p-2), search px-1.5, note-Kopfzeile px-1.5
- Grid-Abstand 8 px bereits in Task 1, Uhr/Stoppuhr/Rechner-Innenabstaende bereits in 2a

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018N9CD3ebPKm1b32bPpBknY
This commit is contained in:
2026-09-16 09:13:23 +02:00
parent 2d8efe1a97
commit a175c00c18
7 changed files with 17 additions and 12 deletions
+7 -3
View File
@@ -66,16 +66,20 @@ export default function DashboardPage() {
}
return (
<div className="relative p-4">
<div className="relative p-2">
{/* Edit mode toggle — top right */}
<div className="absolute right-4 top-4 z-10">
<div className="absolute right-2 top-2 z-10">
<EditModeToggle
isEditMode={isEditMode}
onToggle={() => setEditMode(!isEditMode)}
/>
</div>
{/* Dashboard grid */}
{/* Dashboard grid.
quick-260916-bwo: mt-8 bleibt bewusst — der Umschalter ist 36 px hoch
(p-2 plus 20-px-Symbol) und liegt mit top-2 bei 8..44 px; das erste
Widget beginnt mit mt-8 bei 8+32+8 = 48 px (4 px Abstand). Eine
Halbierung auf mt-4 legte es bei 32 px mitten in den Umschalter. */}
<div className="mt-8">
<DashboardGrid
layouts={layouts}
@@ -77,7 +77,7 @@ export function CalendarWidget({ config }: WidgetProps) {
// Loading state
if (isLoading) {
return (
<div className="flex h-full items-center justify-center p-4">
<div className="flex h-full items-center justify-center p-2">
<span className="text-sm text-muted-foreground">
{t('calendar.loading')}
</span>
@@ -88,7 +88,7 @@ export function CalendarWidget({ config }: WidgetProps) {
// No sources configured
if (hasSources === false) {
return (
<div className="flex h-full items-center justify-center p-4">
<div className="flex h-full items-center justify-center p-2">
<span className="text-sm text-muted-foreground">
{t('calendar.emptyNoSources')}
</span>
@@ -99,7 +99,7 @@ export function CalendarWidget({ config }: WidgetProps) {
// Sources exist but no events
if (events.length === 0) {
return (
<div className="flex h-full items-center justify-center p-4">
<div className="flex h-full items-center justify-center p-2">
<span className="text-sm text-muted-foreground">
{t('calendar.emptyNoEvents')}
</span>
@@ -109,7 +109,7 @@ export function CalendarWidget({ config }: WidgetProps) {
// Events list
return (
<div className="flex h-full flex-col overflow-y-auto p-3">
<div className="flex h-full flex-col overflow-y-auto p-1.5">
<ul className="space-y-2">
{events.map((event) => (
<li
@@ -171,7 +171,7 @@ export function FavoritesWidget({
// --- Render ---
return (
<div className="flex flex-col h-full overflow-auto p-2 gap-2">
<div className="flex flex-col h-full overflow-auto p-1 gap-2">
{/* View mode toggle (edit mode only) */}
{isEditMode && (
<div className="flex gap-1 widgetNoDrag" aria-label={t('favorites.name')}>
@@ -235,7 +235,7 @@ export function LinkWidget({
// --- Render ---
return (
<div className="flex flex-col h-full overflow-auto p-2 gap-2">
<div className="flex flex-col h-full overflow-auto p-1 gap-2">
{/* View mode toggle (edit mode only) */}
{isEditMode && (
<div className="flex gap-1 widgetNoDrag">
@@ -86,7 +86,7 @@ export function NoteWidget({ instanceId, config }: WidgetProps) {
return (
<div className="flex h-full flex-col overflow-hidden" data-color-mode="auto">
{/* Header: title + pencil toggle */}
<div className="relative flex items-center border-b border-border px-3 py-1.5 gap-2">
<div className="relative flex items-center border-b border-border px-1.5 py-1.5 gap-2">
<input
type="text"
className="flex-1 bg-transparent text-sm font-semibold text-foreground outline-none placeholder:text-muted-foreground"
@@ -86,7 +86,7 @@ export function SearchWidget({ instanceId, config }: WidgetProps) {
);
return (
<div className="flex h-full items-center gap-2 px-3">
<div className="flex h-full items-center gap-2 px-1.5">
{/* Provider dropdown (D-14: ~120px left) */}
<select
role="combobox"
+2 -1
View File
@@ -30,8 +30,9 @@ export function AppShell({ children }: { children: React.ReactNode }) {
<div className="min-h-screen bg-background">
<Header />
<Sidebar />
{/* Seitenrahmen seit quick-260916-bwo halbiert: p-3 (12 px) statt vorher 24 px (Stufe 6), gilt fuer alle Seiten. */}
<main
className="app-shell-main min-h-[calc(100vh-var(--header-height))] transition-all duration-200 p-6"
className="app-shell-main min-h-[calc(100vh-var(--header-height))] transition-all duration-200 p-3"
style={mounted ? { '--current-sidebar-width': sidebarWidth } as React.CSSProperties : undefined}
>
{children}