搞轮子:皮肤概念的几种方案
而且我还希望能有灰度模式和暗黑模式,皮肤概念孕育而生
大厂的做法
vant
ant-design
zarm
考察下来,zarm 最符合我的预期
按 zarm 的来
简单来说,使用 context 来做主题色,因为 context 能传递到任意组件,接下来就看怎么写
皮肤解决方案
https://segmentfault.com/a/1190000041195585?_ea=195391016
CSS 变量
:root {
--bg-color: brown; // 定义颜色变量
}
.btn {
// 直接使用颜色预定义的颜色变量
background-color: var(--bg-color);
}
https://css-tricks.com/switch-font-color-for-different-backgrounds-with-css/
https://zhuanlan.zhihu.com/p/494460951
https://mp.weixin.qq.com/s/6bmqki5IPDlD4H7a7C1HXw
张鑫旭的换肤方案
https://www.bilibili.com/video/BV1kU4y1X7a8?vd_source=55c655c3b4aed7bb7a250da7eea13eb8