From 863eee56b015c735bdc80775b8b4cac5fca75188 Mon Sep 17 00:00:00 2001
From: w3bdesign <45217974+w3bdesign@users.noreply.github.com>
Date: Thu, 16 Jan 2025 19:05:31 +0100
Subject: [PATCH 1/4] Revert "Merge pull request #1394 from
 w3bdesign/fix-mobile-padding"

This reverts commit 9282d30d793dd1f5085031fcfd6927e46df4f00e, reversing
changes made to cb125fd1833ecc63ee7c960d9a395cf7991888a7.
---
 src/components/AlgoliaSearch/MobileSearch.component.tsx | 4 ++--
 src/components/Footer/Footer.component.tsx              | 2 +-
 src/components/Footer/Stickynav.component.tsx           | 2 +-
 src/components/Header/Header.component.tsx              | 2 +-
 src/components/Layout/Layout.component.tsx              | 3 ++-
 src/pages/index.tsx                                     | 7 +++----
 src/pages/kasse.tsx                                     | 8 +++++---
 src/pages/produkter.tsx                                 | 5 ++---
 8 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/components/AlgoliaSearch/MobileSearch.component.tsx b/src/components/AlgoliaSearch/MobileSearch.component.tsx
index 74b0ee8b4..77dec3cb4 100644
--- a/src/components/AlgoliaSearch/MobileSearch.component.tsx
+++ b/src/components/AlgoliaSearch/MobileSearch.component.tsx
@@ -15,8 +15,8 @@ const searchClient = algoliasearch(
 const MobileSearch = () => {
   const [search, setSearch] = useState<string | null>(null);
   const [hasFocus, sethasFocus] = useState<boolean>(false);
-  return ( 
-    <div className="inline mt-4 md:hidden px-1">
+  return (
+    <div className="inline mt-4 md:hidden">
       <InstantSearch
         indexName={process.env.NEXT_PUBLIC_ALGOLIA_INDEX_NAME ?? 'changeme'}
         searchClient={searchClient}
diff --git a/src/components/Footer/Footer.component.tsx b/src/components/Footer/Footer.component.tsx
index ff3df5763..0acea4f35 100644
--- a/src/components/Footer/Footer.component.tsx
+++ b/src/components/Footer/Footer.component.tsx
@@ -5,7 +5,7 @@
  */
 const Footer = () => (
   <footer className="w-full bg-white border-t border-gray-200 mt-12">
-    <div className="container mx-auto px-6 px-1">
+    <div className="container mx-auto px-6">
       <div className="py-4">
         <div className="text-gray-600 text-center">
           &copy; {new Date().getFullYear()} Daniel / w3bdesign
diff --git a/src/components/Footer/Stickynav.component.tsx b/src/components/Footer/Stickynav.component.tsx
index 096a9fef6..a090dcd77 100644
--- a/src/components/Footer/Stickynav.component.tsx
+++ b/src/components/Footer/Stickynav.component.tsx
@@ -11,7 +11,7 @@ import Hamburger from './Hamburger.component';
  * Includes mobile menu.
  */
 const Stickynav = () => (
-  <nav id="footer" className="fixed bottom-0 z-50 w-full mt-[10rem] md:hidden px-1">
+  <nav id="footer" className="fixed bottom-0 z-50 w-full mt-[10rem] md:hidden">
     <div className="container flex flex-wrap items-center justify-between px-6 py-3 mx-auto mt-0 md:min-w-96 bg-blue-800">
       <Hamburger />
       <div
diff --git a/src/components/Header/Header.component.tsx b/src/components/Header/Header.component.tsx
index 7fd9476ed..4c54364ba 100644
--- a/src/components/Header/Header.component.tsx
+++ b/src/components/Header/Header.component.tsx
@@ -25,7 +25,7 @@ const Header = ({ title }: IHeaderProps) => (
         key="pagetitle"
       />
     </Head>
-    <div className="container mx-auto px-6 px-1">
+    <div className="container mx-auto px-6">
       <Navbar />
     </div>
   </>
diff --git a/src/components/Layout/Layout.component.tsx b/src/components/Layout/Layout.component.tsx
index 3bc77982d..b806f4447 100644
--- a/src/components/Layout/Layout.component.tsx
+++ b/src/components/Layout/Layout.component.tsx
@@ -1,3 +1,4 @@
+// Imports
 import { ReactNode, useContext, useEffect } from 'react';
 import { useQuery } from '@apollo/client';
 
@@ -55,7 +56,7 @@ const Layout = ({ children, title }: ILayoutProps) => {
   }, [refetch]);
 
   return (
-    <div className="flex flex-col min-h-screen w-full mx-auto px-1">
+    <div className="flex flex-col min-h-screen w-full mx-auto">
       <Header title={title} />
       {title === 'Hjem' ? (
         <main className="flex-1">{children}</main>
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 68b356664..93c35385d 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,3 +1,4 @@
+// Components
 import Hero from '@/components/Index/Hero.component';
 import DisplayProducts from '@/components/Product/DisplayProducts.component';
 import Layout from '@/components/Layout/Layout.component';
@@ -22,10 +23,8 @@ const Index: NextPage = ({
   products,
 }: InferGetStaticPropsType<typeof getStaticProps>) => (
   <Layout title="Hjem">
-    <div className="px-1">
-      <Hero />
-      {products && <DisplayProducts products={products} />}
-    </div>
+    <Hero />
+    {products && <DisplayProducts products={products} />}
   </Layout>
 );
 
diff --git a/src/pages/kasse.tsx b/src/pages/kasse.tsx
index b36a40111..94cd74cc7 100644
--- a/src/pages/kasse.tsx
+++ b/src/pages/kasse.tsx
@@ -1,11 +1,13 @@
+// Components
 import Layout from '@/components/Layout/Layout.component';
 import CheckoutForm from '@/components/Checkout/CheckoutForm.component';
 
+// Types
+import type { NextPage } from 'next';
+
 const Kasse: NextPage = () => (
   <Layout title="Kasse">
-    <div className="px-1">
-      <CheckoutForm />
-    </div>
+    <CheckoutForm />
   </Layout>
 );
 
diff --git a/src/pages/produkter.tsx b/src/pages/produkter.tsx
index 6136e1c27..6bc984d1e 100644
--- a/src/pages/produkter.tsx
+++ b/src/pages/produkter.tsx
@@ -1,3 +1,4 @@
+// Components
 import DisplayProducts from '@/components/Product/DisplayProducts.component';
 import Layout from '@/components/Layout/Layout.component';
 
@@ -21,9 +22,7 @@ const Produkter: NextPage = ({
   products,
 }: InferGetStaticPropsType<typeof getStaticProps>) => (
   <Layout title="Produkter">
-    <div className="px-1">
-      {products && <DisplayProducts products={products} />}
-    </div>
+    {products && <DisplayProducts products={products} />}
   </Layout>
 );
 

From 1b04ce1b105fdeb1ec1fb363600217bf1eccb8a7 Mon Sep 17 00:00:00 2001
From: w3bdesign <45217974+w3bdesign@users.noreply.github.com>
Date: Thu, 16 Jan 2025 19:12:48 +0100
Subject: [PATCH 2/4] Add padding on mobile

---
 src/components/Layout/Layout.component.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Layout/Layout.component.tsx b/src/components/Layout/Layout.component.tsx
index b806f4447..ea483f3db 100644
--- a/src/components/Layout/Layout.component.tsx
+++ b/src/components/Layout/Layout.component.tsx
@@ -56,7 +56,7 @@ const Layout = ({ children, title }: ILayoutProps) => {
   }, [refetch]);
 
   return (
-    <div className="flex flex-col min-h-screen w-full mx-auto">
+    <div className="flex flex-col min-h-screen w-full mx-auto px-2 md:px-0">
       <Header title={title} />
       {title === 'Hjem' ? (
         <main className="flex-1">{children}</main>

From 4d03be30bf24c47f60b4e6e76463383fec441d80 Mon Sep 17 00:00:00 2001
From: w3bdesign <45217974+w3bdesign@users.noreply.github.com>
Date: Thu, 16 Jan 2025 19:15:48 +0100
Subject: [PATCH 3/4] Padding only on main

---
 src/components/Layout/Layout.component.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Layout/Layout.component.tsx b/src/components/Layout/Layout.component.tsx
index ea483f3db..6bcf7f28e 100644
--- a/src/components/Layout/Layout.component.tsx
+++ b/src/components/Layout/Layout.component.tsx
@@ -56,10 +56,10 @@ const Layout = ({ children, title }: ILayoutProps) => {
   }, [refetch]);
 
   return (
-    <div className="flex flex-col min-h-screen w-full mx-auto px-2 md:px-0">
+    <div className="flex flex-col min-h-screen w-full mx-auto">
       <Header title={title} />
       {title === 'Hjem' ? (
-        <main className="flex-1">{children}</main>
+        <main className="flex-1 px-2 md:px-0">{children}</main>
       ) : (
         <div className="container mx-auto px-6 flex-1">
           <PageTitle title={title} />

From c258fec9a9dbab5cb216f851e6a80b9f2015bd00 Mon Sep 17 00:00:00 2001
From: w3bdesign <45217974+w3bdesign@users.noreply.github.com>
Date: Thu, 16 Jan 2025 19:21:07 +0100
Subject: [PATCH 4/4] Px-4 mobile

---
 src/components/Layout/Layout.component.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Layout/Layout.component.tsx b/src/components/Layout/Layout.component.tsx
index 6bcf7f28e..f5366a1ba 100644
--- a/src/components/Layout/Layout.component.tsx
+++ b/src/components/Layout/Layout.component.tsx
@@ -59,7 +59,7 @@ const Layout = ({ children, title }: ILayoutProps) => {
     <div className="flex flex-col min-h-screen w-full mx-auto">
       <Header title={title} />
       {title === 'Hjem' ? (
-        <main className="flex-1 px-2 md:px-0">{children}</main>
+        <main className="flex-1 px-4 md:px-0">{children}</main>
       ) : (
         <div className="container mx-auto px-6 flex-1">
           <PageTitle title={title} />