景の域主题Gloss化更新 1月28日

自上次想要修改Aero风格的CSS按钮样式,一发不可收拾,索性直接把其余部分也都实现了Aero Web 2.0 Gloss化(即为通常描述为Frutiger Aero的美学其中一种表达效果):

原本在页面上方、又被称为主导航栏的部分中,2014主题原格格不入的扁平菜单也整形成Vista/Mobile 6.x风格的镜面玻璃样式。

这次主要修改的地方有:

  • 主导航栏:Hover 聚光灯菜单、WMC风格子菜单,子菜单选项悬浮有动效
  • 黑侧边栏:次要导航 Web Gloss风格渐变、悬停发光效果
  • 黑侧边栏:日历小工具水晶按钮、悬停发光效果
  • 特色内容回归,链接按钮发光
  • 搜索键增加了悬浮与点击效果,圆角改回直角
  • a链接全部实现悬停发光效果,绝对不是偷懒

完整视频详情:

尽管不像赫赫有名的StyleStar Experimental对全站一比一复刻了Vista与Live的主题,并且域主也是参考了早期Sony Ericsson手机的UI,域主我有一部Aspen M1i,而现在也在用Xperia X1 ii(不是Aspen同期WM,是865安卓机!)

不能算是非常完美的装潢,包括像主导航栏的背景,为了兼顾手机响应式访问,没有做成钢琴烤漆,而是局部镜面反光的样式。

顺带一提,景の域本域早在建站之初的2023年就对Footer实现了Vista任务栏的风格化自定义CSS,不过我的编码水平一直都是个菜鸟。
最近也只是在Mozilla的CSS教学手册找到一些更高级的用法。

2014 Twenty Fourteen主题本身是扁平化设计,如果要进一步大改必须要用到子主题……
光是上面的修改已经耗费了我两天熬夜的时间,但由于又是直接改所以有很多重复代码,细究style.css的话质量很低。

无论是代码质量还是睡眠质量都很糟糕。

我真得在本地建立测试站点,用子主题重构一份。那个时候别说style.css,我甚至就直接发布一个子主题了!
我得了解一下WordPress的主题开发。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注