From c2a9f386f8109a2ffc5901777225338947d35f2e Mon Sep 17 00:00:00 2001
From: Joshua Dinh <josh@joshuadinh.tech>
Date: Wed, 11 Dec 2024 18:04:05 +0900
Subject: [PATCH] refactor: update campaign header bread crumbs

---
 .../CampaignDetailsPage.module.scss           | 23 +++++++++++--------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/Campaigns/resources/admin/components/CampaignDetailsPage/CampaignDetailsPage.module.scss b/src/Campaigns/resources/admin/components/CampaignDetailsPage/CampaignDetailsPage.module.scss
index 7a619fc95e..7bb5382622 100644
--- a/src/Campaigns/resources/admin/components/CampaignDetailsPage/CampaignDetailsPage.module.scss
+++ b/src/Campaigns/resources/admin/components/CampaignDetailsPage/CampaignDetailsPage.module.scss
@@ -55,7 +55,7 @@
 }
 
 .pageHeader {
-    background-color: #fff;
+    background-color: var(--givewp-shades-white);
     padding-block: 1em;
     padding-inline: 1.5em;
 }
@@ -94,17 +94,20 @@
 
 .breadcrumb {
     display: flex;
-    line-height: 1rem;
-    font-size: 0.7rem;
-    color: #424242;
+    align-items: center;
+    gap: 0.25rem;
+    line-height: 1.125rem;
+    font-size: 0.75rem;
 
     & > span {
         font-weight: bold;
+        color: var(--givewp-neutral-900);
     }
 
     & > a {
         text-decoration: none;
-        color: #696969;
+        color: var(--givewp-neutral-500);
+        font-weight: 400;
     }
 
     & > a:hover {
@@ -474,19 +477,21 @@ select[name="campaignId"] {
     }
 
     .campaignButtonDots {
-        background-color: #e5e7eb;
-        border-color: #d1d5db;
+        background-color: var(--givewp-neutral-100);
+        border-color: var(--givewp-neutral-100);
         border-radius: var(--givewp-rounded-4);
         line-height: 0;
         padding: var(--givewp-spacing-2);
 
         &:hover {
-            background-color: #d1d5db;
+            background-color:var(--givewp-neutral-200);
+            border-color: var(--givewp-neutral-200);
         }
     }
 
     .campaignButtonDotsActive {
-        background-color: #d1d5db;
+        background-color: var(--givewp-neutral-200);
+        border-color: var(--givewp-neutral-200);
     }
 
     .contextMenu {