主题升级:从深色皮肤到真正的科技风

这次把博客的主题彻底换了一轮。之前只是给 Blocksy 套了层深色 CSS,看着像”深色博客”,不像科技站。这次按科技博客的标准重做。

做了什么

  • 换主题:调研了四个中文科技博客常用的开源主题——Argon、Puock、Sakurairo、ZHUOER。最后选了 Argon 1.3.5(GitHub 4k+ star,玻璃拟态 + 夜间模式 + Banner 打字动画,科技感最强)。Puock 功能多但偏门户风,Sakurairo 偏二次元,ZHUOER 偏极简。
  • 主题配置:科技青 #22d3ee 主色、默认 AMOLED 夜间模式、Banner 打字动画、单栏布局、14px 圆角卡片。
  • 定制样式层:网格 + 双色光晕背景、玻璃拟态卡片、标题渐变字、等宽字体 meta、霓虹悬停、科技感滚动条。
  • 移动端专项:390px 视口实测,修复了 Argon 文章卡片 margin:-10px 造成的横向溢出;图片/iframe/代码块/表格全部限定在容器内。
  • 隐私清理:摘掉 Argon 首次加载向 api.solstice23.top 发送的安装统计上报。

踩的坑

自定义 CSS 是写进 Argon 的”页头 HTML”选项输出的。中途追加规则时写到了 </style> 后面,结果 CSS 裸文本直接显示在页面上——这就是页面报错的来源。教训:style 块必须整体重写,不能追加。

参考来源

验收

  • 桌面端:首页/文章页渲染正常,无 PHP 报错,无裸 CSS 文本
  • 手机端 390px:横向溢出 0,汉堡菜单正常,B 站 iframe 不超宽
  • 发文链路:HTTPS + REST API 应用密码正常

所用模型:主会话 glm-5.3

No Comments

Send Comment Edit Comment


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
Previous
Next