From 505140c470f15b38a5d785038c20bbbee070df1d Mon Sep 17 00:00:00 2001
From: Sean <ussa.say@gmail.com>
Date: Sun, 18 Aug 2024 21:42:08 -0700
Subject: [PATCH] Make "picked up" badge green

---
 src/components/store/OrderSummary/index.tsx              | 4 +++-
 src/components/store/OrderSummary/style.module.scss      | 6 ++++++
 src/components/store/OrderSummary/style.module.scss.d.ts | 1 +
 3 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/store/OrderSummary/index.tsx b/src/components/store/OrderSummary/index.tsx
index 16e7411b..fecb5076 100644
--- a/src/components/store/OrderSummary/index.tsx
+++ b/src/components/store/OrderSummary/index.tsx
@@ -54,7 +54,9 @@ const OrderItemPreview = ({ item, showFulfilled, showNotFulfilled }: OrderItemPr
           // up from a previous partially fulfilled order that was rescheduled.
           // For example, if an item is fulfilled but the order is missed or
           // cancelled
-          <div className={styles.badge}>{showNotFulfilled ? 'Picked up' : 'Already picked up'}</div>
+          <div className={`${styles.badge} ${styles.pickedUp}`}>
+            {showNotFulfilled ? 'Picked up' : 'Already picked up'}
+          </div>
         ) : null}
         {showNotFulfilled && !item.fulfilled ? (
           // Only shows for partially fulfilled orders when the item wasn't
diff --git a/src/components/store/OrderSummary/style.module.scss b/src/components/store/OrderSummary/style.module.scss
index 32ab3d81..63fbcc3e 100644
--- a/src/components/store/OrderSummary/style.module.scss
+++ b/src/components/store/OrderSummary/style.module.scss
@@ -33,6 +33,12 @@
         position: absolute;
         right: 0;
 
+        &.pickedUp {
+          background-color: vars.$green-100;
+          border-color: vars.$green-300;
+          color: vars.$green-300;
+        }
+
         &.notAvailable {
           background-color: vars.$scarlet-1;
           border-color: vars.$red;
diff --git a/src/components/store/OrderSummary/style.module.scss.d.ts b/src/components/store/OrderSummary/style.module.scss.d.ts
index 44b58265..a21173b4 100644
--- a/src/components/store/OrderSummary/style.module.scss.d.ts
+++ b/src/components/store/OrderSummary/style.module.scss.d.ts
@@ -10,6 +10,7 @@ export type Styles = {
   label: string;
   notAvailable: string;
   partiallyFulfilledText: string;
+  pickedUp: string;
   rescheduleReminder: string;
   totalDiamonds: string;
   totalPrice: string;