feat: modify workspace modal style & add workspace setting entry to worksapce card (#1498)

packages/component/src/ui/breadcrumbs/index.ts

@@ -4,6 +4,6 @@ import { styled } from '../../styles';
 
 export const Breadcrumbs = styled(MuiBreadcrumbs)(({ theme }) => {
   return {
-    color: theme.colors.popoverColor,
+    color: theme.colors.textColor,
   };
 });

packages/component/src/ui/button/styles.ts

@@ -68,9 +68,10 @@ export const StyledIconButton = styled('button', {
         color: hoverColor ?? theme.colors.primaryColor,
         '::after': {
           background:
-            hoverBackground ?? darker
+            hoverBackground ||
+            (darker
               ? theme.colors.innerHoverBackground
-              : theme.colors.hoverBackground,
+              : theme.colors.hoverBackground),
         },
         ...(hoverStyle ?? {}),
       },
@@ -116,7 +117,7 @@ export const StyledTextButton = styled('button', {
     shape = 'default',
     // TODO: Implement type
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    type = 'default',
+    // type = 'default',
   }) => {
     const { fontSize, borderRadius, padding, height } = getSize(size);
     console.log('size', size, height);

packages/component/src/ui/button/utils.ts

@@ -104,7 +104,7 @@ export const getButtonColors = (
       };
     default:
       return {
-        color: theme.colors.popoverColor,
+        color: theme.colors.textColor,
         borderColor: theme.colors.borderColor,
         ':hover': {
           borderColor: theme.colors.primaryColor,

packages/component/src/ui/confirm/styles.ts

@@ -15,7 +15,6 @@ export const StyledConfirmTitle = styled('div')(({ theme }) => {
     fontSize: theme.font.h6,
     fontWeight: 600,
     textAlign: 'center',
-    color: theme.colors.popoverColor,
     lineHeight: '28px',
   };
 });

packages/component/src/ui/input/style.ts

@@ -15,7 +15,7 @@ export const StyledInput = styled('input')<{
     fontWeight,
     fontSize,
     height: height ? `${height}px` : 'auto',
-    color: disabled ? theme.colors.disableColor : theme.colors.inputColor,
+    color: disabled ? theme.colors.disableColor : theme.colors.textColor,
     border: `1px solid`,
     borderColor: theme.colors.borderColor, // TODO: check out disableColor,
     backgroundColor: theme.colors.popoverBackground,

packages/component/src/ui/menu/styles.ts

@@ -14,7 +14,6 @@ export const StyledMenuWrapper = styled(StyledPopperContainer)<{
     fontSize: '14px',
     backgroundColor: theme.colors.popoverBackground,
     boxShadow: theme.shadow.popover,
-    color: theme.colors.popoverColor,
   };
 });
 
@@ -39,7 +38,6 @@ export const StyledMenuItem = styled('button')<{
     ...displayFlex('flex-start', 'center'),
     cursor: isDir ? 'pointer' : '',
     position: 'relative',
-    color: theme.colors.popoverColor,
     backgroundColor: 'transparent',
 
     ':hover': {