Merge pull request #14 from Chia-Network/develop

release: 1.3.0
Chia-Network · Sep 12, 2023 · ae1b44b · ae1b44b
2 parents 89641df + 13c8c5f
commit ae1b44b
Show file tree

Hide file tree

Showing 10 changed files with 37 additions and 38 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "core-registry-cadt-ui",
-  "version": "1.2.11",
+  "version": "1.3.0",
   "private": true,
   "author": "Chia Network Inc. <[email protected]>",
   "homepage": "./",

diff --git a/src/components/blocks/LeftNav.js b/src/components/blocks/LeftNav.js
@@ -37,22 +37,23 @@ const NavContainer = styled('div')`
 `;
 
 const MenuItem = styled(Link)`
-  background: ${props =>
-    props.selected ? props.theme.colors.default.secondaryDark : 'transparent'};
-  ${props =>
-    !props.selected &&
-    !props.disabled &&
-    `:hover {background: ${props.theme.colors.default.secondary};}`};
-  padding: 0.5625rem 0rem 0.75rem 2.75rem;
+  background: ${props => (props.selected ? 'white' : 'transparent')};
+  :hover {
+    background: ${props => props.theme.colors.default.primary};
+  }
+  padding: 0.5625rem 0rem 0.75rem 3.25rem;
+  text-transform: uppercase;
   ${props =>
-    props.disabled ? 'color: #BFBFBF; pointer-events: none;' : 'color: white;'}
+    props.selected
+      ? `color: ${props.theme.colors.default.primary};`
+      : 'color: #6e7d7f;'}
   font-family: ${props => props.theme.typography.primary.bold};
   cursor: pointer;
   display: block;
   text-decoration: none;
   width: calc(100% - 1.625rem);
   margin: auto;
-  font-size: 1.2rem;
+  font-size: 1.1rem;
   box-sizing: border-box;
   border-radius: 0.625rem;
   margin-bottom: 0.625rem;
@@ -108,7 +109,7 @@ const LeftNav = withTheme(({ children }) => {
     <Container>
       <NavContainer>
         <StyledTitleContainer>
-          <WarehouseIcon height={24} width={24} />
+          <WarehouseIcon height={24} width={24} color="#6e7d7f" />
           <ButtonText>
             <FormattedMessage id="warehouse" />
           </ButtonText>

diff --git a/src/components/blocks/Modal.js b/src/components/blocks/Modal.js
@@ -208,15 +208,13 @@ const Modal = withTheme(
                   size="large"
                   label={intl.formatMessage({ id: 'cancel' })}
                   onClick={onClose}
-                  type="default"
                 />
               )}
               {extraButtonLabel && extraButtonOnClick && (
                 <PrimaryButton
                   size="large"
                   label={extraButtonLabel}
                   onClick={extraButtonOnClick}
-                  type="default"
                 />
               )}
               <PrimaryButton

diff --git a/src/components/form/PrimaryButton.js b/src/components/form/PrimaryButton.js
@@ -10,9 +10,9 @@ const Button = styled('button')`
   flex-direction: row;
   max-width: 100%;
   background-color: ${props =>
-    props.danger ? '#FF4D4F' : props.theme.colors.default.secondary};
-  border: none;
-  border-radius: 2px;
+    props.danger ? '#FF4D4F' : props.theme.colors.default.secondaryDark};
+  border: 1px solid #1a8385;
+  border-radius: 5px;
   padding: 10px;
   height: 32px;
   cursor: pointer;
