update homepage images

src/components/HomepageFeatures/index.tsx

@@ -5,60 +5,58 @@ import Translate from '@docusaurus/Translate';
 
 type FeatureItem = {
   title: string | JSX.Element;
-  Svg: React.ComponentType<React.ComponentProps<'svg'>>;
+  image: string | React.ComponentType<React.ComponentProps<'svg'>>;
   description: JSX.Element;
 };
 
 const FeatureList: FeatureItem[] = [
   {
     title: <Translate>features.deploy.title</Translate>,
-    Svg: require("@site/static/img/undraw_control-panel_j1wf.svg").default,
-    description: (
-      <Translate>features.deploy.description</Translate>
-    ),
+    image: require("@site/static/img/f1.png").default,
+    description: <Translate>features.deploy.description</Translate>,
   },
   {
     title: <Translate>features.run.title</Translate>,
-    Svg: require("@site/static/img/undraw_real-time-sync_ro77.svg").default,
-    description: (
-      <Translate>features.run.description</Translate>
-    ),
+    image: require("@site/static/img/f2.png").default,
+    description: <Translate>features.run.description</Translate>,
   },
   {
     title: <Translate>features.interact.title</Translate>,
-    Svg: require("@site/static/img/undraw_chat-bot_44el.svg").default,
-    description: (
-      <Translate>features.interact.description</Translate>
-    ),
+    image: require("@site/static/img/f3.png").default,
+    description: <Translate>features.interact.description</Translate>,
   },
   {
     title: <Translate>features.ui.title</Translate>,
-    Svg: require("@site/static/img/undraw_experience-design_d4md.svg").default,
-    description: (
-      <Translate>features.ui.description</Translate>
-    ),
+    image: require("@site/static/img/f4.png").default,
+    description: <Translate>features.ui.description</Translate>,
   },
   {
     title: <Translate>features.memory.title</Translate>,
-    Svg: require("@site/static/img/undraw_moments_4a32.svg").default,
-    description: (
-      <Translate>features.memory.description</Translate>
-    ),
+    image: require("@site/static/img/f5.png").default,
+    description: <Translate>features.memory.description</Translate>,
   },
   {
     title: <Translate>features.companion.title</Translate>,
-    Svg: require("@site/static/img/undraw_friendship_chd3.svg").default,
-    description: (
-      <Translate>features.companion.description</Translate>
-    ),
+    image: require("@site/static/img/f6.png").default,
+    description: <Translate>features.companion.description</Translate>,
   },
 ];
 
-function Feature({title, Svg, description}: FeatureItem) {
+function Feature({title, image, description}: FeatureItem) {
   return (
     <div className={clsx('col col--4')}>
       <div className="text--center">
-        <Svg className={styles.featureSvg} role="img" />
+        {typeof image === 'string' ? (
+          <img 
+            src={image} 
+            className={styles.featureImage} 
+            role="img" 
+            alt={typeof title === 'string' ? title : 'feature'} 
+          />
+        ) : (
+          // @ts-ignore
+          <image className={styles.featureSvg} role="img" />
+        )}
       </div>
       <div className="text--center padding-horiz--md">
         <Heading as="h3">{title}</Heading>

src/components/HomepageFeatures/styles.module.css

@@ -9,3 +9,10 @@
   height: 200px;
   width: 200px;
 }
+
+.featureImage {
+  width: auto;
+  height: 200px; /* 或者您想要的其他高度 */
+  object-fit: contain; /* 保持图片比例 */
+  margin: 0 auto;
+}