From 0d4197d80e9e2fb4c85071fe86d0101822a7245f Mon Sep 17 00:00:00 2001
From: Marco Beretta <81851188+berry-13@users.noreply.github.com>
Date: Fri, 30 Aug 2024 13:53:33 +0200
Subject: [PATCH] fix: Hero buttons not resizing correctly in mobile view

---
 components/home/hero.module.css | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/components/home/hero.module.css b/components/home/hero.module.css
index 7c537dba..0bc9e530 100644
--- a/components/home/hero.module.css
+++ b/components/home/hero.module.css
@@ -267,14 +267,21 @@
 .actions {
   margin-top: 1.6em;
   margin-bottom: 1.4em;
-  display: block;
-  align-items: left;
-  justify-content: left;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap; /* Allow items to wrap to the next line */
   font-size: 1rem;
   font-size: min(1rem, max(3.5vw, 1.1rem));
   font-weight: 500;
 }
 
+.actions > * {
+  flex: 0 0 auto; /* Prevent items from growing or shrinking */
+  margin: 0.5em; /* Add some margin between items */
+  width: 150px; /* Set a fixed width for the buttons */
+}
+
 a.cta {
   margin-right: 0.75rem;
   padding: 0.75rem 1.5rem;