problem: bad layout

nostrocket · Sep 27, 2024 · 179da78 · 179da78
1 parent 25ff015
commit 179da78
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/src/components/ProblemView.svelte b/src/components/ProblemView.svelte
@@ -14,7 +14,9 @@
 			{problem.para}
 		</p>
 		{#key problem.event.id}
-			<Carta.CartaViewer carta={new Carta.Carta()} value={problem.page} />
+			<div class="text-left">
+				<Carta.CartaViewer carta={new Carta.Carta()} value={problem.page} />
+			</div>
 		{/key}
 	</div>
 {:else}

diff --git a/src/layouts/MailLayout.svelte b/src/layouts/MailLayout.svelte
@@ -1,12 +1,15 @@
 <script lang="ts">
+	import { goto } from '$app/navigation';
+	import { base } from '$app/paths';
 	import * as Resizable from '$lib/components/ui/resizable';
-	import Badge from '@/components/ui/badge/badge.svelte';
+	import { Button } from '@/components/ui/button';
 	import { Input } from '@/components/ui/input';
 	import { ScrollArea } from '@/components/ui/scroll-area';
 	import { Search } from 'lucide-svelte';
+	import { PlusSolid } from 'svelte-awesome-icons';
 </script>
 
-<Resizable.PaneGroup direction="horizontal" class="h-full max-h-[800px] items-stretch">
+<Resizable.PaneGroup direction="horizontal" class="h-full items-stretch">
 	<Resizable.Pane defaultSize={40} minSize={10} maxSize={50}>
 		<div
 			class="bg-background/95 p-2 pt-1 backdrop-blur supports-[backdrop-filter]:bg-background/60"
@@ -22,15 +25,20 @@
 			</form>
 		</div>
 
-		<ScrollArea class="h-screen"><slot name="list" /></ScrollArea></Resizable.Pane
+		<ScrollArea class="h-full"><slot name="list" /></ScrollArea></Resizable.Pane
 	>
 
 	<Resizable.Handle withHandle />
 	<Resizable.Pane minSize={40} maxSize={85}
-		><ScrollArea class="h-screen"><slot name="problem" /></ScrollArea></Resizable.Pane
+		><ScrollArea class="h-full overflow-hidden pl-2 pr-2"><slot name="problem" /></ScrollArea
+		></Resizable.Pane
 	>
 	<Resizable.Handle withHandle />
 	<Resizable.Pane minSize={10} defaultSize={10} maxSize={30}
-		><ScrollArea class="h-screen"><slot name="meta" /></ScrollArea></Resizable.Pane
+		><ScrollArea class="h-full p-2 pt-0"
+			><slot name="meta" /><Button on:click={async () => await goto(`${base}/logNewProblem`)}
+				><PlusSolid /></Button
+			></ScrollArea
+		></Resizable.Pane
 	>
 </Resizable.PaneGroup>