@@ -30,7 +30,7 @@ const Button = styled('button')`
 
   &:active {
     background-color: ${props =>
-      props.danger ? '#F5222D' : props.theme.colors.default.secondary};
+      props.danger ? '#F5222D' : props.theme.colors.default.secondaryDark};
   }
 
   ${props =>
@@ -117,7 +117,7 @@ const PrimaryButton = ({
           <span style={{ width: size === 'small' ? 2 : 5 }}></span>
         </>
       )}
-      <ButtonText color={disabled ? '#BFBFBF' : 'white'}>{label}</ButtonText>
+      <ButtonText color={disabled ? '#BFBFBF' : '#0E172B'}>{label}</ButtonText>
     </Button>
   );
 };

diff --git a/src/components/icons/RegistryIcon.js b/src/components/icons/RegistryIcon.js
diff --git a/src/components/icons/WarehouseIcon.js b/src/components/icons/WarehouseIcon.js
@@ -1,26 +1,26 @@
 import React from 'react';
 import { withTheme } from 'styled-components';
 
-const WarehouseIcon = withTheme(({ width, height }) => {
+const WarehouseIcon = withTheme(({ width, height, color = '#6e7d7f' }) => {
   return (
     <svg
       width={`${width}px`}
       height={`${height}px`}
       viewBox="0 0 22 18"
-      fill="none"
+      fill={color}
       xmlns="http://www.w3.org/2000/svg"
     >
       <path
         d="M15.5 7.45312H6.49998C6.39685 7.45312 6.31248 7.5375 6.31248 7.64062V17.0625C6.31248 17.1656 6.39685 17.25 6.49998 17.25H15.5C15.6031 17.25 15.6875 17.1656 15.6875 17.0625V7.64062C15.6875 7.5375 15.6031 7.45312 15.5 7.45312ZM7.81248 8.95312H14.1875V11.6953H7.81248V8.95312ZM14.1875 15.75H7.81248V13.0078H14.1875V15.75Z"
-        fill="currentColor"
+        fill={color}
       />
       <path
         d="M8.93748 14.5312C8.93748 14.7302 9.01649 14.9209 9.15715 15.0616C9.2978 15.2022 9.48856 15.2812 9.68748 15.2812C9.88639 15.2812 10.0772 15.2022 10.2178 15.0616C10.3585 14.9209 10.4375 14.7302 10.4375 14.5312C10.4375 14.3323 10.3585 14.1416 10.2178 14.0009C10.0772 13.8603 9.88639 13.7812 9.68748 13.7812C9.48856 13.7812 9.2978 13.8603 9.15715 14.0009C9.01649 14.1416 8.93748 14.3323 8.93748 14.5312ZM8.93748 10.3594C8.93748 10.5583 9.01649 10.7491 9.15715 10.8897C9.2978 11.0304 9.48856 11.1094 9.68748 11.1094C9.88639 11.1094 10.0772 11.0304 10.2178 10.8897C10.3585 10.7491 10.4375 10.5583 10.4375 10.3594C10.4375 10.1605 10.3585 9.9697 10.2178 9.82904C10.0772 9.68839 9.88639 9.60938 9.68748 9.60938C9.48856 9.60938 9.2978 9.68839 9.15715 9.82904C9.01649 9.9697 8.93748 10.1605 8.93748 10.3594Z"
-        fill="currentColor"
+        fill={color}
       />
       <path
         d="M18.0181 5.64609C16.9447 2.8125 14.2095 0.796875 11.0056 0.796875C7.8017 0.796875 5.06655 2.81016 3.99311 5.64375C1.97514 6.17578 0.489205 8.02031 0.500923 10.2094C0.514986 12.6562 2.41342 14.6461 4.80405 14.8594C4.9142 14.8687 5.00795 14.782 5.00795 14.6719V13.2562C5.00795 13.1625 4.93764 13.0828 4.84389 13.0711C4.21108 12.9914 3.61342 12.7148 3.15405 12.2625C2.59155 11.7117 2.28217 10.9711 2.28217 10.1859C2.28217 9.52969 2.49545 8.91094 2.89624 8.39531C3.28764 7.89375 3.83842 7.53047 4.44545 7.37109L5.33374 7.13672L5.65952 6.27656C5.86108 5.74219 6.14233 5.24062 6.49624 4.78828C6.84545 4.33828 7.2603 3.94453 7.72436 3.61641C8.68764 2.93906 9.82202 2.58047 11.0056 2.58047C12.1892 2.58047 13.3236 2.93906 14.2869 3.61875C14.7533 3.94687 15.1658 4.34062 15.515 4.79062C15.8689 5.24297 16.1501 5.74453 16.3517 6.27891L16.6751 7.13672L17.5611 7.37109C18.8314 7.70859 19.7197 8.86406 19.7197 10.1836C19.7197 10.9711 19.4103 11.7094 18.8478 12.2602C18.3908 12.7102 17.7955 12.9891 17.1626 13.0687C17.0689 13.0805 17.0009 13.1602 17.0009 13.2539V14.6719C17.0009 14.782 17.097 14.8687 17.2072 14.8594C19.5908 14.6437 21.4845 12.6562 21.5009 10.2141C21.515 8.025 20.0314 6.18047 18.0181 5.64609Z"
-        fill="currentColor"
+        fill={color}
       />
     </svg>
   );

diff --git a/src/components/layout/Header.js b/src/components/layout/Header.js
@@ -6,7 +6,6 @@ import styled from 'styled-components';
 import { LocaleSwitcher, Body, AppLogo, MyAccount } from '..';
 
 const Headline = styled('div')`
