【建议】新增一个配置 auto-colorscheme #164

jerryc127 · 2021-03-07T12:49:14Z

建议在前端配置新增一个配置 auto-colorscheme(随系统状态切换light dark mode)

如果设为true 的话

就加载这段css
https://github.com/lizheming/waline/blob/209e86c3f95b3a5d0c7988498419a87044bf4878/packages/client/src/index.css#L718

@media (prefers-color-scheme:dark) {
	.v[data-class=v] .status-bar,
	.v[data-class=v] .veditor,
	.v[data-class=v] .vinput,
	.v[data-class=v] p,
	.v[data-class=v] pre code {
		color: #b2b2b5
	}
	.v[data-class=v] .vsys,
	.v[data-class=v] .vtime {
		color: #929298
	}
	.v[data-class=v] code,
	.v[data-class=v] pre,
	.v[data-class=v] pre code {
		color: #929298;
		background-color: #151414
	}
	.v[data-class=v] .vwrap {
		border-color: #b2b2b5
	}
	.v[data-class=v] .vicon {
		fill: #b2b2b5
	}
	.v[data-class=v] .vicon.actived {
		fill: #66b1ff
	}
	.v[data-class=v] .vbtn {
		color: #b2b2b5;
		border-color: #b2b2b5
	}
	.v[data-class=v] .vbtn:hover {
		color: #66b1ff;
		border-color: #66b1ff
	}
	.v[data-class=v] a:hover {
		color: #d7191a
	}
	.v[data-class=v] .vcards .vcard .vcontent.expand:before {
		background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .3)), to(rgba(0, 0, 0, .7)));
		background: linear-gradient(180deg, rgba(0, 0, 0, .3), rgba(0, 0, 0, .7))
	}
	.v[data-class=v] .vcards .vcard .vcontent.expand:after {
		background: rgba(0, 0, 0, .7)
	}
}

这样可以避免主题不是夜间模式下，由于系统是夜间模式而导致评论部分ui 看不清的情况

（本想写了推送给你，但我看不懂react的逻辑）

jerryc127 · 2021-03-07T12:49:26Z

#110

lizheming · 2021-03-08T14:59:22Z

@waline/client@0.14.8 暂时去除了自适应相关的配置，如果需要适配可以在主题 <body> 添加 class .dark。

lizheming closed this as completed in c9c543f Mar 8, 2021

Mister-Hope added the discussion Question or dicussion label Oct 30, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

【建议】新增一个配置 auto-colorscheme #164

【建议】新增一个配置 auto-colorscheme #164

jerryc127 commented Mar 7, 2021

jerryc127 commented Mar 7, 2021

lizheming commented Mar 8, 2021 •

edited

【建议】新增一个配置 auto-colorscheme #164

【建议】新增一个配置 auto-colorscheme #164

Comments

jerryc127 commented Mar 7, 2021

jerryc127 commented Mar 7, 2021

lizheming commented Mar 8, 2021 • edited

lizheming commented Mar 8, 2021 •

edited