From 549c600c3613dd2d1b80359239c457f59cd90251 Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 14:19:55 +0800
Subject: [PATCH 1/7] fix(nested-cards): fix spacing to 0.75rem

---
 .../components/ContactUs/CardsSection.tsx     |   2 +-
 .../components/ContactUs/LocationCard.tsx     |   2 +-
 .../Homepage/HeroDropdownSection.tsx          |   2 +-
 .../Homepage/HeroHighlightSection.tsx         |   2 +-
 .../components/NavBar/GroupMenuBody.tsx       | 112 +++++++++---------
 5 files changed, 59 insertions(+), 61 deletions(-)

diff --git a/src/layouts/components/ContactUs/CardsSection.tsx b/src/layouts/components/ContactUs/CardsSection.tsx
index 0f8e4cf27..4bd046fd9 100644
--- a/src/layouts/components/ContactUs/CardsSection.tsx
+++ b/src/layouts/components/ContactUs/CardsSection.tsx
@@ -62,7 +62,7 @@ export const CardsSection = ({
             subtitle={CONTACTUS_EMPTY_SECTION_SUBTITLE[contactUsType]}
             isEmpty={cardFrontMatter.length === 0}
           >
-            <VStack p={0} spacing="1.125rem">
+            <VStack p={0} spacing="0.75rem">
               {cardFrontMatter.map((card, index) => (
                 <>
                   {contactUsType === "locations" ? (
diff --git a/src/layouts/components/ContactUs/LocationCard.tsx b/src/layouts/components/ContactUs/LocationCard.tsx
index fb96e7878..856b570df 100644
--- a/src/layouts/components/ContactUs/LocationCard.tsx
+++ b/src/layouts/components/ContactUs/LocationCard.tsx
@@ -133,7 +133,7 @@ export const LocationCard = ({
               isEmpty={frontMatter.operating_hours.length === 0}
             >
               <Editable.Accordion>
-                <VStack p={0} spacing="1.125rem">
+                <VStack p={0} spacing="0.75rem">
                   {frontMatter.operating_hours.map(
                     (operatingHour, operatingHourIndex) => (
                       <Editable.DraggableAccordionItem
diff --git a/src/layouts/components/Homepage/HeroDropdownSection.tsx b/src/layouts/components/Homepage/HeroDropdownSection.tsx
index 1e7cf50ba..4b3696f47 100644
--- a/src/layouts/components/Homepage/HeroDropdownSection.tsx
+++ b/src/layouts/components/Homepage/HeroDropdownSection.tsx
@@ -69,7 +69,7 @@ export const HeroDropdownSection = ({
               subtitle="Add options to allow users to quickly navigate your site"
               isEmpty={state.dropdown.options.length === 0}
             >
-              <Editable.Section px={0} spacing="1.25rem" py="1.5rem">
+              <Editable.Section px={0} spacing="0.75rem" py="1.5rem">
                 {state.dropdown.options.map(
                   (
                     { title: optionTitle, url: optionUrl },
diff --git a/src/layouts/components/Homepage/HeroHighlightSection.tsx b/src/layouts/components/Homepage/HeroHighlightSection.tsx
index 8effaded5..f3affa3b1 100644
--- a/src/layouts/components/Homepage/HeroHighlightSection.tsx
+++ b/src/layouts/components/Homepage/HeroHighlightSection.tsx
@@ -85,7 +85,7 @@ export const HeroHighlightSection = ({
               title="Highlights you add will appear here"
               subtitle="You can call out informative links using highlights"
             >
-              <Editable.Section px={0} spacing="1.25rem" py="1.5rem">
+              <Editable.Section px={0} spacing="0.75rem" py="1.5rem">
                 {highlights.map(
                   (
                     {
diff --git a/src/layouts/components/NavBar/GroupMenuBody.tsx b/src/layouts/components/NavBar/GroupMenuBody.tsx
index 5997116a6..391a333d4 100644
--- a/src/layouts/components/NavBar/GroupMenuBody.tsx
+++ b/src/layouts/components/NavBar/GroupMenuBody.tsx
@@ -74,64 +74,62 @@ export const GroupMenuBody = ({
               isEmpty={sublinks.length === 0}
             >
               <Editable.Accordion>
-                <VStack p={0} spacing="1.25rem">
+                <VStack p={0} spacing="0.75rem">
                   {sublinks.map((sublink, sublinkIndex) => (
-                    <VStack w="100%">
-                      <Editable.DraggableAccordionItem
-                        draggableId={`sublink-${index}-${sublinkIndex}-draggable`}
-                        index={sublinkIndex}
-                        title={sublink.title}
-                        isInvalid={_.some(errors.sublinks[sublinkIndex])}
-                        isNested
-                      >
-                        <Editable.Section mt="-0.5rem">
-                          <FormControl
-                            isRequired
-                            isInvalid={!!errors.sublinks[sublinkIndex].title}
-                          >
-                            <FormLabel>Submenu name</FormLabel>
-                            <Input
-                              placeholder="New menu group"
-                              id={`sublink-${index}-${sublinkIndex}-title`}
-                              value={sublink.title}
-                              onChange={onChange}
-                            />
-                            <FormErrorMessage>
-                              {errors.sublinks[sublinkIndex].title}
-                            </FormErrorMessage>
-                          </FormControl>
-                          <FormControl
-                            isRequired
-                            isInvalid={!!errors.sublinks[sublinkIndex].url}
-                          >
-                            <FormLabel>Destination</FormLabel>
-                            <Input
-                              placeholder="Enter a /page-url or link for this menu item"
-                              id={`sublink-${index}-${sublinkIndex}-url`}
-                              value={sublink.url}
-                              onChange={onChange}
-                            />
-                            <FormErrorMessage>
-                              {errors.sublinks[sublinkIndex].url}
-                            </FormErrorMessage>
-                          </FormControl>
-                          <Button
-                            id={`section-${index}-${sublinkIndex}`}
-                            onClick={() =>
-                              onDelete(
-                                `sublink-${index}-${sublinkIndex}`,
-                                "Submenu"
-                              )
-                            }
-                            alignSelf="center"
-                            variant="clear"
-                            colorScheme="critical"
-                          >
-                            Delete submenu
-                          </Button>
-                        </Editable.Section>
-                      </Editable.DraggableAccordionItem>
-                    </VStack>
+                    <Editable.DraggableAccordionItem
+                      draggableId={`sublink-${index}-${sublinkIndex}-draggable`}
+                      index={sublinkIndex}
+                      title={sublink.title}
+                      isInvalid={_.some(errors.sublinks[sublinkIndex])}
+                      isNested
+                    >
+                      <Editable.Section mt="-0.5rem">
+                        <FormControl
+                          isRequired
+                          isInvalid={!!errors.sublinks[sublinkIndex].title}
+                        >
+                          <FormLabel>Submenu name</FormLabel>
+                          <Input
+                            placeholder="New menu group"
+                            id={`sublink-${index}-${sublinkIndex}-title`}
+                            value={sublink.title}
+                            onChange={onChange}
+                          />
+                          <FormErrorMessage>
+                            {errors.sublinks[sublinkIndex].title}
+                          </FormErrorMessage>
+                        </FormControl>
+                        <FormControl
+                          isRequired
+                          isInvalid={!!errors.sublinks[sublinkIndex].url}
+                        >
+                          <FormLabel>Destination</FormLabel>
+                          <Input
+                            placeholder="Enter a /page-url or link for this menu item"
+                            id={`sublink-${index}-${sublinkIndex}-url`}
+                            value={sublink.url}
+                            onChange={onChange}
+                          />
+                          <FormErrorMessage>
+                            {errors.sublinks[sublinkIndex].url}
+                          </FormErrorMessage>
+                        </FormControl>
+                        <Button
+                          id={`section-${index}-${sublinkIndex}`}
+                          onClick={() =>
+                            onDelete(
+                              `sublink-${index}-${sublinkIndex}`,
+                              "Submenu"
+                            )
+                          }
+                          alignSelf="center"
+                          variant="clear"
+                          colorScheme="critical"
+                        >
+                          Delete submenu
+                        </Button>
+                      </Editable.Section>
+                    </Editable.DraggableAccordionItem>
                   ))}
                 </VStack>
               </Editable.Accordion>

From 95a3b09717a460faf1194f7f9af5a0734d73eef1 Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 14:20:14 +0800
Subject: [PATCH 2/7] fix(editable): set extra padding

---
 src/layouts/components/Editable/Editable.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/layouts/components/Editable/Editable.tsx b/src/layouts/components/Editable/Editable.tsx
index 1fc721996..e589d71d3 100644
--- a/src/layouts/components/Editable/Editable.tsx
+++ b/src/layouts/components/Editable/Editable.tsx
@@ -446,7 +446,9 @@ const DraggableAccordionItem = ({
                   <AccordionIcon />
                 </AccordionButton>
               </Flex>
-              <AccordionPanel pb={4}>{children}</AccordionPanel>
+              <AccordionPanel pb={4} pt={isNested ? "18px" : "auto"}>
+                {children}
+              </AccordionPanel>
             </Box>
           )}
         </BaseAccordionItem>

From 733e3435641a8cc605da311171e6e1e314d79661 Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 14:39:40 +0800
Subject: [PATCH 3/7] fix(edithoempage): fix errors

---
 src/layouts/EditHomepage/EditHomepage.jsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/layouts/EditHomepage/EditHomepage.jsx b/src/layouts/EditHomepage/EditHomepage.jsx
index ea4d8b372..2462c2070 100644
--- a/src/layouts/EditHomepage/EditHomepage.jsx
+++ b/src/layouts/EditHomepage/EditHomepage.jsx
@@ -966,11 +966,17 @@ const EditHomepage = ({ match }) => {
                                   <HeroDropdownSection
                                     {...section.hero.dropdown}
                                     state={section.hero}
-                                    errors={errors}
+                                    errors={{
+                                      ...errors,
+                                      ...errors.sections[0].hero,
+                                    }}
                                   />
                                 ) : (
                                   <HeroHighlightSection
-                                    errors={errors}
+                                    errors={{
+                                      ...errors,
+                                      ...errors.sections[0].hero,
+                                    }}
                                     highlights={section.hero.key_highlights}
                                   />
                                 )

From 8aed5985067154baba25824274ed38f021a1c88f Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 14:47:34 +0800
Subject: [PATCH 4/7] fix(cardssection): remove errorneous spacing

---
 src/layouts/components/ContactUs/CardsSection.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/components/ContactUs/CardsSection.tsx b/src/layouts/components/ContactUs/CardsSection.tsx
index 4bd046fd9..b03b6e53e 100644
--- a/src/layouts/components/ContactUs/CardsSection.tsx
+++ b/src/layouts/components/ContactUs/CardsSection.tsx
@@ -62,7 +62,7 @@ export const CardsSection = ({
             subtitle={CONTACTUS_EMPTY_SECTION_SUBTITLE[contactUsType]}
             isEmpty={cardFrontMatter.length === 0}
           >
-            <VStack p={0} spacing="0.75rem">
+            <VStack p={0} spacing="1.25rem">
               {cardFrontMatter.map((card, index) => (
                 <>
                   {contactUsType === "locations" ? (

From 7a00d29c4f5c52ccec62b44bc14d352ca99afa01 Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 14:48:08 +0800
Subject: [PATCH 5/7] fix(cards): remove extra margins

---
 src/layouts/components/ContactUs/LocationCard.tsx        | 1 -
 src/layouts/components/Homepage/HeroDropdownSection.tsx  | 1 -
 src/layouts/components/Homepage/HeroHighlightSection.tsx | 1 -
 3 files changed, 3 deletions(-)

diff --git a/src/layouts/components/ContactUs/LocationCard.tsx b/src/layouts/components/ContactUs/LocationCard.tsx
index 856b570df..dcc8d42af 100644
--- a/src/layouts/components/ContactUs/LocationCard.tsx
+++ b/src/layouts/components/ContactUs/LocationCard.tsx
@@ -222,7 +222,6 @@ export const LocationCard = ({
                             }
                             alignSelf="center"
                             colorScheme="critical"
-                            mt="0.5rem"
                           >
                             Delete operating hours
                           </Button>
diff --git a/src/layouts/components/Homepage/HeroDropdownSection.tsx b/src/layouts/components/Homepage/HeroDropdownSection.tsx
index 4b3696f47..f15d3ef1f 100644
--- a/src/layouts/components/Homepage/HeroDropdownSection.tsx
+++ b/src/layouts/components/Homepage/HeroDropdownSection.tsx
@@ -131,7 +131,6 @@ export const HeroDropdownSection = ({
                             alignSelf="center"
                             variant="clear"
                             colorScheme="critical"
-                            mt="1rem"
                           >
                             Delete option
                           </Button>
diff --git a/src/layouts/components/Homepage/HeroHighlightSection.tsx b/src/layouts/components/Homepage/HeroHighlightSection.tsx
index f3affa3b1..24991c724 100644
--- a/src/layouts/components/Homepage/HeroHighlightSection.tsx
+++ b/src/layouts/components/Homepage/HeroHighlightSection.tsx
@@ -164,7 +164,6 @@ export const HeroHighlightSection = ({
                             alignSelf="center"
                             variant="clear"
                             colorScheme="critical"
-                            mt="1rem"
                           >
                             Delete highlight
                           </Button>

From 2052b620480637b6448efc5b92bba02a8fab9a22 Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 14:53:50 +0800
Subject: [PATCH 6/7] fix(hero/infopic): update margins

---
 src/layouts/components/Homepage/HeroBody.tsx    | 2 +-
 src/layouts/components/Homepage/InfopicBody.tsx | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/layouts/components/Homepage/HeroBody.tsx b/src/layouts/components/Homepage/HeroBody.tsx
index 2d78e1665..038540a79 100644
--- a/src/layouts/components/Homepage/HeroBody.tsx
+++ b/src/layouts/components/Homepage/HeroBody.tsx
@@ -120,7 +120,7 @@ export const HeroBody = ({
             onFieldChange={onChange}
             isRequired
           >
-            <Box mb="0.5rem">
+            <Box mb="0.75rem">
               <FormTitle>Hero background image</FormTitle>
             </Box>
             <FormFieldMedia
diff --git a/src/layouts/components/Homepage/InfopicBody.tsx b/src/layouts/components/Homepage/InfopicBody.tsx
index 55bf43a23..ba38e942a 100644
--- a/src/layouts/components/Homepage/InfopicBody.tsx
+++ b/src/layouts/components/Homepage/InfopicBody.tsx
@@ -102,7 +102,9 @@ export const InfopicBody = ({
           onFieldChange={onChange}
           isRequired
         >
-          <FormTitle>Image</FormTitle>
+          <Box mb="0.75rem">
+            <FormTitle>Image</FormTitle>
+          </Box>
           <FormFieldMedia
             value={image}
             id={`section-${index}-infopic-image`}

From 63ac131b8b7b5bb24b330367e00d561eae3befab Mon Sep 17 00:00:00 2001
From: seaerchin <chin@ers-macbook-pro.lan>
Date: Thu, 7 Sep 2023 15:18:27 +0800
Subject: [PATCH 7/7] fix(editable): remove padding

---
 src/layouts/components/Editable/Editable.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/layouts/components/Editable/Editable.tsx b/src/layouts/components/Editable/Editable.tsx
index e589d71d3..1fc721996 100644
--- a/src/layouts/components/Editable/Editable.tsx
+++ b/src/layouts/components/Editable/Editable.tsx
@@ -446,9 +446,7 @@ const DraggableAccordionItem = ({
                   <AccordionIcon />
                 </AccordionButton>
               </Flex>
-              <AccordionPanel pb={4} pt={isNested ? "18px" : "auto"}>
-                {children}
-              </AccordionPanel>
+              <AccordionPanel pb={4}>{children}</AccordionPanel>
             </Box>
           )}
         </BaseAccordionItem>