make dark theme more useful

brave · Oct 21, 2019 · 536893f · 536893f
1 parent 9a6c7b4
commit 536893f
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/src/components/layout/card/__snapshots__/spec.tsx.snap b/src/components/layout/card/__snapshots__/spec.tsx.snap
@@ -6,7 +6,7 @@ exports[`card tests basic tests matches the snapshot 1`] = `
   width: 100%;
   min-height: auto;
   margin: 0;
-  background-color: #fff;
+  background-color: #FFFFFF;
   border-radius: 4px;
   box-shadow: 0 2px 4px rgba(0,0,0,.15);
   font-size: inherit;

diff --git a/src/components/layout/card/style.ts b/src/components/layout/card/style.ts
@@ -24,7 +24,7 @@ export const Card = styled<StyledCardProps, 'div'>('div')`
   width: 100%;
   min-height: auto;
   margin: 0;
-  background-color: #fff;
+  background-color: ${p => p.theme.color.panelBackground};
   border-radius: 4px;
   box-shadow: ${p => `0 2px 4px rgba(0, 0, 0, ${getShadowOpacity(p.emphasis)})`};
   font-size: inherit;

diff --git a/src/theme/brave-dark.ts b/src/theme/brave-dark.ts
@@ -11,7 +11,9 @@ const darkTheme: ITheme = {
     contextMenuForeground: colors.white,
     defaultControl: colors.grey400,
     defaultControlInteracting: colors.white,
-    defaultControlActive: colors.grey500
+    defaultControlActive: colors.grey500,
+    panelBackground: colors.grey900,
+    text: colors.white
   }
 }