fix: usage ux

src/components/card-wrapper/simple-card.tsx

@@ -68,12 +68,14 @@ export const SimpleCardItem: React.FC<{
     <div className={cx({ bordered: bordered }, styles.wrapper)} style={style}>
       <div className="title">{title}</div>
       <div className="content">
-        <span
-          className={cx([iconType], 'icon')}
-          style={{
-            backgroundColor: color || 'transparent'
-          }}
-        ></span>
+        {iconType && (
+          <span
+            className={cx([iconType], 'icon')}
+            style={{
+              backgroundColor: color || 'transparent'
+            }}
+          ></span>
+        )}
         <span>{content}</span>
       </div>
     </div>
@@ -89,8 +91,12 @@ export const SimpleCard: React.FC<{
   }[];
   height?: string | number;
   bordered?: boolean;
+  styles?: {
+    wrapper?: React.CSSProperties;
+    item?: React.CSSProperties;
+  };
 }> = (props) => {
-  const { dataList, bordered } = props;
+  const { dataList, bordered, styles } = props;
 
   return (
     <SimpleCardItemWrapper style={{ height: props.height || '100%' }}>
@@ -102,6 +108,9 @@ export const SimpleCard: React.FC<{
           bordered={bordered}
           color={item.color}
           iconType={item.iconType}
+          style={{
+            ...styles?.item
+          }}
         ></SimpleCardItem>
       ))}
     </SimpleCardItemWrapper>