mirror of
https://github.com/spark-store-project/spark-store-abyss
synced 2026-06-23 02:44:16 +08:00
momen
be8c0d518f
* 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>
68 lines
3.2 KiB
XML
68 lines
3.2 KiB
XML
<svg viewBox="-500 -500 1000 1000" xmlns="http://www.w3.org/2000/svg">
|
|
|
|
<defs>
|
|
<filter id="shadow" x="-50%" y="-50%" width="200%" height="200%">
|
|
<feDropShadow dx="0" dy="20" stdDeviation="25" flood-color="var(--s-bg-3)" flood-opacity="0.25" />
|
|
</filter>
|
|
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="var(--s-bg-2)" stop-opacity="0.8"/>
|
|
<stop offset="100%" stop-color="var(--s-bg-3)" stop-opacity="0.9"/>
|
|
</linearGradient>
|
|
</defs>
|
|
|
|
<!-- Orbital patterns -->
|
|
<g opacity="0.6" stroke="var(--s-bg)" stroke-width="4" fill="none">
|
|
<ellipse cx="0" cy="0" rx="350" ry="150" transform="rotate(-25)" stroke-dasharray="25 10 5 10" />
|
|
<ellipse cx="0" cy="0" rx="400" ry="180" transform="rotate(25)" stroke-dasharray="10 20" stroke-width="8"/>
|
|
</g>
|
|
|
|
<!-- Central Hub (Spark Store) -->
|
|
<g filter="url(#shadow)">
|
|
<!-- Base aura -->
|
|
<circle cx="0" cy="0" r="110" fill="url(#grad1)"/>
|
|
<!-- Overlapping geometry -->
|
|
<circle cx="0" cy="0" r="70" fill="var(--s-deco)" opacity="0.4"/>
|
|
<rect x="-35" y="-35" width="70" height="70" rx="15" fill="var(--s-bg)" transform="rotate(45)"/>
|
|
<circle cx="0" cy="0" r="15" fill="var(--s-bg-3)" />
|
|
</g>
|
|
|
|
<!-- Outer orbiting nodes -->
|
|
<!-- Node 1: UOS / Deepin (Diamond-like) -->
|
|
<g transform="translate(180, -260) rotate(-25)" filter="url(#shadow)">
|
|
<rect x="-45" y="-45" width="90" height="90" rx="20" transform="rotate(45)" fill="var(--s-bg-2)"/>
|
|
<rect x="-25" y="-25" width="50" height="50" rx="10" transform="rotate(45)" fill="var(--s-deco)" opacity="0.5"/>
|
|
</g>
|
|
<path d="M 60 -80 L 140 -200" stroke="var(--s-deco)" stroke-width="5" stroke-dasharray="8,8" opacity="0.7"/>
|
|
|
|
<!-- Node 2: Kylin (Hexagon) -->
|
|
<g transform="translate(-280, 100) rotate(15)" filter="url(#shadow)">
|
|
<path d="M 0 -60 L 52 -30 L 52 30 L 0 60 L -52 30 L -52 -30 Z" fill="var(--s-bg-3)"/>
|
|
<circle cx="0" cy="0" r="25" fill="var(--s-bg)"/>
|
|
</g>
|
|
<path d="M -90 30 L -210 75" stroke="var(--s-bg-3)" stroke-width="5" stroke-dasharray="8,8" opacity="0.7"/>
|
|
|
|
<!-- Node 3: Fangde (Tech Container) -->
|
|
<g transform="translate(300, 180) rotate(-10)" filter="url(#shadow)">
|
|
<rect x="-60" y="-50" width="120" height="100" rx="25" fill="var(--s-bg)"/>
|
|
<rect x="-35" y="-25" width="70" height="50" rx="15" fill="var(--s-bg-2)"/>
|
|
<circle cx="-45" cy="-35" r="5" fill="var(--s-deco)"/>
|
|
<circle cx="45" cy="35" r="5" fill="var(--s-deco)"/>
|
|
</g>
|
|
<path d="M 80 50 L 230 140" stroke="var(--s-bg)" stroke-width="5" stroke-dasharray="8,8" opacity="0.7"/>
|
|
|
|
<!-- Node 4: Small satellite -->
|
|
<g transform="translate(-150, -180)" filter="url(#shadow)">
|
|
<circle cx="0" cy="0" r="30" fill="var(--s-deco)" opacity="0.8"/>
|
|
</g>
|
|
<path d="M -60 -60 L -120 -150" stroke="var(--s-deco)" stroke-width="3" stroke-dasharray="5,5" opacity="0.5"/>
|
|
|
|
|
|
<!-- Floating particles -->
|
|
<g filter="url(#shadow)">
|
|
<circle cx="360" cy="-60" r="20" fill="var(--s-bg)" opacity="0.6"/>
|
|
<circle cx="-60" cy="280" r="15" fill="var(--s-bg-3)" opacity="0.8"/>
|
|
<rect x="200" y="-50" width="15" height="15" rx="4" fill="var(--s-deco)" opacity="0.5"/>
|
|
<rect x="-100" y="150" width="20" height="20" rx="5" fill="var(--s-bg-2)" transform="rotate(30)"/>
|
|
</g>
|
|
</svg>
|