Added new colors to the core theme and fixed Modal export (#60)

arkajyotiMukherjee · web-flow · commit 076240202459 · 2020-11-02T12:45:07.000+05:30
* added new colors to the core theme...fixed Modal export
* updated patch version no

Signed-off-by: arkajyotiMukherjee &lt;arkajyoti.mukherjee@mayadata.io&gt;
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "kubera-ui",
   "license": "Apache-2.0",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "private": false,
   "description": "Component Library for Kubera products",
   "author": "MayaData, Inc.",
diff --git a/src/core/Button/ButtonFilled/styles.ts b/src/core/Button/ButtonFilled/styles.ts
@@ -3,6 +3,7 @@ import { fade, makeStyles, Theme } from '@material-ui/core';
 const useStyles = makeStyles((theme: Theme) => ({
   // Global
   root: {
+    height: 'fit-content',
     padding: theme.spacing(1.5, 2),
     textTransform: 'none',
     background: theme.palette.primary.main,
diff --git a/src/core/Button/ButtonOutlined/styles.ts b/src/core/Button/ButtonOutlined/styles.ts
@@ -3,6 +3,7 @@ import { fade, makeStyles, Theme } from '@material-ui/core';
 const useStyles = makeStyles((theme: Theme) => ({
   // Global
   root: {
+    height: 'fit-content',
     padding: theme.spacing(1.5, 2),
     textTransform: 'none',
     background: 'transparent',
diff --git a/src/core/Modal/Modal.stories.tsx b/src/core/Modal/Modal.stories.tsx
@@ -1,7 +1,7 @@
 import { storiesOf } from '@storybook/react';
 import React from 'react';
 import { ThemedBackground } from '../../utils/storybook';
-import Modal from './Modal';
+import { Modal } from './Modal';
 
 storiesOf('Modal/Base Modal', module)
   // Kubera Chaos
diff --git a/src/core/Modal/Modal.tsx b/src/core/Modal/Modal.tsx
@@ -1,6 +1,6 @@
-import { Modal as MuiModal, Button } from '@material-ui/core';
-import { ModalBaseProps } from './base';
+import { Button, Modal as MuiModal } from '@material-ui/core';
 import React from 'react';
+import { ModalBaseProps } from './base';
 import useStyles from './styles';
 
 interface ModalProps extends ModalBaseProps {
@@ -40,4 +40,4 @@ const Modal: React.FC<ModalProps> = ({
   );
 };
 
-export default Modal;
+export { Modal };
diff --git a/src/core/Modal/__tests__/Modal.test.tsx b/src/core/Modal/__tests__/Modal.test.tsx
@@ -1,7 +1,7 @@
 import { render } from '@testing-library/react';
 import React from 'react';
 import { KuberaThemeProvider } from '../../../theme';
-import Modal from '../Modal';
+import { Modal } from '../Modal';
 
 describe('Modal Component', () => {
   it('Renders', () => {
diff --git a/src/theme/base.ts b/src/theme/base.ts
@@ -5,15 +5,33 @@ declare module '@material-ui/core/styles/createMuiTheme' {
   export interface Theme {
     kuberaCoreCards: {
       kuberaChaos: {
+        background: {
+          default: string;
+          paper: string;
+        };
+        button: {
+          unconfigured: string;
+          configured: string;
+        };
         card: string;
+        highlight: string;
         license: {
           selection: string;
           header: string;
           body: string;
         };
       };
       kuberaPropel: {
+        background: {
+          default: string;
+          paper: string;
+        };
+        button: {
+          unconfigured: string;
+          configured: string;
+        };
         card: string;
+        highlight: string;
         license: {
           selection: string;
           header: string;
@@ -26,15 +44,33 @@ declare module '@material-ui/core/styles/createMuiTheme' {
   export interface ThemeOptions {
     kuberaCoreCards?: {
       kuberaChaos?: {
+        background: {
+          default: string;
+          paper: string;
+        };
+        button: {
+          unconfigured: string;
+          configured: string;
+        };
         card: string;
+        highlight: string;
         license: {
           selection: string;
           header: string;
           body: string;
         };
       };
       kuberaPropel?: {
+        background: {
+          default: string;
+          paper: string;
+        };
+        button: {
+          unconfigured: string;
+          configured: string;
+        };
         card: string;
+        highlight: string;
         license: {
           selection: string;
           header: string;
diff --git a/src/theme/kubera-core.tsx b/src/theme/kubera-core.tsx
@@ -86,15 +86,33 @@ const kuberaCoreTheme = createTheme({
 
   kuberaCoreCards: {
     kuberaChaos: {
-      card: 'linear-gradient(255.08deg, #0D654B 7.37%, #0B4F3A 100%)',
+      background: {
+        default: 'linear-gradient(268.56deg, #443F93 1.65%, #292A5B 61.02%)',
+        paper: 'linear-gradient(255.08deg, #0F7B5B 7.37%, #0E5B44 100%)',
+      },
+      button: {
+        unconfigured: '#52F99540',
+        configured: '#2BCB69',
+      },
+      card: 'linear-gradient(255.08deg, #0F7B5B 7.37%, #0E5B44 100%)',
+      highlight: '#52FF95',
       license: {
         selection: '#0000004D',
         header: 'linear-gradient(255.08deg, #0E694E 7.37%, #094533 100%)',
         body: 'linear-gradient(255.08deg, #074633 7.37%, #04281E 100%)',
       },
     },
     kuberaPropel: {
+      background: {
+        default: 'linear-gradient(265.69deg, #108461 1.43%, #0C262E 64.44%)',
+        paper: 'linear-gradient(249.11deg, #5759A5 25.9%, #505193 94.35%)',
+      },
+      button: {
+        unconfigured: '#EAD74240',
+        configured: '#BDAC74',
+      },
       card: 'linear-gradient(63.18deg, #2C354D 5.01%, #323E5B 102.43%)',
+      highlight: '#EAD7A2',
       license: {
         selection: '#0000004D',
         header: 'linear-gradient(63.18deg, #262F44 5.01%, #323E5B 102.43%)',

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "kubera-ui",`
`3`	`3`	`"license": "Apache-2.0",`
`4`		`- "version": "0.2.0",`
	`4`	`+ "version": "0.2.1",`
`5`	`5`	`"private": false,`
`6`	`6`	`"description": "Component Library for Kubera products",`
`7`	`7`	`"author": "MayaData, Inc.",`