From e2482e4e5fb2ae02ef7a070acb46a029f3964e8b Mon Sep 17 00:00:00 2001
From: Mitali Shah <mitalishaleenshah@gmail.com>
Date: Sun, 19 Apr 2026 10:44:39 -0500
Subject: [PATCH 1/2] fix: update footer link styles and text to match Figma
 #218

---
 src/components/Footer.tsx | 25 ++++++++++++++++---------
 1 file changed, 16 insertions(+), 9 deletions(-)

diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index a824f744..aa018042 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -130,20 +130,27 @@ export const Footer = ({
           </Box>
           <Typography
             variant="body1"
-            color="primary.dark"
-            typography={{ fontWeight: '600' }}
-            pt={2}
-            sx={{ fontSize: '16px' }}
+            sx={{ 
+              fontSize: '16px', 
+              fontWeight: 500,
+              color: '#000000', 
+              pt: 2 
+            }}
           >
-            {link.title} <br />
+            {link?.title || "Experiencing Technical Issues?"} <br />
             <Link
-              href={link.uri}
-              color="primary.dark"
+              href={link?.uri || "https://github.com/Women-Coding-Community/wcc-website/issues"}
               target="_blank"
               rel="noopener noreferrer"
-              typography={{ fontWeight: '500' }}
+              sx={{ 
+                color: 'custom.linkBlue',
+                fontSize: '14px',
+                fontWeight: 400,
+                textDecoration: 'underline',
+              }}
             >
-              {link.label}
+              {/* Hardcoded to match Figma #218 and override incomplete BE label */}
+                Send us a report on GitHub
             </Link>
           </Typography>
         </Box>

From 6ffae110db4d7493e93feb5c94405900d9f874bb Mon Sep 17 00:00:00 2001
From: Mitali Shah <mitalishaleenshah@gmail.com>
Date: Sun, 19 Apr 2026 11:14:32 -0500
Subject: [PATCH 2/2] fix: match footer UI and test locator to Figma specs #218

---
 playwright-tests/pages/base.page.ts |  2 +-
 src/components/Footer.tsx           | 19 +++++++++++--------
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/playwright-tests/pages/base.page.ts b/playwright-tests/pages/base.page.ts
index daf6882e..ef0d357b 100644
--- a/playwright-tests/pages/base.page.ts
+++ b/playwright-tests/pages/base.page.ts
@@ -60,7 +60,7 @@ export class BasePage {
       Instagram: links.filter({ has: page.getByTestId('InstagramIcon') }),
       Email: links.filter({ has: page.getByTestId('EmailIcon') }),
       Slack: page.locator('a[href*="join.slack.com"]').last(),
-      'Send us a report': page.getByText('Send us a report', { exact: true }),
+      'Send us a report': page.getByText('Send us a report on GitHub', { exact: true }),
     };
   }
 
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index aa018042..6444ea4d 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -130,19 +130,22 @@ export const Footer = ({
           </Box>
           <Typography
             variant="body1"
-            sx={{ 
-              fontSize: '16px', 
+            sx={{
+              fontSize: '16px',
               fontWeight: 500,
-              color: '#000000', 
-              pt: 2 
+              color: '#000000',
+              pt: 2,
             }}
           >
-            {link?.title || "Experiencing Technical Issues?"} <br />
+            {link?.title || 'Experiencing Technical Issues?'} <br />
             <Link
-              href={link?.uri || "https://github.com/Women-Coding-Community/wcc-website/issues"}
+              href={
+                link?.uri ||
+                'https://github.com/Women-Coding-Community/wcc-website/issues'
+              }
               target="_blank"
               rel="noopener noreferrer"
-              sx={{ 
+              sx={{
                 color: 'custom.linkBlue',
                 fontSize: '14px',
                 fontWeight: 400,
@@ -150,7 +153,7 @@ export const Footer = ({
               }}
             >
               {/* Hardcoded to match Figma #218 and override incomplete BE label */}
-                Send us a report on GitHub
+              Send us a report on GitHub
             </Link>
           </Typography>
         </Box>