refactor: change status colors

impress-org · Oct 3, 2024 · 038be39 · 038be39
1 parent fea3d9e
commit 038be39
Show file tree

Hide file tree

Showing 5 changed files with 110 additions and 3 deletions.
diff --git a/src/Campaigns/ListTable/Columns/StatusColumn.php b/src/Campaigns/ListTable/Columns/StatusColumn.php
@@ -57,7 +57,7 @@ public function getCellValue($model)
         }
 
         return sprintf(
-            '<div class="statusBadgeCampaign statusBadgeCampaign--%1$s"><p>%2$s</p></div>',
+            '<div class="statusBadge statusBadge--%1$s"><p>%2$s</p></div>',
             $model->status->getValue(),
             $statusLabel
         );

diff --git a/src/Campaigns/resources/admin/components/CampaignDetailsPage/CampaignDetailsPage.module.scss b/src/Campaigns/resources/admin/components/CampaignDetailsPage/CampaignDetailsPage.module.scss
@@ -1,3 +1,11 @@
+body {
+    /*margin: 0;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
+    'Droid Sans', 'Helvetica Neue', sans-serif;*/
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
 .container {
     margin-top: 3rem;
     padding: 3rem;

diff --git a/src/Campaigns/resources/admin/components/CampaignsListTable/CampaignsListTable.module.scss b/src/Campaigns/resources/admin/components/CampaignsListTable/CampaignsListTable.module.scss
@@ -1,3 +1,12 @@
+body {
+    /*margin: 0;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
+    'Droid Sans', 'Helvetica Neue', sans-serif;*/
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+
 .container {
     text-align: center;
     color: #424242;

diff --git a/src/Views/Components/ListTable/InterweaveSSR/styles.scss b/src/Views/Components/ListTable/InterweaveSSR/styles.scss
@@ -1,7 +1,7 @@
 @use 'assets/src/css/Safe-Rem/functions' as *;
 
 .interweave {
-    .statusBadge {
+    /*.statusBadge {
         display: flex;
         justify-content: center;
         align-items: center;
@@ -51,6 +51,96 @@
         &--complete {
             background: #666666;
         }
+    }*/
+
+    .statusBadge {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: fit-content;
+        height: safe-rem(1.375);
+        /*padding-block: 0.185rem;*/
+        padding: 0.125rem 0.75rem 0.125rem 0.75rem;
+        /*background-color: black;
+        color: #fff;*/
+        background-color: #CEF2CF;
+        color: #1A0F00;
+        border-radius: safe-rem(1);
+
+        letter-spacing: 0.04rem;
+        transform: translateY(0.075rem);
+        column-gap: safe-rem(1);
+        text-transform: capitalize;
+
+        p {
+            font-size: safe-rem(0.75);
+            font-weight: 600;
+            line-height: safe-rem(1.125);
+            -webkit-font-smoothing: antialiased;
+            -moz-osx-font-smoothing: grayscale;
+        }
+
+        &--completed,
+        &--complete {
+            background: #9df2c8; /*var(--givewp-green-100);*/
+            /*background: #CEF2CF;*/
+        }
+
+        &--active,
+        &--published {
+            /*background: #69b868;*/
+            background: #CEF2CF; /*--givewp-green-100*/
+        }
+
+        &--archived,
+        &--inactive,
+        {
+            background: #dadada; /* --givewp-grey-100*/
+            color: #0e0e0e;
+        }
+
+        &--failing {
+            /* --givewp-yellow-100: #fff0a6; */
+            background: #fff0a6;
+        }
+
+        &--failed,
+        &--revoked,
+        &--abandoned,
+        &--cancelled,
+        &--expired {
+            /*--givewp-red-100: #ffb5a6;*/
+            background: #ffb5a6;
+            /*background: #f1cc50;*/
+        }
+
+        &--draft {
+            background: #FFDAA6; /*--givewp-orange-100: #ffdaa6;*/
+        }
+
+        &--pending,
+        &--processing {
+            /*--givewp-blue-100: #a6d2ff;*/
+            background: #a6d2ff;
+        }
+
+        &--upgraded {
+            /*--givewp-purple-50: #beb6f2;*/
+            background: #beb6f2;
+            color: #03001a;
+        }
+
+        &--refunded {
+            /*--givewp-blue-700: #19661c;*/
+            background: #074a8c;
+            /*--givewp-blue-25: #f2fff3;*/
+            color: #f2f9ff;
+        }
+
+        /*&--complete {
+            background: #666666;
+            color: #fff;
+        }*/
     }
 
     .statusBadgeCampaign {

diff --git a/src/Views/Components/ListTable/ListTablePage/ListTablePage.module.scss b/src/Views/Components/ListTable/ListTablePage/ListTablePage.module.scss
@@ -1,7 +1,7 @@
 :global {
 
     :root {
-        --give-primary-color: #69b868;
+        --give-primary-color: #86b785;
     }
 
     .post-type-give_forms #wpbody {