From 6de598c82279b2ca027356eaaaac77c5759fbe27 Mon Sep 17 00:00:00 2001 From: youjiang <254693273@qq.com> Date: Fri, 20 Sep 2024 11:13:37 +0800 Subject: [PATCH 1/3] fix: resources --- .../J401/reComputer_J4012_Flash_Jetpack.md | 46 ++++++++++++++++++- 1 file changed, 44 insertions(+), 2 deletions(-) diff --git a/docs/Edge/NVIDIA_Jetson/Carrier_Boards/J401/reComputer_J4012_Flash_Jetpack.md b/docs/Edge/NVIDIA_Jetson/Carrier_Boards/J401/reComputer_J4012_Flash_Jetpack.md index bce7565cb79d..60dc33c9db95 100644 --- a/docs/Edge/NVIDIA_Jetson/Carrier_Boards/J401/reComputer_J4012_Flash_Jetpack.md +++ b/docs/Edge/NVIDIA_Jetson/Carrier_Boards/J401/reComputer_J4012_Flash_Jetpack.md @@ -193,10 +193,42 @@ reComputer J40/ J30 series comes with JetPack 5.1 pre-installed on the included ### Prerequisites -- Ubuntu -- reComputer J4012/ J4011/ J3010 and J3011 +- Ubuntu Host Computer +- reComputer J4012/ J4011/ J3010 or J3011 - USB Type-C data transmission cable +:::info +We recommend that you use physical ubuntu host devices instead of virtual machines. +Please refer to the table below to prepare the host machine. + + + + + + + + + + + + + + + + + + + + + + + + + +
JetPack Version Ubuntu Version (Host Computer)
18.04 20.04 22.04
JetPack 5.x
JetPack 6.x
+ +::: + ### Enter Force Recovery Mode :::note @@ -520,6 +552,16 @@ sudo apt install -y iwlwifi-modules + +## Resources +- [Product details page](https://www.seeedstudio.com/reComputer-J4012-w-o-power-adapter-p-5628.html) +- [reComputer J30/J40 3D File](https://files.seeedstudio.com/wiki/reComputer-J4012/reComputer-J4012.stp) +- [reComputer J401X Datasheet](http://files.seeedstudio.com/wiki/reComputer-Jetson/reComputer-Jetson-J401-w_o-power-adapter-datasheet.pdf) +- [NVIDIA Jetson Devices and Carrier Boards Comparisions](https://www.seeedstudio.com/blog/nvidia-jetson-comparison-nano-tx2-nx-xavier-nx-agx-orin/) +- [Seeed NVIDIA Jetson Product Catalog](https://files.seeedstudio.com/wiki/Seeed_Jetson/Seeed-NVIDIA_Jetson_Catalog_V1.4.pdf) +- [Jetson examples](https://github.com/Seeed-Projects/jetson-examples) +- [reComputer-Jetson-for-Beginners](https://github.com/Seeed-Projects/reComputer-Jetson-for-Beginners) + ## Tech Support & Product Discussion Thank you for choosing our products! We are here to provide you with different support to ensure that your experience with our products is as smooth as possible. We offer several communication channels to cater to different preferences and needs. From 1631bf91ac25bc33b68b2b4d4b81fe45451c20c5 Mon Sep 17 00:00:00 2001 From: lisha Date: Fri, 20 Sep 2024 11:23:10 +0800 Subject: [PATCH 2/3] feat: jeston page --- docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx | 14 +- src/components/jeston/config.js | 137 +++++++++ src/components/jeston/index.module.scss | 323 +++++++++++++++++++++ src/components/jeston/index.tsx | 131 +++++++++ src/theme/DocItem/Layout/styles.module.css | 2 +- 5 files changed, 593 insertions(+), 14 deletions(-) create mode 100644 src/components/jeston/config.js create mode 100644 src/components/jeston/index.module.scss create mode 100644 src/components/jeston/index.tsx diff --git a/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx b/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx index 54cb3feb24ac..3dc584c9c927 100644 --- a/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx +++ b/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx @@ -12,20 +12,8 @@ last_update: author: Lakshantha --- -import RecomputerPage from '@site/src/components/recomputer'; +import RecomputerPage from '@site/src/components/jeston'; -
-NVIDIA® Jetson™ brings accelerated AI performance to the Edge in a power-efficient and compact form factor. The Jetson family of modules all use the same NVIDIA CUDA-X™ software, and support cloud-native to build, deploy, and manage AI at the edge across all industries. -Seeed is the authorized reseller of NVIDIA Jetson Developer Kits and Elite Partner of the NVIDIA Jetson ecosystem. Based on our with our over 15 years of hardware expertise, we offer a one-stop experience to simplify edge AI development including standard carrier boards -and devices family, ODM services of both hardware & image flashing. Together with leading AI ecosystem partners, Seeed speeds time to market for customers by handling integration, manufacturing, fulfillment, and distribution. - -
- -
diff --git a/src/components/jeston/config.js b/src/components/jeston/config.js new file mode 100644 index 000000000000..a3f62667758f --- /dev/null +++ b/src/components/jeston/config.js @@ -0,0 +1,137 @@ +export const hadwareList = [ + { + 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 communityList = [ + { + name: 'Qualia S3 Fireplace', + img: 'com1', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'Simplifying Qualia CircuitPython Projects', + img: 'com2', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'Adafruit Qualia ESP32-S3 for RGB-666 Displays', + img: 'com3', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'Edge-Lit Tavern Sign with WLED - Control with WiFi...', + img: 'com4', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'ESP32-S2 Reverse TFT Digital Clock Display featuring...', + img: 'com5', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'No-Code IKEA Vindriktning Air Quality Sensor Hack...', + img: 'com6', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'LEGO Set Lighting', + img: 'com7', + href: 'https://www.seeedstudio.com/', + }, + { + name: 'Qualia S3 Space Clock', + img: 'com8', + href: 'https://www.seeedstudio.com/', + }, +] diff --git a/src/components/jeston/index.module.scss b/src/components/jeston/index.module.scss new file mode 100644 index 000000000000..3490c39fb994 --- /dev/null +++ b/src/components/jeston/index.module.scss @@ -0,0 +1,323 @@ +.jeston_page { + .flex { + display: flex; + } + + .cursor { + cursor: pointer; + + + } + + ::-webkit-scrollbar { + width: 5px; + /*滚动条宽度*/ + height: 5px; + /*滚动条高度*/ + } + + /*定义滚动条轨道 内阴影+圆角*/ + ::-webkit-scrollbar-track { + -webkit-box-shadow: inset 0 0 6px #eee; + border-radius: 10px; + /*滚动条的背景区域的圆角*/ + background-color: rgba(255, 255, 255, 0.8); + /*滚动条的背景颜色*/ + } + + /*定义滑块 内阴影+圆角*/ + ::-webkit-scrollbar-thumb { + border-radius: 10px; + /*滚动条的圆角*/ + -webkit-box-shadow: inset 0 0 6px #333; + background-color: #555; + /*滚动条的背景颜色*/ + } + + .banner { + display: flex; + justify-content: space-between; + background-image: url('https://files.seeedstudio.com/wiki/Jetson/banner_bg.png?v=2'); + background-size: cover; + background-color: #EEF4DF; + padding: 70px 60px; + + .banner_left { + flex: 1; + } + + .banner_right { + flex: 1; + } + + .title { + font-family: Montserrat; + font-size: 38px; + font-weight: 600; + line-height: 1.3; + margin-bottom: 20px; + } + + .bottom { + margin-top: 26px; + font-weight: 500; + align-items: center; + + + span { + line-height: 1.2; + flex: 1; + } + } + + .right { + width: 38px; + height: 38px; + background: #89B929; + border-radius: 50%; + margin-right: 12px; + justify-content: center; + + img { + width: 24px; + } + + } + } + + .section { + padding: 40px 30px; + + .title { + font-size: 32px; + font-weight: 600; + text-align: center; + } + + .desc { + font-size: 14px; + text-align: center; + margin-top: 20px; + } + + .section_wrapper { + margin-top: 50px; + } + } + + .community { + // background-color: #fff; + + .com_wrapper { + flex-wrap: wrap; + + .com_item { + width: calc(25% - 18px); + padding: 20px 8px; + border-radius: 20px; + background: #F3F5F8; + margin-right: 24px; + margin-bottom: 24px; + + &:nth-child(4n) { + margin-right: 0; + } + + img { + border-radius: 10px; + } + + .com_title { + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + /* 限制显示的行数 */ + overflow: hidden; + text-overflow: ellipsis; + + &:hover { + text-decoration: underline; + } + } + } + } + } + + .usage { + .left_container { + width: 280px; + margin-right: 24px; + + .tab { + height: 76px; + align-items: center; + cursor: pointer; + + padding: 0 20px; + + &.active { + background: #8FC31F; + border-radius: 8px; + color: #fff; + } + + img { + width: 40px; + + height: auto; + margin-right: 14px; + } + } + + .name { + + flex: 1; + } + } + + .right_container { + flex: 1; + border-radius: 8px; + background: #F3F5F8; + padding: 24px; + padding-right: 0; + height: 100%; + + .right_wrapper { + display: flex; + flex-wrap: wrap; + overflow-y: auto; + height: 100%; + max-height: 494px; + + .prod_item { + background-color: #fff; + text-align: center; + border-radius: 8px; + margin-right: 24px; + padding: 24px; + margin-bottom: 20px; + width: calc(33% - 24px); + + img { + height: 99px; + } + + .name { + &:hover { + text-decoration: underline; + } + } + } + } + + + } + + &.gray { + + background: #F3F5F8; + + .right_container { + background-color: #fff; + + .right_wrapper { + .prod_item { + display: flex; + text-align: left; + + img { + width: 38px; + height: 38px; + margin-right: 8px; + } + + } + } + } + } + + } + + &.dark { + .banner { + background-color: #1B1B1D; + // background-color: linear-gradient(270deg, #000000 2%, rgba(0, 0, 0, 0) 100%); + } + + .usage { + .right_container { + background: #242526; + + .prod_item { + background: rgba(255, 255, 255, 0.05); + } + } + + &.gray { + background: #1B1B1D; + + .right_container { + background: #242526; + + .prod_item { + background: rgba(255, 255, 255, 0.05); + } + } + } + } + + .community { + .com_wrapper { + flex-wrap: wrap; + + .com_item { + background: #242526; + } + } + } + } + + @media (max-width: 768px) { + .banner { + flex-direction: column; + padding: 20px 10px; + } + + .section { + padding: 20px 10px; + + + } + + .usage { + .left_container { + width: 100%; + } + + .com_wrapper { + flex-direction: column; + + .right_container { + .prod_item { + width: 100%; + } + } + } + } + + .community { + .com_wrapper { + + .com_item { + width: calc(50% - 12px); + + &:nth-child(2n) { + margin-right: 0; + } + + } + } + } + } +} \ No newline at end of file diff --git a/src/components/jeston/index.tsx b/src/components/jeston/index.tsx new file mode 100644 index 000000000000..359130ef7d23 --- /dev/null +++ b/src/components/jeston/index.tsx @@ -0,0 +1,131 @@ +import React, { useState } from 'react'; +import clsx from 'clsx' +import styles from './index.module.scss' +import { hadwareList, communityList } from './config' +import { + useThemeConfig, + useColorMode, + ThemeConfig +} from '@docusaurus/theme-common'; +function getImgUrl(str: string, suffix?: string) { + return `https://files.seeedstudio.com/wiki/Jetson/${str}.${suffix || 'png'}` +} + +const toUrl=(url:string)=>{ +if(!url) return + window.open(url,'_blank') +} +const bannerRender = () => { + return ( +
+
+
+ NVIDIA® Jetson™ Powered Edge AI Devices Guide +
+
NVIDIA® Jetson™ delivers high-performance AI at the edge with energy-efficient modules using NVIDIA CUDA-X™ software. As an authorized reseller and Elite Partner, Seeed provides a comprehensive edge AI development solution, leveraging 15+ years of hardware expertise. Our offerings include standard carrier boards, ODM services, and image flashing, ensuring a seamless integration process. Partnering with top AI ecosystem players, we expedite your market launch with our end-to-end service from integration to distribution.
+
+
+ +
+ + learn more about the comparison between the NVIDIA Jetson powered devices + +
+
+
+ +
+
+ ) +} +const communityRender = () => { + return ( +
+
+ NVIDIA® Jetson™ Powered Edge AI Devices Guide +
+
+ { + communityList.map((item) => { + return ( +
toUrl(item.URL)}> + +
{item.name}
+
+ ) + })} +
+ +
+ ) +} +const usageRender = (obj) => { + const [activeIndex,setActiveIndex]=useState(0) + + return ( +
+
+ {obj.title} +
+
+ {obj.desc} +
+
+
+ {hadwareList.map((item,index) => { + return ( +
{ + setActiveIndex(index) + }}> + +
{item.name}
+
+ ) + })} +
+
+
+ + {hadwareList[activeIndex].brands.map((item) => { + return ( +
toUrl(item.URL)}> + +
{item.name}
+
+ ) + })} +
+
+
+
+ ) +} +const computerPageA = () => { + + + + const { colorMode } =useColorMode() + + return ( +
+ {bannerRender()} + {usageRender({ + 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. + ` + })} + {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. + ` + })} + {communityRender()} + +
+ ); +}; + +export default computerPageA; \ No newline at end of file diff --git a/src/theme/DocItem/Layout/styles.module.css b/src/theme/DocItem/Layout/styles.module.css index d5aaec1322c9..cd1088a4ddb0 100644 --- 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; */ } } From 7a9a2fe31fbc69bd4d520325a4086030c0488854 Mon Sep 17 00:00:00 2001 From: lisha Date: Fri, 20 Sep 2024 11:41:25 +0800 Subject: [PATCH 3/3] feat: jeston page fix --- docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx | 1 + src/components/jeston/config.js | 96 +++++++++++++++++++++- src/components/jeston/index.tsx | 12 +-- src/theme/DocItem/Layout/styles.module.css | 2 +- 4 files changed, 104 insertions(+), 7 deletions(-) diff --git a/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx b/docs/Edge/NVIDIA_Jetson/RecomputerPage.mdx index 3dc584c9c927..52d88deabe38 100644 --- 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 index a3f62667758f..3e720c06b35f 100644 --- 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 index 359130ef7d23..f77858cd37d6 100644 --- 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) => {
- {hadwareList.map((item,index) => { + {obj.list.map((item,index) => { return (
{ setActiveIndex(index) @@ -86,7 +86,7 @@ const usageRender = (obj) => {
- {hadwareList[activeIndex].brands.map((item) => { + {obj.list[activeIndex].brands.map((item) => { return (
toUrl(item.URL)}> @@ -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 index cd1088a4ddb0..d5aaec1322c9 100644 --- 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; } }