图标改版:地图背景 + 左下家 / 右上目的地 + 弯曲路线(批 25)
按用户明确的构图重画:底是一块地图(路网 + 带状绿地 + 河流湖泊 + 街区小块, 暖白纸感底色),左下角一个「家」(白圆底 + 蓝房子),右上角一个「目的地」 (蓝圆底 + 白图钉),一条弯曲的路线从左下绕到右上把两点连起来。 上一版「翻开的日记本」构图作废(用户要的是地图 + 家到目的地的连线)。 maskable 版同步重画(地图底色铺满、内容缩到中间 74% 安全区), 全部尺寸重新导出,favicon.ico 重新打包。 验证:本地全链 EXIT=0;e2e 374 项全过(第 11b 节按 URL 拉图标验 MIME); 部署 334 OK/0 FAIL(批 24 那 16 条图标哨兵继续守);线上与本地副本 逐字节哈希一致(icon-512 / favicon.ico),Content-Type 正确。
|
Before Width: | Height: | Size: 658 B After Width: | Height: | Size: 719 B |
|
Before Width: | Height: | Size: 6.8 KiB After Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 6.9 KiB After Width: | Height: | Size: 9.6 KiB |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 31 KiB |
@@ -1,38 +1,60 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="TripLog 家庭旅行日记">
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="TripLog 家庭旅行日记">
|
||||||
<!-- TripLog 图标:一本翻开的日记本。左页是「家」(出发地),
|
<!-- TripLog 图标:一块地图(上),左下角是家(下),右上角是目的地(下),
|
||||||
右页是「路线 + 目的地图钉」(旅行),页面底部那道横线是写下的记录。
|
一条弯曲的路线把家连到目的地。
|
||||||
底色用站点主色 accent(#3d6bf5) 的渐变。
|
地图纹理用「路网 + 带状绿地 + 水域 + 街区小块」叠出来,小尺寸下只求
|
||||||
尺寸取舍:16px 时首页与图钉各只有几像素,所以图形取大、线取粗,
|
一眼看出「这是一张地图」,不追求地理写实。 -->
|
||||||
只保留「本子 + 一个方正图形 + 一个圆形图形」这层可辨认的形状。 -->
|
|
||||||
<defs>
|
<defs>
|
||||||
<linearGradient id="tl-bg" x1="0" y1="0" x2="1" y2="1">
|
<clipPath id="tl-map">
|
||||||
<stop offset="0" stop-color="#4C7BFF"/>
|
<rect x="0" y="0" width="64" height="64" rx="14"/>
|
||||||
<stop offset="1" stop-color="#2F56CF"/>
|
</clipPath>
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
</defs>
|
||||||
|
|
||||||
<rect width="64" height="64" rx="14" fill="url(#tl-bg)"/>
|
<g clip-path="url(#tl-map)">
|
||||||
|
<!-- 地图底 -->
|
||||||
|
<rect width="64" height="64" fill="#EFF3E8"/>
|
||||||
|
|
||||||
<!-- 翻开的日记本:左右两页(比整块底色只留 6px 边距,尽量占满) -->
|
<!-- 绿地:成片,但留出足够的白让路网看得见 -->
|
||||||
<rect x="6" y="12" width="25" height="40" rx="4" fill="#FFFFFF"/>
|
<path d="M-2 34 C8 30 16 38 26 35 C38 31 50 38 66 33 L66 66 L-2 66 Z" fill="#D3E5BD"/>
|
||||||
<rect x="33" y="12" width="25" height="40" rx="4" fill="#FFFFFF"/>
|
<ellipse cx="52" cy="52" rx="14" ry="9" fill="#D3E5BD"/>
|
||||||
<!-- 靠书脊那侧的装订阴影 -->
|
|
||||||
<rect x="27.7" y="14" width="1.8" height="36" rx="0.9" fill="#DCE6FF"/>
|
|
||||||
<rect x="34.5" y="14" width="1.8" height="36" rx="0.9" fill="#DCE6FF"/>
|
|
||||||
|
|
||||||
<!-- 左页:家(出发地) -->
|
<!-- 水域:一条河 + 一个小湖 -->
|
||||||
<path d="M10.5 31 L18.5 23 L26.5 31 Z" fill="#2F56CF"/>
|
<path d="M-2 46 C10 44 18 38 30 41 C42 44 52 39 66 42 L66 47 C52 44 42 49 30 46 C18 43 10 49 -2 50 Z"
|
||||||
<rect x="13.5" y="30.6" width="10" height="13.4" rx="1.2" fill="#2F56CF"/>
|
fill="#A9CFF0"/>
|
||||||
<rect x="16.6" y="36.4" width="3.8" height="7.6" rx="0.8" fill="#FFFFFF"/>
|
<ellipse cx="15" cy="52" rx="6.5" ry="3.6" fill="#A9CFF0"/>
|
||||||
|
|
||||||
<!-- 右页:路线 + 目的地图钉 -->
|
<!-- 街区小块 -->
|
||||||
<path d="M37 45.5 C40.5 42.5 39 39.5 42 38.2 C43.5 37.5 44.5 37.4 45.6 37.4"
|
<g fill="#E1E7D6">
|
||||||
fill="none" stroke="#2F56CF" stroke-width="2.8" stroke-linecap="round"/>
|
<rect x="6" y="15" width="7" height="5.5" rx="1.3"/>
|
||||||
<circle cx="45.2" cy="26" r="5.6" fill="#2F56CF"/>
|
<rect x="30" y="6" width="6" height="5.5" rx="1.3"/>
|
||||||
<circle cx="45.2" cy="26" r="2.2" fill="#FFFFFF"/>
|
<rect x="44" y="30" width="7.5" height="5.5" rx="1.3"/>
|
||||||
<path d="M41.9 30.2 L45.2 37.2 L48.5 30.2 Z" fill="#2F56CF"/>
|
<rect x="34" y="48" width="6" height="5" rx="1.3"/>
|
||||||
|
</g>
|
||||||
|
|
||||||
<!-- 两页底部:写下的记录 -->
|
<!-- 路网:白色,粗细分两级,横竖都有,确保「一眼是地图」 -->
|
||||||
<rect x="11" y="46.6" width="15" height="1.8" rx="0.9" fill="#C7D4F7"/>
|
<g stroke="#FFFFFF" fill="none">
|
||||||
<rect x="38" y="46.6" width="12" height="1.8" rx="0.9" fill="#C7D4F7"/>
|
<path d="M22 66 L25 46 L31 30 L34 2" stroke-width="3.4"/>
|
||||||
|
<path d="M-2 26 L20 25 L38 20 L66 14" stroke-width="3.4"/>
|
||||||
|
<path d="M-2 8 L16 10 L30 5 L44 8" stroke-width="2.6"/>
|
||||||
|
<path d="M44 66 L47 44 L56 32 L66 30" stroke-width="2.6"/>
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<!-- 弯曲路线:从家(左下)绕到目的地(右上) -->
|
||||||
|
<path d="M13 47 C17 39 26 41 31 33 C35 27 40 23 48 21"
|
||||||
|
fill="none" stroke="#2F56CF" stroke-width="2.8"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
|
||||||
|
<!-- 家(左下角):白圆底 + 蓝房子 -->
|
||||||
|
<circle cx="13" cy="47" r="8" fill="#FFFFFF" stroke="#2F56CF" stroke-width="1.4"/>
|
||||||
|
<g transform="translate(13 47) scale(0.66) translate(-13 -47)">
|
||||||
|
<path d="M7.6 45 L13 40 L18.4 45 Z" fill="#2F56CF"/>
|
||||||
|
<rect x="9.6" y="44.4" width="6.8" height="7.4" rx="0.9" fill="#2F56CF"/>
|
||||||
|
<rect x="11.8" y="47.4" width="2.4" height="4.4" rx="0.6" fill="#FFFFFF"/>
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<!-- 目的地(右上角):蓝圆底 + 白图钉 -->
|
||||||
|
<circle cx="48" cy="21" r="8" fill="#2F56CF"/>
|
||||||
|
<path d="M44.4 25.6 L48 31.8 L51.6 25.6 Z" fill="#2F56CF"/>
|
||||||
|
<circle cx="48" cy="21" r="3.6" fill="#FFFFFF"/>
|
||||||
|
<circle cx="48" cy="21" r="1.4" fill="#2F56CF"/>
|
||||||
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 9.8 KiB After Width: | Height: | Size: 13 KiB |