Merge pull request #35 from buttercup/sallar/theme-fixes

Fix theme issues for Desktop

package.json

@@ -114,7 +114,7 @@
     "styled-components": "^4.1.3"
   },
   "dependencies": {
-    "@blueprintjs/core": "^3.25.0",
+    "@blueprintjs/core": "^3.36.0",
     "@blueprintjs/icons": "^3.15.0",
     "@buttercup/generator": "^1.2.0",
     "@buttercup/react-formatted-input": "^1.3.0",

src/components/vault/AddEntry.js

@@ -28,9 +28,10 @@ const AddEntry = ({ disabled }) => {
         text="New Entry"
         onClick={() => onAddEntry(defaultEntryType)}
         disabled={disabled}
+        fill
       />
       <Popover content={renderMenu} boundary="viewport">
-        <Button icon="more" disabled={disabled} />
+        <Button icon="more" disabled={disabled} fill={false} />
       </Popover>
     </ButtonGroup>
   );

src/components/vault/Pane.js

@@ -56,7 +56,7 @@ export const PaneContainer = styled.div`
   display: grid;
   overflow: hidden;
   background-color: ${props => props.primary && getThemeProp(props, 'colors.mainPaneBackground')};
-  grid-template-rows: 55px 1fr 40px;
+  grid-template-rows: 55px 1fr 50px;
   grid-template-areas:
     'header'
     'body'

src/styles/themes.js

@@ -1,6 +1,7 @@
 import { Colors } from '@blueprintjs/core';
 
 const light = {
+  dark: false,
   vault: {
     list: {
       focusedBackgroundColor: Colors.LIGHT_GRAY5,
@@ -34,6 +35,7 @@ const light = {
 };
 
 const dark = {
+  dark: true,
   vault: {
     list: {
       focusedBackgroundColor: Colors.DARK_GRAY5,

stories/vault.js

@@ -254,8 +254,8 @@ function VaultRender({ formatB = false, dark = false, basic = true, icons = true
     createVaultManager();
   }, []);
   return (
-    <ThemeProvider theme={dark ? themes.dark : themes.light}>
-      <View>
+    <View className={dark ? 'bp3-dark' : ''}>
+      <ThemeProvider theme={dark ? themes.dark : themes.light}>
         <If condition={archiveFacade}>
           <VaultProvider
             vault={archiveFacade}
@@ -289,8 +289,8 @@ function VaultRender({ formatB = false, dark = false, basic = true, icons = true
             <VaultUI />
           </VaultProvider>
         </If>
-      </View>
-    </ThemeProvider>
+      </ThemeProvider>
+    </View>
   );
 }