walinejs / waline

💬 A Simple, Safe Comment System
https://waline.js.org/en/
GNU General Public License v2.0
2.19k stars 379 forks source link

css 問題 #110

Closed jerryc127 closed 3 years ago

jerryc127 commented 3 years ago

其實這是valine就有的問題

https://github.com/lizheming/waline/blob/9c060a989438364b8d3f323a2f2a092089ecbb3e/packages/client/src/index.css#L706

@media (prefers-color-scheme:dark) 這個是判斷系統是否是darkmode

可問題是,如果系統是darkmode, 但是網頁不是 那css 樣式就會導致有點問題。。 image

判斷是不是darkmode而改樣式 是不是不適合用 @media 去判斷

lizheming commented 3 years ago

很多主题自带了手动切换暗黑模式的按钮,这种情况的确不太适合用媒体查询去判断。但是这种情况下主题增加的 class 是什么 waline 也不清楚,所以也不太好预设进来。目前的情况估计只能先这样了,如果你比较介意的话可以把 CSS 复写一下。

jerryc127 commented 3 years ago

是啊 要麽向disqus 那樣自動去檢查背景色 然後選擇加載css 要麽像 utterances 那樣,提供一個function 讓主題去調用黑暗模式

@media 這種判斷 挺一刀切

jerryc127 commented 3 years ago

我覺得可以學twikoo那樣 不用啥元素都給它顔色 就直接使用主題的就行,向 p 標簽那些

而waline只需要在一些‘需要的元素’上面,像 評論框border顔色 選用一個在暗色下和亮色下都能顯示清楚的顔色就行 這樣就不用特意去匹配夜間模式,也不用使用 media 這種一刀切的適配