5.2 KiB
CFN页头品牌标志(2026-10-31)
已随2026-10-31正式发布记录上线。以下标注“仅本地”的段落为当时实施历史;当前正式品牌、窄屏居中及侧栏TG/GitHub均已发布。
当前字标已恢复文字:用户试看风格化图片后要求改回ClashFreeNode文字。当前为统一深灰色的HTML字标,猫仍是独立SVG,下方文案保留;图片生成记录仅作历史。
用户要求尝试将现有猫转SVG,右侧显示clashfreenode,下行显示“每天分享免费节点”。已在FNA_V3本地接入,未提交/推送/部署;旧PNG与其他实例标志保留。
- SVG:
public/sites/cfn/images/logo/cat.svg,从现有logo.png猫的紫色轮廓提取并简化为二次贝塞尔曲线,5个轮廓包含双眼与独立腿部,原色#764679。只有矢量path,不嵌入PNG、脚本、字体或外部资源;透明背景。 - 复现脚本:
output/branding/vectorize-cat.py,使用桌面已带的Pillow/NumPy,无项目新增依赖;读取原PNG、不修改原图。svg约7.6KB。 - 文字:
components/cfn-brand.blade.php使用可读HTML文字,避免把字做进图片;CSS位于public/css/cfn-brand.css,app-layout在cfn环境单次加载。品牌名保持用户要求的小写,文案“每天分享免费节点”。 - 接入:nav-bar仅对site_code_short=cfn使用新组件,其他实例沿原PNG轻/深色分支。菜单顺序、菜单当前状态、TG/GitHub/搜索功能未改。
- 适配:桌面猫44×44、品牌文字23px;手机猫38×38/21px;小于360px猫32×32/18px。深色文字有主题分支,不引入远程字体或JS。
本地1280、390及320视口检查:SVG正常加载、两行文案正确,无导航横向溢出;320px品牌块约158px宽。截图:页头。本地HTTP/SVG XML检查通过;未点击线上落地页,未build。
回退:cfn导航切回原logo.png,移除app-layout的cfn-brand.css引用;不用删原PNG或修改其他实例。保持其他并行导航改动。
2026-10-31用户将字标明确为ClashFreeNode并要求设计,已本地改为CamelCase:Clash深灰、FreeNode呼应猫的紫色;字重700/650、字距-.65px,微调图文和两行间距,下方文案不变。保留真实文字及原SVG,无新字体请求,桌面/手机复验后仅本地。
风格化图片字标(2026-10-31)
原稿output/branding/wordmark/clashfreenode-generated.png,2172×724真实透明通道;完整提示词见生成提示词,由内置image_gen生成,无CLI/API密钥。交付文件public/sites/cfn/images/logo/wordmark-stylized.webp约83KB,只做网页格式编码,不重画或合成;原PNG完整保留。CSS透明画布窗口去掉上下空白,不拉伸字形。
cfn-brand.blade.php已将普通字替换为带alt=ClashFreeNode的img,保留独立SVG猫与“每天分享免费节点”。桌面字标视窗182×25,手机160×22,320px小屏134×19;活动品牌块在320px宽约172px,无横向溢出、文字识别清楚。预览见图片字标效果。本次未改广告尺寸、正文、导航链接或其他实例标志,未build、提交/推送或上线。
2026-10-31按用户最新要求,已将图片字标恢复为文字ClashFreeNode及先前字重/配色/响应字号,页头不再请求wordmark-stylized.webp;图片及提示词保留归档。SVG猫、下方文案与广告高度不变,仍仅本地。
2026-10-31用户要求颜色与此前一致,已将ClashFreeNode字标统一为原PNG字标深灰#555555,取消FreeNode的紫色强调;猫的原紫色不变,深色模式字标统一继承浅色。仅本地。
窄屏导航对齐与GitHub(2026-10-31,仅本地)
用户反馈Logo位置不对并要求窄屏不隐藏GitHub。已为SVG品牌补回6px左侧视觉留白,菜单/Logo/Telegram/GitHub/搜索垂直中心保持一致。移动导航增设使用原config(path.url_github_href)的GitHub链接,沿用原灰色32px按钮与新窗口属性;桌面保留原GitHub,不重复显示。320px下将字标微调17px并禁止导航换行,5项中心均35px,搜索不掉到第二行,未溢出;390/499px也检查通过,最终恢复默认视口。页头预览见窄屏导航。不改变文字/猫颜色、落地页地址或菜单逻辑,未上线。
2026-10-31用户澄清原要求为“窄屏整个Logo居中”,上次补左侧留白的理解已纠正。现窄屏品牌相对导航容器绝对居中,不受左菜单/右侧三个按钮宽度差影响;按390/375/320宽度协调品牌及按钮尺寸,全部图标保留。390px品牌中心195px,320px中心160px,与视口中心一致,且不重叠;桌面品牌位置不改。仅本地。
2026-10-31按用户最新要求,窄屏Telegram和GitHub从顶部移到移动侧栏的栏目菜单下方,用分隔线与菜单区分;顶部保留左侧菜单、居中品牌和右侧搜索。桌面TG/GitHub/搜索保持原位,链接配置保持原样。窄屏品牌恢复38px猫/21px文字,无需此前为右侧三图标设置的小屏压缩规则;本地检查侧栏开关与品牌中心,未上线。