feat(ui): enhance comparison table layout and update community support information

Author: phodal

src/components/HomepageFeatures/index.tsx

@@ -86,7 +86,6 @@ function QuickLinks() {
   );
 }
 
-// Comparison table section
 function ComparisonTable() {
   return (
     <section className={styles.comparisonSection}>
@@ -99,9 +98,9 @@ function ComparisonTable() {
           <table className={styles.comparisonTable}>
             <thead>
             <tr>
-              <th>功能</th>
+              <th className={styles.featureCell}>功能</th>
               <th>传统 AI 助手</th>
-              <th>AutoDev</th>
+              <th className={styles.advantageCell}>AutoDev</th>
             </tr>
             </thead>
             <tbody>
@@ -178,7 +177,7 @@ function Community() {
   const resources = [
     { title: 'GitHub', description: '为我们的仓库加星标，报告问题，并为代码库做出贡献', link: 'https://github.com/username/autodev', icon: <div className={styles.communityIconGithub} /> },
     { title: '研究论文', description: '阅读我们在 arXiv 上的学术论文，了解 AutoDev 背后的研究', link: '', icon: <div className={styles.communityIconPaper} /> },
-    { title: 'Discord', description: '加入我们的 Wechat 社区，与其他开发者交流并获取支持', link: '', icon: <div className={styles.communityIconDiscord} /> },
+    { title: '微信群', description: '加入我们的 Wechat 社区，与其他开发者交流并获取支持（添加 phodal02 为好友，注明：AutoDev）', link: '', icon: <div className={styles.communityIconDiscord} /> },
   ];
 
   return (
@@ -222,3 +221,4 @@ export default function HomepageFeatures(): ReactNode {
     </>
   );
 }
+

src/components/HomepageFeatures/styles.module.css

@@ -124,21 +124,27 @@
 .comparisonSection {
   padding: 4rem 0;
   background-color: var(--ifm-color-emphasis-100);
+  width: 100%;
 }
 
 .tableWrapper {
   overflow-x: auto;
+  width: 100%;
+  display: flex;
+  justify-content: center;
 }
 
 .comparisonTable {
   width: 100%;
   border-collapse: collapse;
   margin: 0 auto;
-  max-width: 900px;
+  display: inline-table;
+  table-layout: fixed; /* Add fixed layout for better width control */
 }
 
 .comparisonTable th,
 .comparisonTable td {
+  width: 35%;
   padding: 1rem;
   text-align: left;
   border-bottom: 1px solid var(--ifm-color-emphasis-200);
@@ -156,6 +162,7 @@
 .advantageCell {
   color: var(--ifm-color-primary);
   font-weight: 500;
+  width: 40%; /* Set width for AutoDev column */
 }
 
 .advantage,