footer icon position fix

sanctuarycomputer · Dec 12, 2024 · 0a0a136 · 0a0a136
1 parent 763bcd8
commit 0a0a136
Show file tree

Hide file tree

Showing 4 changed files with 57 additions and 24 deletions.
diff --git a/assets/tailwind-output.css b/assets/tailwind-output.css
diff --git a/manifest.json b/manifest.json
@@ -1,7 +1,7 @@
 {
   "name": "Copenhagen",
   "author": "Sanctuary Computer",
-  "version": "4.2.23",
+  "version": "4.2.24",
   "api_version": 4,
   "default_locale": "en-us",
   "settings": [

diff --git a/src/modules/footer/FooterModule.tsx b/src/modules/footer/FooterModule.tsx
@@ -13,7 +13,7 @@ const Footer: FC<Props> = ({ footerPageData }) => {
   return (
     <footer className="px-margin-mobile pt-margin-web sm:px-margin-web sm:pb-margin-web">
       <h2 className="sr-only">Footer</h2>
-      <div className="default-grid sm:mb-20">
+      <div className="default-grid sm:mb-6">
         <div className="mb-12 hidden items-start sm:col-span-8 sm:flex md:col-span-4 md:mb-0">
           <LinkBase href="/" className="flex flex-row items-center">
             <MiniUnicon color="neutral-1" className="mb-[0.1875rem] h-8 w-8" />
@@ -27,11 +27,11 @@ const Footer: FC<Props> = ({ footerPageData }) => {
             {footerPageData?.footerLinksSupport && footerPageData.footerLinksSupport.length > 0 ? (
               <div className="space-y-[0.3125rem]">
                 <h3 className="body-1 text-light-neutral-1 dark:text-dark-neutral-1">Support</h3>
-                <ul>
+                <ul className="flex flex-col space-y-1">
                   {footerPageData?.footerLinksSupport.map((link) => (
                     <li key={link.name}>
                       <TextButton
-                        textClassName="body-2 text-light-neutral-2 dark:text-dark-neutral-2 group-hover:text-light-neutral-1 group-hover:dark:text-dark-neutral-1 transition-colors"
+                        textClassName="body-2 text-light-neutral-2 dark:text-dark-neutral-2 group-hover:text-light-neutral-1 block group-hover:dark:text-dark-neutral-1 transition-colors"
                         href={link.url}
                         label={link.name}
                       />
@@ -44,7 +44,7 @@ const Footer: FC<Props> = ({ footerPageData }) => {
             footerPageData.footerLinksEcosystem.length > 0 ? (
               <div className="col-span-1 space-y-[0.3125rem]">
                 <h3 className="body-1 text-light-neutral-1 dark:text-dark-neutral-1">Protocol</h3>
-                <ul>
+                <ul className="flex flex-col space-y-1">
                   {footerPageData.footerLinksEcosystem.map((link) => (
                     <li key={link.name}>
                       <TextButton
@@ -60,7 +60,7 @@ const Footer: FC<Props> = ({ footerPageData }) => {
             {footerPageData?.footerLinksCompany && footerPageData?.footerLinksCompany.length > 0 ? (
               <div className="space-y-[0.3125rem]">
                 <h3 className="body-1 text-light-neutral-1 dark:text-dark-neutral-1">Company</h3>
-                <ul>
+                <ul className="flex flex-col space-y-1">
                   {footerPageData.footerLinksCompany.map((link) => (
                     <li key={link.name}>
                       <TextButton
@@ -76,7 +76,7 @@ const Footer: FC<Props> = ({ footerPageData }) => {
             {footerPageData?.footerLinksHelp && footerPageData.footerLinksHelp.length > 0 ? (
               <div className="space-y-[0.3125rem]">
                 <h3 className="body-1 text-light-neutral-1 dark:text-dark-neutral-1">Need Help?</h3>
-                <ul>
+                <ul className="flex flex-col space-y-1">
                   {footerPageData?.footerLinksHelp.map((link) => (
                     <li key={link.name}>
                       <TextButton
@@ -91,12 +91,41 @@ const Footer: FC<Props> = ({ footerPageData }) => {
             ) : null}
           </nav>
         </div>
+        <div className="col-span-full flex flex-row space-x-gap-large border-b border-light-surface-3 py-margin-web dark:border-dark-surface-3 sm:border-0 sm:px-0 sm:py-0 sm:mt-6">
+          {footerPageData?.footerGithubLink ? (
+            <LinkBase
+              className="group"
+              href={footerPageData.footerGithubLink}
+              ariaLabel="Link to Uniswap Labs Github"
+            >
+              <Github className="h-6 w-6" />
+            </LinkBase>
+          ) : null}
+          {footerPageData?.footerXLink ? (
+            <LinkBase
+              className="group"
+              href={footerPageData.footerXLink}
+              ariaLabel="Link to Uniswap Labs X account"
+            >
+              <X className="h-6 w-6" />
+            </LinkBase>
+          ) : null}
+          {footerPageData?.footerDiscordLink ? (
+            <LinkBase
+              className="group"
+              href={footerPageData.footerDiscordLink}
+              ariaLabel="Link to Uniswap Labs Discord"
+            >
+              <Discord className="h-6 w-6" />
+            </LinkBase>
+          ) : null}
+        </div>
       </div>
       <div className="flex flex-col-reverse border-light-surface-3 dark:border-dark-surface-3 sm:flex-row sm:items-center sm:justify-between sm:border-t sm:pt-padding-large">
         <p className="body-3 my-padding-large text-light-neutral-2 dark:text-dark-neutral-2 sm:my-0">
           @{new Date().getFullYear()} Uniswap Labs
         </p>
-        <div className="flex flex-row space-x-gap-large border-b border-light-surface-3 py-margin-web dark:border-dark-surface-3 sm:border-0 sm:px-0 sm:py-0">
+        {/* <div className="flex flex-row space-x-gap-large border-b border-light-surface-3 py-margin-web dark:border-dark-surface-3 sm:border-0 sm:px-0 sm:py-0">
           {footerPageData?.footerGithubLink ? (
             <LinkBase
               className="group"
@@ -124,7 +153,7 @@ const Footer: FC<Props> = ({ footerPageData }) => {
               <Discord className="h-6 w-6" />
             </LinkBase>
           ) : null}
-        </div>
+        </div> */}
       </div>
     </footer>
   );

diff --git a/style.css b/style.css