From 2b619ca03b91b2ac01af9c1cbf5724bcd4233f25 Mon Sep 17 00:00:00 2001
From: Antoine Jaussoin <antoinejaussoin@users.noreply.github.com>
Date: Sun, 25 Jun 2023 08:35:44 +0100
Subject: [PATCH] Accessibility and responsiveness (#541)

---
 marketing/public/locales/en/common.json        | 2 +-
 marketing/src/containers/Banner/index.tsx      | 4 ++--
 marketing/src/containers/Callback/Callback.tsx | 7 ++++++-
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/marketing/public/locales/en/common.json b/marketing/public/locales/en/common.json
index 47160b5f..d7cfaa4f 100644
--- a/marketing/public/locales/en/common.json
+++ b/marketing/public/locales/en/common.json
@@ -125,7 +125,7 @@
       "Free updates, forever"
     ],
     "button": {
-      "label": "Learn more"
+      "label": "Learn more about Self-Hosting"
     }
   },
   "Features": {
diff --git a/marketing/src/containers/Banner/index.tsx b/marketing/src/containers/Banner/index.tsx
index 8a94484f..5d72417f 100755
--- a/marketing/src/containers/Banner/index.tsx
+++ b/marketing/src/containers/Banner/index.tsx
@@ -88,11 +88,11 @@ const Banner = () => {
             />
             <NextImage
               src={screenshot}
-              alt="dashboard"
+              alt="Screenshot of Retrospected"
               priority
               placeholder="blur"
               fill
-              quality={50}
+              quality={30}
             />
           </Figure>
         </BannerContentWrapper>
diff --git a/marketing/src/containers/Callback/Callback.tsx b/marketing/src/containers/Callback/Callback.tsx
index ac605249..1be70b0b 100644
--- a/marketing/src/containers/Callback/Callback.tsx
+++ b/marketing/src/containers/Callback/Callback.tsx
@@ -44,7 +44,7 @@ const Container = styled.a`
   z-index: 1000;
   box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
 
-  @media (max-width: 767px) {
+  @media (max-width: 450px) {
     width: 100%;
     bottom: 0;
     margin: 0;
@@ -52,6 +52,11 @@ const Container = styled.a`
     left: 0;
     border-radius: 0;
     box-shadow: none;
+
+    ${Text} {
+      display: inline;
+      visibility: visible;
+    }
   }
 `;