feat: jeston page fix

yuyoujiang · Sep 20, 2024 · 7a9a2fe · 7a9a2fe
1 parent 1631bf9
commit 7a9a2fe
Show file tree

Hide file tree

Showing 4 changed files with 104 additions and 7 deletions.
diff --git a/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx b/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx
@@ -1,6 +1,7 @@
 ---
 description: NVIDIA® Jetson™ Powered Edge Devices
 title: NVIDIA® Jetson™ Powered Edge AI Devices Guide
+hide_table_of_contents: true
 keywords:
   - Edge
   - reComputer

diff --git a/src/components/jeston/config.js b/src/components/jeston/config.js
@@ -1,4 +1,98 @@
-export const hadwareList = [
+export const listData = [
+  {
+    id: 1,
+    name: 'reComputer',
+    img: '17.png',
+    brands: [
+      {
+        name: 'reComputer J10 SerieseComputer J10 Series',
+        img: '17.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '18.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '18.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '18.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '18.png',
+        href: 'https://www.seeedstudio.com/',
+      },
+    ],
+  },
+  {
+    id: 3,
+    name: 'Mini AI PC',
+    img: '17.png',
+    brands: [
+      {
+        name: 'reComputer J10 Series',
+        img: '18.png',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+      },
+    ],
+  },
+  {
+    id: 3,
+    name: 'Mini AI PC',
+    img: '17.png',
+    brands: [
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '18.png',
+      },
+    ],
+  },
+  {
+    id: 3,
+    name: 'Mini AI PC',
+    img: '17.png',
+    brands: [
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+      },
+      {
+        name: 'reComputer J10 Series',
+        img: '17.png',
+      },
+    ],
+  },
+]
+export const listData1 = [
   {
     id: 1,
     name: 'reComputer',

diff --git a/src/components/jeston/index.tsx b/src/components/jeston/index.tsx
@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import clsx from 'clsx'
 import styles from './index.module.scss'
-import { hadwareList, communityList } from './config'
+import { listData,listData1, communityList } from './config'
 import {
   useThemeConfig,
   useColorMode,
@@ -72,7 +72,7 @@ const usageRender = (obj) => {
       </div>
       <div className={clsx(styles.com_wrapper, styles.flex, styles.section_wrapper)}>
         <div className={styles.left_container}>
-          {hadwareList.map((item,index) => {
+          {obj.list.map((item,index) => {
             return (
               <div  className={clsx( styles.flex, styles.tab,activeIndex==index&&styles.active)} onClick={()=>{
                 setActiveIndex(index)
@@ -86,7 +86,7 @@ const usageRender = (obj) => {
         <div className={styles.right_container}>
         <div className={styles.right_wrapper}>
 
-        {hadwareList[activeIndex].brands.map((item) => {
+        {obj.list[activeIndex].brands.map((item) => {
             return (
               <div  className={clsx( styles.prod_item,styles.cursor)}  onClick={()=>toUrl(item.URL)}>
                 <img src={require(`../../../assets/recomputer/${item.img}`).default} alt="" />
@@ -113,14 +113,16 @@ const computerPageA = () => {
         title: 'Jetpack Flash and Hardware Usage',
         desc: `
         Most of our reComputer Jetson products come with NVIDIA JetPack system pre-installed on the device. However, if you want to flash these devices again or flash other devices which do not come with JetPack system, you can follow the below links for step-by-step guidance. We have also included guidance on how to use different hardware peripherals on these NVIDIA Jetson powered devices.
-        `
+        `,
+        list:listData
       })}
        {usageRender({
        class:styles.gray,
         title: 'Jetpack Flash and Hardware Usage',
         desc: `
         Most of our reComputer Jetson products come with NVIDIA JetPack system pre-installed on the device. However, if you want to flash these devices again or flash other devices which do not come with JetPack system, you can follow the below links for step-by-step guidance. We have also included guidance on how to use different hardware peripherals on these NVIDIA Jetson powered devices.
-        `
+        `,
+        list:listData1
       })}
       {communityRender()}
 

diff --git a/src/theme/DocItem/Layout/styles.module.css b/src/theme/DocItem/Layout/styles.module.css
@@ -5,6 +5,6 @@
 
 @media (min-width: 997px) {
   .docItemCol {
-    /* max-width: 75% !important; */
+    max-width: 75% !important;
   }
 }