-  border-top: 8px solid ${props => props.theme.colors.default.secondary};
   padding-top: 5px;
   padding-bottom: 5px;
   width: 100%;

diff --git a/src/components/layout/Tabs.js b/src/components/layout/Tabs.js
@@ -5,19 +5,20 @@ import styled from 'styled-components';
 
 const StyledTabs = styled(MuiTabs)`
   .MuiButtonBase-root {
-    color: ${props => props.theme.colors.default.secondary};
+    color: #6e7d7f;
+    font-family: ${props => props.theme.typography.primary.semiBold};
   }
 
   .MuiButtonBase-root:hover {
-    color: ${props => props.theme.colors.default.secondaryDark};
+    color: ${props => props.theme.colors.default.primary};
   }
 
   button.Mui-selected {
-    color: ${props => props.theme.colors.default.secondaryDark};
+    color: ${props => props.theme.colors.default.primaryDark};
   }
 
   .MuiTabs-indicator {
-    background-color: ${props => props.theme.colors.default.secondaryDark};
+    background-color: ${props => props.theme.colors.default.primaryDark};
   }
 `;
 

diff --git a/src/components/typography/ButtonText.js b/src/components/typography/ButtonText.js
@@ -3,7 +3,7 @@ import { useSelector } from 'react-redux';
 import styled, { withTheme } from 'styled-components';
 
 const Text = styled('h4')`
-  color: ${props => props.color || props.theme.colors.default.onSurface};
+  color: ${props => props.color || '#6e7d7f'} !important;
   font-size: 1rem;
   font-family: ${props => props.theme.typography.primary.regular};
   line-height: 1.375rem;

diff --git a/src/theme.js b/src/theme.js
@@ -25,20 +25,20 @@ const headings = {
  */
 const colors = {
   default: {
-    primary: '#00242C',
-    secondary: '#2dec7c',
-    secondaryDark: '#1b9b5c',
-    shade1: '#4d5c62',
+    primary: '#6e7d7f',
+    secondary: '#FEFEFF',
+    secondaryDark: '#5ECE71',
+    shade1: '#F0F2F5',
     shade2: '#7f8b90',
     shade3: '#a5adb1',
-    shade4: '#c8d0d5',
+    shade4: '#F0F2F5',
     shade5: '#dee6eb',
     shade6: '#ecf3f7',
     red: '#ff5c53',
     redDark: '#c64740',
     white: '#FFFFFF',
     blue: '#47b2fa',
-    background: '#c8d0d5',
+    background: '#F0F2F5',
     onSurface: '#000000',
     onButton: '#FFFFFF',
     status: {