From 2a09c69e64708f3f2354c5ce81f43779eabdb196 Mon Sep 17 00:00:00 2001
From: Mike Pierce <mike.pierce@digitalservice.bund.de>
Date: Fri, 7 Jun 2024 16:33:08 +0200
Subject: [PATCH] Improve footer behaviour on small screens

---
 packages/shared/components/Footer.tsx | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/shared/components/Footer.tsx b/packages/shared/components/Footer.tsx
index 0970c378..0518399f 100644
--- a/packages/shared/components/Footer.tsx
+++ b/packages/shared/components/Footer.tsx
@@ -53,12 +53,14 @@ export default function Footer({ links }: Readonly<{ links: LinkProps[] }>) {
     <footer className="text-base leading-snug">
       <Container paddingTop="48">
         <div className="flex flex-wrap items-start justify-between gap-y-32">
-          <div className="flex flex-col sm:flex-row gap-32">
-            <Image
-              url={bmiLogo}
-              width={120}
-              alternativeText="Logo des Bundesministerium des Innern und für Heimat"
-            />
+          <div className="flex flex-col flex-col-reverse sm:flex-row gap-y-8 gap-x-16">
+            <div className="py-4 pr-4">
+              <Image
+                url={bmiLogo}
+                width={120}
+                alternativeText="Logo des Bundesministerium des Innern und für Heimat"
+              />
+            </div>
             <div className="ds-stack-8">
               {paragraphs.map((paragraph) => (
                 <div key={paragraph.markdown}>