diff --git a/docs/public/pascal.svg b/docs/public/pascal.svg new file mode 100644 index 00000000..c061ff54 --- /dev/null +++ b/docs/public/pascal.svg @@ -0,0 +1,35 @@ + + PASCAL Group Logo + + + + + + + diff --git a/docs/src/assets/homepage-features/completion-items.png b/docs/src/assets/homepage-features/completion-items.png new file mode 100644 index 00000000..95f2f6ea Binary files /dev/null and b/docs/src/assets/homepage-features/completion-items.png differ diff --git a/docs/src/assets/homepage-features/completion-module-decl.png b/docs/src/assets/homepage-features/completion-module-decl.png new file mode 100644 index 00000000..4ff8d5c9 Binary files /dev/null and b/docs/src/assets/homepage-features/completion-module-decl.png differ diff --git a/docs/src/assets/homepage-features/completion-module-snippets-expanded.png b/docs/src/assets/homepage-features/completion-module-snippets-expanded.png new file mode 100644 index 00000000..a8fbd879 Binary files /dev/null and b/docs/src/assets/homepage-features/completion-module-snippets-expanded.png differ diff --git a/docs/src/assets/homepage-features/completion-ports.png b/docs/src/assets/homepage-features/completion-ports.png new file mode 100644 index 00000000..bf6c3d25 Binary files /dev/null and b/docs/src/assets/homepage-features/completion-ports.png differ diff --git a/docs/src/assets/homepage-features/completion-snippets-module.png b/docs/src/assets/homepage-features/completion-snippets-module.png new file mode 100644 index 00000000..d066827a Binary files /dev/null and b/docs/src/assets/homepage-features/completion-snippets-module.png differ diff --git a/docs/src/assets/homepage-features/document-symbol.jpeg b/docs/src/assets/homepage-features/document-symbol.jpeg new file mode 100644 index 00000000..305e916e Binary files /dev/null and b/docs/src/assets/homepage-features/document-symbol.jpeg differ diff --git a/docs/src/assets/homepage-features/find-all-references.jpeg b/docs/src/assets/homepage-features/find-all-references.jpeg new file mode 100644 index 00000000..d00f7339 Binary files /dev/null and b/docs/src/assets/homepage-features/find-all-references.jpeg differ diff --git a/docs/src/assets/homepage-features/find-all-references.png b/docs/src/assets/homepage-features/find-all-references.png new file mode 100644 index 00000000..c2196723 Binary files /dev/null and b/docs/src/assets/homepage-features/find-all-references.png differ diff --git a/docs/src/assets/homepage-features/hover-on-instance-name.png b/docs/src/assets/homepage-features/hover-on-instance-name.png new file mode 100644 index 00000000..9e10d193 Binary files /dev/null and b/docs/src/assets/homepage-features/hover-on-instance-name.png differ diff --git a/docs/src/assets/homepage-features/hover-on-module-name.png b/docs/src/assets/homepage-features/hover-on-module-name.png new file mode 100644 index 00000000..b82339e8 Binary files /dev/null and b/docs/src/assets/homepage-features/hover-on-module-name.png differ diff --git a/docs/src/assets/homepage-features/hover-on-number-literal.png b/docs/src/assets/homepage-features/hover-on-number-literal.png new file mode 100644 index 00000000..bd8d03f8 Binary files /dev/null and b/docs/src/assets/homepage-features/hover-on-number-literal.png differ diff --git a/docs/src/assets/homepage-features/inlay-hints.png b/docs/src/assets/homepage-features/inlay-hints.png new file mode 100644 index 00000000..5774d8a8 Binary files /dev/null and b/docs/src/assets/homepage-features/inlay-hints.png differ diff --git a/docs/src/assets/homepage-features/missing-ports.png b/docs/src/assets/homepage-features/missing-ports.png new file mode 100644 index 00000000..dfdc87ee Binary files /dev/null and b/docs/src/assets/homepage-features/missing-ports.png differ diff --git a/docs/src/assets/homepage-features/peek-definition.png b/docs/src/assets/homepage-features/peek-definition.png new file mode 100644 index 00000000..aa72e57e Binary files /dev/null and b/docs/src/assets/homepage-features/peek-definition.png differ diff --git a/docs/src/assets/homepage-features/rename-updated.png b/docs/src/assets/homepage-features/rename-updated.png new file mode 100644 index 00000000..1ace4ba0 Binary files /dev/null and b/docs/src/assets/homepage-features/rename-updated.png differ diff --git a/docs/src/assets/landing.css b/docs/src/assets/landing.css index 17c57266..e794280b 100644 --- a/docs/src/assets/landing.css +++ b/docs/src/assets/landing.css @@ -1,4 +1,5 @@ :root { + --sl-font: Inter, var(--sl-font-system); --vide-accent-hsl: 200, 100%, 50%; --vide-accent: hsl(var(--vide-accent-hsl)); --vide-overlay: hsla(var(--vide-accent-hsl), 0.18); @@ -28,6 +29,21 @@ color: var(--sl-color-gray-2); } +.title-wrapper .site-title + ul { + min-width: max-content; + white-space: nowrap; +} + +.title-wrapper .site-title + ul a { + white-space: nowrap; +} + +@media (max-width: 57.999rem), (hover: none), (pointer: coarse) { + .title-wrapper .site-title + ul { + display: none; + } +} + [data-has-hero] .hero { padding-block-start: clamp(3rem, 8vw, 7rem); } @@ -80,6 +96,29 @@ var(--sl-color-black); } +.pascal-footer { + display: flex; + align-items: center; + justify-content: center; + gap: 0.25rem; + margin-top: 3rem; + color: #3f6fae; + font-size: 1rem; + font-weight: 600; + line-height: 1.4; +} + +.pascal-footer img { + width: auto; + height: 1em; +} + +.pascal-footer a, +.pascal-footer a:hover { + color: inherit; + text-decoration: none; +} + @media (min-width: 72rem) { :root { --vide-toc-width: 14rem; diff --git a/docs/src/components/HomepageComparisonTable.astro b/docs/src/components/HomepageComparisonTable.astro index 6cc13b0f..ce3d41a7 100644 --- a/docs/src/components/HomepageComparisonTable.astro +++ b/docs/src/components/HomepageComparisonTable.astro @@ -1,83 +1,135 @@ --- import type { + ComparisonColumn, ComparisonFeatureKey, ComparisonFeatureValue, ComparisonProduct, } from '../data/homepage'; type FeatureStatus = 'yes' | 'partial' | 'no'; - -interface FeatureColumn { - key: ComparisonFeatureKey; +type FeatureStatusMeta = { + className: string; label: string; -} + symbol: string; +}; +type FeatureCell = { + status: FeatureStatusMeta; + tooltip?: string; + isBeta: boolean; +}; interface Props { - columns: readonly FeatureColumn[]; + columns: readonly (ComparisonColumn & { key: ComparisonFeatureKey })[]; products: readonly ComparisonProduct[]; } const { columns, products } = Astro.props as Props; -const statusMap: Record = { +const statusMap: Record = { yes: { className: 'vide-comparison-table__true', label: 'Yes', symbol: '✓' }, partial: { className: 'vide-comparison-table__partial', label: 'Partial', symbol: '△' }, no: { className: 'vide-comparison-table__false', label: 'No', symbol: '✕' }, }; const getStatus = (value: ComparisonFeatureValue): FeatureStatus => { - if (value === 'partial') return 'partial'; + if (typeof value === 'string') return 'partial'; return value ? 'yes' : 'no'; }; + +const getPartialReason = (value: ComparisonFeatureValue) => { + if (typeof value !== 'string' || value === 'partial') return undefined; + return value; +}; + +const getFeatureCell = (product: ComparisonProduct, key: ComparisonFeatureKey): FeatureCell => { + const value = product.features[key]; + return { + status: statusMap[getStatus(value)], + tooltip: getPartialReason(value), + isBeta: product.betaFeatureKeys?.includes(key) ?? false, + }; +}; --- - - - - +
+
+ + + + { + products.map((product) => ( + + )) + } + + + { - products.map((product) => ( - + columns.map((column) => ( + + + {products.map((product) => { + const cell = getFeatureCell(product, column.key); + const tooltipId = cell.tooltip + ? `comparison-tooltip-${product.name.toLowerCase().replace(/[^a-z0-9]+/g, '-')}-${column.key}` + : undefined; + return ( + + ); + })} + )) } - - - - { - columns.map((column) => ( - - - {products.map((product) => { - const status = statusMap[getStatus(product.features[column.key])]; - const isBeta = product.betaFeatureKeys?.includes(column.key); - return ( - - ); - })} - - )) - } - -
+ + {product.name} + +
+ {product.meta} +
- - {product.name} - -
- {product.meta} -
+ {column.href ? ( + + {column.label} + + ) : ( + column.label + )} + + + {cell.status.symbol} + {cell.isBeta && BETA} + {cell.tooltip && ( + + {cell.tooltip} + + )} + +
{column.label} - - {status.symbol} - {isBeta && BETA} - -
+ + + diff --git a/docs/src/components/HomepageCta.astro b/docs/src/components/HomepageCta.astro index a1b12f5c..7175de6d 100644 --- a/docs/src/components/HomepageCta.astro +++ b/docs/src/components/HomepageCta.astro @@ -4,8 +4,6 @@ import { homepageCtaActions } from '../data/homepage'; ---
-

立刻体验

-

直接打开文档快速上手，或者先去 Playground 里实际试一遍补全、跳转和诊断体验。

{ homepageCtaActions.map((action) => ( @@ -19,18 +17,13 @@ import { homepageCtaActions } from '../data/homepage'; diff --git a/docs/src/components/HomepageHeroStyles.astro b/docs/src/components/HomepageHeroStyles.astro index acf2cac3..4b4ffee9 100644 --- a/docs/src/components/HomepageHeroStyles.astro +++ b/docs/src/components/HomepageHeroStyles.astro @@ -14,6 +14,12 @@ [data-has-hero] .hero h1 .hero-title-main { font-size: clamp(2.5rem, 5.8vw, 5rem); + text-wrap: balance; + word-break: keep-all; + } + + [data-has-hero] .hero h1 .hero-title-nowrap { + white-space: nowrap; } [data-has-hero] .hero h1 .hero-title-sub { diff --git a/docs/src/content/docs/index.mdx b/docs/src/content/docs/index.mdx index 080ac4e4..4829be68 100644 --- a/docs/src/content/docs/index.mdx +++ b/docs/src/content/docs/index.mdx @@ -1,14 +1,13 @@ --- -title: VIDE 文档 -description: Verilog/SystemVerilog 语言服务器、VS Code 扩展和 Playground 文档。 +title: Vide - 主页 +description: Vide - 现代 SystemVerilog 开发环境 template: splash editUrl: false lastUpdated: false hero: title: | Vide - 现代 SystemVerilog 开发环境 - 让硬件设计像编写软件一样丝滑顺手 + 现代 SystemVerilog 开发环境 actions: - text: 快速开始 link: ./user-guide/quick-start/ @@ -17,7 +16,7 @@ hero: link: ./playground/ icon: rocket variant: secondary - - text: GitHub 仓库 + - text: 关注 GitHub 仓库 link: https://github.com/pascal-lab/vide icon: external variant: minimal @@ -38,6 +37,14 @@ import HomepageHeroStyles from '../../components/HomepageHeroStyles.astro'; + + --- - +
+ PASCAL Research Group + PASCAL Research Group +
diff --git a/docs/src/data/homepage.ts b/docs/src/data/homepage.ts index da8f7d0c..a07f83e7 100644 --- a/docs/src/data/homepage.ts +++ b/docs/src/data/homepage.ts @@ -1,14 +1,19 @@ import type { ImageMetadata } from 'astro'; -import completionImage from '../assets/homepage-features/completion1.png'; -import gotoDefImage from '../assets/homepage-features/goto-def.png'; -import hoverInstanceImage from '../assets/homepage-features/hover-on-instance.png'; -import hoverLiteralImage from '../assets/homepage-features/hover-on-literal.png'; -import hoverModuleImage from '../assets/homepage-features/hover-on-module.png'; -import inlayImage from '../assets/homepage-features/inlay.png'; -import missingPortImage from '../assets/homepage-features/missing-port.png'; -import peekDefImage from '../assets/homepage-features/peek-def.png'; -import renameImage from '../assets/homepage-features/rename.png'; +import completionItemsImage from '../assets/homepage-features/completion-items.png'; +import completionModuleDeclImage from '../assets/homepage-features/completion-module-decl.png'; +import completionModuleSnippetExpandedImage from '../assets/homepage-features/completion-module-snippets-expanded.png'; +import completionPortsImage from '../assets/homepage-features/completion-ports.png'; +import completionSnippetModuleImage from '../assets/homepage-features/completion-snippets-module.png'; +import documentSymbolImage from '../assets/homepage-features/document-symbol.jpeg'; +import findAllReferencesImage from '../assets/homepage-features/find-all-references.jpeg'; +import hoverInstanceNameImage from '../assets/homepage-features/hover-on-instance-name.png'; +import hoverModuleNameImage from '../assets/homepage-features/hover-on-module-name.png'; +import hoverNumberLiteralImage from '../assets/homepage-features/hover-on-number-literal.png'; +import inlayHintsImage from '../assets/homepage-features/inlay-hints.png'; +import missingPortsImage from '../assets/homepage-features/missing-ports.png'; +import peekDefinitionImage from '../assets/homepage-features/peek-definition.png'; +import renameImage from '../assets/homepage-features/rename-updated.png'; export type HomepageFeatureLayout = 'image-left' | 'image-right'; @@ -25,20 +30,35 @@ export interface HomepageFeature { images: HomepageFeatureImage[]; } -export type ComparisonFeatureValue = boolean | 'partial'; +export type ComparisonFeatureValue = boolean | string; + +export interface ComparisonColumn { + key: string; + label: string; + href?: string; +} const accent = (text: string) => `${text}`; +const docsLink = (slug: string) => `./user-guide/daily-use/${slug}/`; + +const column = (key: string, label: string, slug: string): ComparisonColumn => ({ + key, + label, + href: docsLink(slug), +}); + export const homepageFeatures: HomepageFeature[] = [ { layout: 'image-left', eyebrow: 'Navigation', title: '符号导航', - description: `在 Vide 中使用${accent('定义跳转')}和${accent('引用搜索')}在模块、实例和端口之间快速定位，让开发者不用离开当前上下文也能追清 RTL 连接关系。

写 RTL，不再只能依靠 Ctrl + F。`, + description: `在 Vide 中使用${accent('定义跳转')}、${accent('引用搜索')}和${accent('符号大纲')}在模块、端口和寄存器之间快速定位，让开发者不用离开当前上下文也能追清 RTL 连接关系。

写 RTL，不再只能依靠 Ctrl + F。`, images: [ - { src: gotoDefImage, alt: 'Go to Definition 截图' }, - { src: peekDefImage, alt: 'Peek Definition 截图' }, + { src: peekDefinitionImage, alt: 'Peek Definition 截图' }, + { src: findAllReferencesImage, alt: 'Find All References 截图' }, + { src: documentSymbolImage, alt: 'Document Symbol 截图' }, ], }, { @@ -47,10 +67,10 @@ export const homepageFeatures: HomepageFeature[] = [ title: '代码理解', description: `利用 Vide 的${accent('悬停信息')}和${accent('代码注解')}在一个窗口中实时查看模块、字面量与端口连接信息，减少窗口切换的负担，让开发者更专注于 RTL 设计本身。`, images: [ - { src: hoverModuleImage, alt: '模块 Hover 信息截图' }, - { src: hoverInstanceImage, alt: '例化 Hover 信息截图' }, - { src: hoverLiteralImage, alt: '字面量 Hover 信息截图' }, - { src: inlayImage, alt: 'Inlay Hints 截图' }, + { src: hoverModuleNameImage, alt: '模块 Hover 信息截图' }, + { src: hoverInstanceNameImage, alt: '例化 Hover 信息截图' }, + { src: hoverNumberLiteralImage, alt: '字面量 Hover 信息截图' }, + { src: inlayHintsImage, alt: 'Inlay Hints 截图' }, ], }, { @@ -58,7 +78,13 @@ export const homepageFeatures: HomepageFeature[] = [ eyebrow: 'Completion', title: '精准补全', description: `Vide 的${accent('补全')}机制理解当前的代码上下文，能在实例化、端口连接和其他的编辑位置给出更贴近工程语义的建议，更能通过${accent('代码片段')}提供结构化补全。`, - images: [{ src: completionImage, alt: '模块和端口补全截图' }], + images: [ + { src: completionModuleDeclImage, alt: '模块声明补全截图' }, + { src: completionPortsImage, alt: '端口补全截图' }, + { src: completionItemsImage, alt: '补全候选列表截图' }, + { src: completionSnippetModuleImage, alt: '模块代码片段补全截图' }, + { src: completionModuleSnippetExpandedImage, alt: '展开后的模块代码片段补全截图' }, + ], }, { layout: 'image-right', @@ -66,28 +92,28 @@ export const homepageFeatures: HomepageFeature[] = [ title: '自动重构', description: `通过${accent('自动重构')}和${accent('重命名')}，把端口连线、信号重命名、转换进制这些繁琐的细节交给 Vide 完成，解放开发者的重构体验。`, images: [ - { src: missingPortImage, alt: '补全缺失端口 Code Action 截图' }, + { src: missingPortsImage, alt: '补全缺失端口 Code Action 截图' }, { src: renameImage, alt: '重命名符号截图' }, ], }, ]; export const comparisonColumns = [ - { key: 'definition', label: '定义跳转' }, - { key: 'references', label: '引用搜索' }, - { key: 'hover', label: '悬停信息' }, - { key: 'completion', label: '代码补全' }, - { key: 'rename', label: '重命名' }, - { key: 'syntaxHighlighting', label: '语法高亮' }, - { key: 'semanticHighlighting', label: '语义高亮' }, - { key: 'inlayHints', label: '代码注解' }, - { key: 'documentSymbols', label: '符号大纲' }, - { key: 'folding', label: '折叠' }, - { key: 'codeActions', label: '自动重构' }, - { key: 'diagnostics', label: '实时诊断' }, - { key: 'signatureHelp', label: '签名提示' }, - { key: 'selectionRange', label: '语义选区' }, -] as const; + column('definition', '定义跳转', 'navigation'), + column('references', '引用搜索', 'navigation'), + column('hover', '悬停信息', 'navigation'), + column('completion', '代码补全', 'editing-assistance'), + column('rename', '重命名', 'editing-assistance'), + column('syntaxHighlighting', '语法高亮', 'language-support'), + column('semanticHighlighting', '语义高亮', 'structure'), + column('inlayHints', '代码注解', 'structure'), + column('documentSymbols', '符号大纲', 'structure'), + column('folding', '折叠', 'structure'), + column('codeActions', '自动重构', 'editing-assistance'), + column('diagnostics', '实时诊断', 'diagnostics'), + column('signatureHelp', '签名提示', 'editing-assistance'), + column('selectionRange', '语义选区', 'structure'), +] as const satisfies readonly ComparisonColumn[]; export type ComparisonFeatureKey = (typeof comparisonColumns)[number]['key']; @@ -105,14 +131,14 @@ export const comparisonProducts: ComparisonProduct[] = [ meta: 'Intel', features: { syntaxHighlighting: true, - definition: false, + definition: '支持从实例跳到模块定义', references: false, hover: false, completion: false, rename: false, semanticHighlighting: false, signatureHelp: false, - documentSymbols: 'partial', + documentSymbols: '支持模块', folding: true, selectionRange: false, codeActions: false, @@ -125,28 +151,28 @@ export const comparisonProducts: ComparisonProduct[] = [ meta: 'Xilinx', features: { syntaxHighlighting: true, - definition: false, - references: false, - hover: false, + definition: true, + references: true, + hover: '支持显示变量的类型信息', completion: false, rename: false, semanticHighlighting: false, signatureHelp: false, documentSymbols: false, - folding: false, + folding: true, selectionRange: false, codeActions: false, inlayHints: false, - diagnostics: false, + diagnostics: true, }, }, { name: 'Verible', meta: 'Most-Starred OSS', features: { - syntaxHighlighting: true, - definition: 'partial', - references: 'partial', + syntaxHighlighting: false, + definition: true, + references: true, hover: false, completion: false, rename: false, @@ -155,9 +181,9 @@ export const comparisonProducts: ComparisonProduct[] = [ documentSymbols: true, folding: false, selectionRange: false, - codeActions: 'partial', + codeActions: '支持 linter 的 quickfix 和 autoexpand', inlayHints: false, - diagnostics: true, + diagnostics: '支持语法错误和 linter 规则', }, }, {