添加商业版页面 (#4)

* update:添加商业版内容

* update:添加插画并删除多余子版块

* update:加入商业版多发行版信息

* update:增加多cpu厂家标签

* update:商业版主页描述更新

* update:商业版标签前移到下载后面

* update:更新商业版内容“联系客服”按钮点击后的触发逻辑。展示联系方式并调用系统邮箱

* update:“关于页面”添加加入我们按钮

* update:使用@nuxt/icon引入SVG图标

* fix:修复竖屏设备导航栏由于增加”商业版“标签导致“GXDE OS"标签出界问题

* update:删除残留vue文件

* update:加入成果案例到商业版板块

* fix:修复790.29px*780px时,导航栏标签文字换行的问题

* fix:竖屏画面导航栏高度改为h-93.5

* update:更新商业版svg配图

* Standardize nav-link class styling

Removed padding from nav-link classes for consistency.

* fix(nav): 延后导航单行排布断点至 lg

修复视口在 780px~840px 区间时,因导航项增加导致的元素溢出和交叠问题。目前在设备大于 1024px 时才会并排显示导航栏项。

* style(commercial): 彻底重塑商业版前端插画与界面,并适配深色模式

1. 重绘场景插画:重新设计了“案例”、“客服”、“定制化”、“架构”、“分发”等 5 张大型场景 SVG 插图,升级为悬浮玻璃态面板、阵列多核管控板等高阶空间 UI 组合拼贴风,大幅提升商业严肃感与前瞻视觉。
2. 新增专属标题徽章:新设计 5 张针对各主体的立体厚重感微型徽章图(`*-title.svg`),替换原有的字体图标,增强每个模块的大型企服属性。
3. 清除硬编码与深色适配:地毯式拔除了插图内部强制锁色的 `<style>:root` 标签,并移除了用于高光的 `"#ffffff"` 死白硬层,无缝融入系统的深浅色动态 `var(--s-bg)` 等变量,适配完美的 Dark Mode 下暗色面板沉浸效果。
4. 界面版式对齐:重塑首屏第一区块(Section 1)的模拟 UI 板面为科技面板,收束卡片间距;重组了留板表单弹窗以及导航元素,令其样式表现与总应用的主界线全面拉齐。

---------

Co-authored-by: jiwangyihao <jwyh@jwyihao.top>
This commit is contained in:
momen
2026-03-04 13:42:02 +08:00
committed by GitHub
parent 059e01090c
commit be8c0d518f
13 changed files with 1047 additions and 14 deletions
+76
View File
@@ -0,0 +1,76 @@
<svg viewBox="0 0 800 800" xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="hubglow" cx="50%" cy="50%" r="50%">
<stop offset="0%" stop-color="var(--s-bg-2)" stop-opacity="0.4"/>
<stop offset="100%" stop-color="var(--s-bg)" stop-opacity="0"/>
</radialGradient>
<linearGradient id="layer" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="var(--s-bg)" stop-opacity="0.9" />
<stop offset="100%" stop-color="var(--s-bg-2)" stop-opacity="0.5" />
</linearGradient>
<filter id="shadow-arch" x="-50%" y="-50%" width="200%" height="200%">
<feDropShadow dx="-10" dy="25" stdDeviation="25" flood-opacity="0.15" />
</filter>
</defs>
<!-- Central Hub Layers -->
<g transform="translate(100, 420)">
<!-- Base Platform -->
<path d="M 300 100 L 500 200 L 300 300 L 100 200 Z" fill="var(--s-bg-2)" opacity="0.4" />
<path d="M 300 0 L 550 120 L 300 250 L 50 120 Z" fill="var(--s-bg-3)" opacity="0.3" transform="translate(0, -60)" />
<!-- Central Core Layer -->
<!-- Center block -->
<g transform="translate(300, 50)" filter="url(#shadow-arch)">
<path d="M 0 0 L 100 -50 L 0 -100 L -100 -50 Z" fill="var(--s-deco)" />
<path d="M 0 0 L 100 -50 L 100 50 L 0 100 Z" fill="var(--s-deco)" opacity="0.7"/>
<path d="M 0 0 L -100 -50 L -100 50 L 0 100 Z" fill="var(--s-deco)" opacity="0.5"/>
</g>
<g transform="translate(300, -80)" filter="url(#shadow-arch)">
<path d="M 0 0 L 60 -30 L 0 -60 L -60 -30 Z" fill="var(--s-bg)" />
<path d="M 0 0 L 60 -30 L 60 40 L 0 70 Z" fill="var(--s-bg)" opacity="0.7"/>
<path d="M 0 0 L -60 -30 L -60 40 L 0 70 Z" fill="var(--s-bg)" opacity="0.5"/>
</g>
<!-- Floating Architectural Nodes -->
<!-- Left Node -->
<g transform="translate(100, -20)" filter="url(#shadow-arch)">
<path d="M 0 0 L 50 -25 L 0 -50 L -50 -25 Z" fill="var(--s-bg-3)" />
<path d="M 0 0 L 50 -25 L 50 30 L 0 55 Z" fill="var(--s-bg-3)" opacity="0.7"/>
<path d="M 0 0 L -50 -25 L -50 30 L 0 55 Z" fill="var(--s-bg-3)" opacity="0.5"/>
<path d="M 0 -13 L 24 -25 L 0 -38 L -24 -25 Z" fill="var(--s-bg)" />
</g>
<!-- Top Node -->
<g transform="translate(300, -220)" filter="url(#shadow-arch)">
<path d="M 0 0 L 50 -25 L 0 -50 L -50 -25 Z" fill="var(--s-bg-2)" />
<path d="M 0 0 L 50 -25 L 50 30 L 0 55 Z" fill="var(--s-bg-2)" opacity="0.7"/>
<path d="M 0 0 L -50 -25 L -50 30 L 0 55 Z" fill="var(--s-bg-2)" opacity="0.5"/>
<path d="M 0 -13 L 24 -25 L 0 -38 L -24 -25 Z" fill="var(--s-deco)" />
</g>
<!-- Right Node -->
<g transform="translate(500, -20)" filter="url(#shadow-arch)">
<path d="M 0 0 L 50 -25 L 0 -50 L -50 -25 Z" fill="var(--s-bg-3)" />
<path d="M 0 0 L 50 -25 L 50 30 L 0 55 Z" fill="var(--s-bg-3)" opacity="0.7"/>
<path d="M 0 0 L -50 -25 L -50 30 L 0 55 Z" fill="var(--s-bg-3)" opacity="0.5"/>
<path d="M 0 -13 L 24 -25 L 0 -38 L -24 -25 Z" fill="var(--s-bg)" />
</g>
<!-- Right Node 2-->
<g transform="translate(420, 140)" filter="url(#shadow-arch)">
<path d="M 0 0 L 50 -25 L 0 -50 L -50 -25 Z" fill="var(--s-bg-2)" />
<path d="M 0 0 L 50 -25 L 50 30 L 0 55 Z" fill="var(--s-bg-2)" opacity="0.7"/>
<path d="M 0 0 L -50 -25 L -50 30 L 0 55 Z" fill="var(--s-bg-2)" opacity="0.5"/>
<path d="M 0 -13 L 24 -25 L 0 -38 L -24 -25 Z" fill="var(--s-bg)" />
</g>
<!-- Connecting Datastreams -->
<path d="M 300 -80 L 300 -220" stroke="var(--s-deco)" stroke-width="4" stroke-dasharray="8,8" opacity="0.8" />
<path d="M 100 -20 L 300 80" stroke="var(--s-bg-3)" stroke-width="4" stroke-dasharray="8,8" />
<path d="M 500 -20 L 300 80" stroke="var(--s-bg-3)" stroke-width="4" stroke-dasharray="8,8" />
<path d="M 420 90 L 300 30" stroke="var(--s-bg-2)" stroke-width="4" stroke-dasharray="8,8" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.9 KiB