feat(ui): Restructure the homepage layout and optimize the logo design
- Restructure the page layout using Vuetify components - Add temporary SVG icons to replace the default graphics
This commit is contained in:
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 4.3 KiB |
@@ -1,6 +1,54 @@
|
||||
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M261.126 140.65L164.624 307.732L256.001 466L377.028 256.5L498.001 47H315.192L261.126 140.65Z" fill="#1697F6"/>
|
||||
<path d="M135.027 256.5L141.365 267.518L231.64 111.178L268.731 47H256H14L135.027 256.5Z" fill="#AEDDFF"/>
|
||||
<path d="M315.191 47C360.935 197.446 256 466 256 466L164.624 307.732L315.191 47Z" fill="#1867C0"/>
|
||||
<path d="M268.731 47C76.0026 47 141.366 267.518 141.366 267.518L268.731 47Z" fill="#7BC6FF"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300" aria-label="巨浪图">
|
||||
<defs>
|
||||
<!-- 天空渐变 -->
|
||||
<linearGradient id="sky" x1="0" x2="0" y1="0" y2="1">
|
||||
<stop offset="0" stop-color="#cfe9ff"/>
|
||||
<stop offset="1" stop-color="#a7d7ff"/>
|
||||
</linearGradient>
|
||||
|
||||
<!-- 主浪渐变 -->
|
||||
<linearGradient id="waveGrad" x1="0" x2="0" y1="0" y2="1">
|
||||
<stop offset="0" stop-color="#55b0ff"/>
|
||||
<stop offset="0.6" stop-color="#1e90ff"/>
|
||||
<stop offset="1" stop-color="#0b4f8a"/>
|
||||
</linearGradient>
|
||||
|
||||
<!-- 浪花高光 -->
|
||||
<linearGradient id="foamGrad" x1="0" x2="1" y1="0" y2="0">
|
||||
<stop offset="0" stop-color="#ffffff" stop-opacity="0.95"/>
|
||||
<stop offset="1" stop-color="#f6fbff" stop-opacity="0.65"/>
|
||||
</linearGradient>
|
||||
|
||||
<!-- 轻微的噪点纹理(用作浪花) -->
|
||||
<filter id="softBlur">
|
||||
<feGaussianBlur stdDeviation="1.2" result="b"/>
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- 背景(天空) -->
|
||||
<rect width="100%" height="100%" fill="url(#sky)"/>
|
||||
|
||||
<!-- 远处小浪(增加深度) -->
|
||||
<path d="M0 200 C50 170 110 160 170 170 C210 175 250 185 300 170 L300 300 L0 300 Z"
|
||||
fill="#86c7ff" opacity="0.55"/>
|
||||
|
||||
<!-- 主浪体 -->
|
||||
<path d="
|
||||
M0 230
|
||||
C40 150, 90 90, 160 100
|
||||
C200 105, 240 140, 300 120
|
||||
L300 300 L0 300 Z"
|
||||
fill="url(#waveGrad)"/>
|
||||
|
||||
|
||||
<!-- 前景更亮的浪层(反光) -->
|
||||
<path d="
|
||||
M0 250
|
||||
C50 200, 95 160, 150 170
|
||||
C180 175, 220 200, 300 180
|
||||
L300 300 L0 300 Z"
|
||||
fill="#5fc7ff" opacity="0.35"/>
|
||||
|
||||
<!-- 底部微暗(增加重量感) -->
|
||||
<rect x="0" y="270" width="300" height="30" fill="#02314a" opacity="0.06"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 526 B After Width: | Height: | Size: 1.7 KiB |
Reference in New Issue
Block a user