From ece5c0f9943cab400475c1e278418a2624a75d48 Mon Sep 17 00:00:00 2001
From: SelmaBergstrand <78426277+SelmaBergstrand@users.noreply.github.com>
Date: Fri, 27 Sep 2024 08:47:09 +0200
Subject: [PATCH] fix(edit): remove overflow of settings and adjust preview
 size on mobile (#1660)

---
 tavla/app/(admin)/edit/[id]/components/Preview/index.tsx  | 4 ++--
 tavla/app/(admin)/edit/[id]/components/TileCard/index.tsx | 4 ++--
 tavla/app/(admin)/edit/[id]/page.tsx                      | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/tavla/app/(admin)/edit/[id]/components/Preview/index.tsx b/tavla/app/(admin)/edit/[id]/components/Preview/index.tsx
index 15a609860..8c706ea18 100644
--- a/tavla/app/(admin)/edit/[id]/components/Preview/index.tsx
+++ b/tavla/app/(admin)/edit/[id]/components/Preview/index.tsx
@@ -14,11 +14,11 @@ function Preview({
 }) {
     return (
         <div
-            className="previewContainer text-2xl"
+            className="previewContainer md:text-2xl"
             data-theme={board?.theme ?? 'dark'}
         >
             <Header theme={board.theme} organizationLogo={organization?.logo} />
-            <div className="h-[50rem]">
+            <div className="md:h-[50rem] h-96">
                 <Board board={board} />
             </div>
             <Footer
diff --git a/tavla/app/(admin)/edit/[id]/components/TileCard/index.tsx b/tavla/app/(admin)/edit/[id]/components/TileCard/index.tsx
index fe3909982..d7706913e 100644
--- a/tavla/app/(admin)/edit/[id]/components/TileCard/index.tsx
+++ b/tavla/app/(admin)/edit/[id]/components/TileCard/index.tsx
@@ -405,7 +405,7 @@ function TileCard({
                         </div>
 
                         <Heading4>Transportmidler og linjer</Heading4>
-                        <div className="flex flex-row gap-4">
+                        <div className="flex flex-col md:flex-row gap-4">
                             {linesByModeSorted.map(
                                 ({ transportMode, lines }) => (
                                     <TransportModeAndLines
@@ -422,7 +422,7 @@ function TileCard({
                             value={uniqLines.length.toString()}
                         />
 
-                        <div className="flex flex-row justify-start gap-4 mt-8">
+                        <div className="flex flex-col md:flex-row justify-start gap-4 mt-8">
                             <SubmitButton
                                 variant="primary"
                                 aria-label="lagre valg"
diff --git a/tavla/app/(admin)/edit/[id]/page.tsx b/tavla/app/(admin)/edit/[id]/page.tsx
index 37047e2fd..cf39a3661 100644
--- a/tavla/app/(admin)/edit/[id]/page.tsx
+++ b/tavla/app/(admin)/edit/[id]/page.tsx
@@ -79,9 +79,9 @@ export default async function EditPage({ params }: TProps) {
                     </div>
                 </div>
 
-                <div className="rounded-md py-8 px-6 flex flex-col gap-4 bg-background">
+                <div className="rounded-md md:py-8 py-2 md:px-6 px-2 flex flex-col gap-4 bg-background">
                     <Heading2>Innstillinger</Heading2>
-                    <div className="grid grid-cols-[repeat(auto-fill,minmax(400px,1fr))] gap-8">
+                    <div className="grid grid-cols md:grid-cols-[repeat(auto-fill,minmax(400px,1fr))] gap-8">
                         <MetaSettings
                             bid={params.id}
                             meta={board.meta}