fix: error icon color in sidebar (#1550)

apps/web/src/components/pure/workspace-slider-bar/icons/Icons.tsx

@@ -1,27 +0,0 @@
-export const AffineIcon = () => {
-  return (
-    <svg
-      width="40"
-      height="40"
-      viewBox="0 0 40 40"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <rect
-        x="0.5"
-        y="0.5"
-        width="39"
-        height="39"
-        rx="19.5"
-        stroke="#6880FF"
-        fill="#FFF"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M18.6303 8.79688L11.2559 29.8393H15.5752L20.2661 15.2858L24.959 29.8393H29.2637L21.8881 8.79688H18.6303Z"
-        fill="#6880FF"
-      />
-    </svg>
-  );
-};

apps/web/src/components/pure/workspace-slider-bar/style.ts

@@ -57,6 +57,7 @@ export const StyledListItem = styled('div')<{
     '> svg': {
       fontSize: '20px',
       marginRight: '12px',
+      color: active ? theme.colors.primaryColor : theme.colors.iconColor,
     },
     ':hover:not([disabled])': {
       color: theme.colors.primaryColor,
@@ -65,7 +66,7 @@ export const StyledListItem = styled('div')<{
   };
 });
 
-export const StyledLink = styled(Link)(() => {
+export const StyledLink = styled(Link)(({ theme }) => {
   return {
     flexGrow: 1,
     textAlign: 'left',
@@ -77,6 +78,7 @@ export const StyledLink = styled(Link)(() => {
     '>svg': {
       fontSize: '20px',
       marginRight: '12px',
+      color: theme.colors.iconColor,
     },
   };
 });

pnpm-lock.yaml

@@ -5930,7 +5930,7 @@ packages:
       '@babel/plugin-transform-react-jsx-source': 7.19.6_@babel+core@7.21.0
       magic-string: 0.27.0
       react-refresh: 0.14.0
-      vite: 4.1.4
+      vite: 4.1.4_@types+node@18.14.4
     transitivePeerDependencies:
       - supports-color
     dev: true