fix(Card): fix dark mode color

gitsindonesia · Jun 8, 2023 · fc0160e · fc0160e
1 parent 34e6aa7
commit fc0160e
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 2 deletions.
diff --git a/packages/card/src/VCard.stories.ts b/packages/card/src/VCard.stories.ts
@@ -198,6 +198,10 @@ export const DarkMode: Story<{}> = () => ({
   <VCard v-for="color in defaultColors" :key="color" :color="color">
     {{ color }}
   </VCard>
+
+  <VCard bordered title="Header" v-for="color in defaultColors" :key="color" :color="color">
+    {{ color }}
+  </VCard>
 </main>
 `,
 });

diff --git a/packages/themes/src/morpheme/_card.dark.scss b/packages/themes/src/morpheme/_card.dark.scss
@@ -3,12 +3,42 @@
     &-default {
       --card-bg-color: var(--color-gray-true-800);
       --card-color: var(--color-gray-true-200);
-      --card-border-color: var(--color-gray-true-600);
+      --card-border-color: var(--color-gray-true-700);
     }
 
     &-dark {
       --card-bg-color: var(--color-gray-800);
-      --card-color: var(--color-white);
+      --card-border-color: var(--color-gray-700);
+    }
+
+    &-primary {
+      --card-bg-color: var(--color-primary-500);
+      --card-border-color: var(--color-primary-400);
+    }
+
+    &-secondary {
+      --card-bg-color: var(--color-secondary-500);
+      --card-border-color: var(--color-secondary-400);
+    }
+
+    &-info {
+      --card-bg-color: var(--color-info-500);
+      --card-border-color: var(--color-info-400);
+    }
+
+    &-warning {
+      --card-bg-color: var(--color-warning-500);
+      --card-border-color: var(--color-warning-400);
+    }
+
+    &-error {
+      --card-bg-color: var(--color-error-500);
+      --card-border-color: var(--color-error-400);
+    }
+
+    &-success {
+      --card-bg-color: var(--color-success-500);
+      --card-border-color: var(--color-success-400);
     }
   }
 }