Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

建议:增强插件样式的覆盖能力 #17

Closed
Sansui233 opened this issue May 23, 2022 · 7 comments
Closed

建议:增强插件样式的覆盖能力 #17

Sansui233 opened this issue May 23, 2022 · 7 comments

Comments

@Sansui233
Copy link

Sansui233 commented May 23, 2022

目前的夜间模式下样式覆盖能力不足,导致与部分主题冲突。对于插件的默认样式,个人有一些小建议

  1. 此插件样式优先级应当高于所有主题,但目前使用的选择器过于简单容易被主题覆盖。可以考虑嵌套或 important 以提高优先级。尽管important 是非常侵入式的写法,但此插件的样式应当不会再希望被其他插件所覆盖。
  2. 提高插件样式的完整性。比如浅色背景高亮时,需要同时将设置字体颜色为黑色。目前在夜间模式下,如 logseq-dev-theme 字体颜色为白色,和此插件的高亮浅色背景搭配难以阅读。
  3. 字体色彩明度差异过大,建议统一文字明度。目前 green 文字在亮色模式下与背景对比度不足,导致阅读困难,而 blue 文字在暗色模式下阅读困难。
  4. 需要适配 dark mode。一是样式覆盖能力的问题,目前只要是主题修改过 dark mode 的高亮均会覆盖插件的样式写法。二是暗色模式下的高亮颜色设计需要与亮色模式下的高亮有不同的考虑。

该问题来自logseq-bonofix-theme issue

最后,感谢您写出方便好用的高亮插件~

@sethyuan
Copy link
Owner

@Sansui233 巧了,我现在用的theme就是你的bonofix theme。😃 之前没用过dark mode,所以没发现这个情况。

针对这个问题本身,如果是在Text Wrapper这边做调整的话难点在于插件并不知道用户所用theme的日间文字色和夜间文字色分别是什么(目前只有一个--ls-primary-text-color),所以无法做优化处理。理想情况是,在日间情况下插件取日间文字色做前景色,在夜间情况下也取日间文字色做前景色,背景色选一个默认在日夜下都能较好显示的颜色即可。

举例,如果用户theme的--ls-primary-text-color在亮色模式下为332211,那么无论是否dark mode,插件都希望用332211作文字色。这个目前在插件端似乎是做不到的,目前只有theme来主动适配插件才能够做到(其实最好是Logseq提供两个变量而不是一个)。

另外关于颜色对比度等取值问题,这些都要根据用户所使用的theme来综合看,插件无法做到适配所有theme。所以有两种方法比较适合解决这类问题,一个是用户通过CSS自定义自己想用的高亮色,这个现在是支持的;另一个是theme作者主动去适配插件。

@sethyuan
Copy link
Owner

要不然我这样改:

image

我看Logseq本身高亮是写死的颜色,我也就写死这个颜色。

出来的效果是这样的:

image

这样应该是可以接受的。

@sethyuan
Copy link
Owner

已经发了新版本,做了上述修改,试试呢。 @Sansui233

@Sansui233
Copy link
Author

Sansui233 commented May 23, 2022

@sethyuan 对,我想的也是写死,插件用自己的样式,不用管别的主题是什么样。这算是提高插件默认样式的适配性。同时这也不妨碍主题作者和用户再次自定义。感谢回复~

@Sansui233
Copy link
Author

看了更新是这样,再次谢谢您的修改!(虽然这么接下来说可能会觉得我抠得有点多)希望插件默认的样式也能有较好的阅读体验。个人感觉 text-color 默认的红绿蓝太生了,和背景黄色搭配不算协调。不过设计是属于主观感受,应该是去自定义。再次感谢您~

@sethyuan
Copy link
Owner

看了更新是这样,再次谢谢您的修改!(虽然这么接下来说可能会觉得我抠得有点多)希望插件默认的样式也能有较好的阅读体验。个人感觉 text-color 默认的红绿蓝太生了,和背景黄色搭配不算协调。不过设计是属于主观感受,应该是去自定义。再次感谢您~

😂 我不懂颜色搭配,方便的话你可以给我几个配色,我直接用。

@Sansui233
Copy link
Author

Sansui233 commented May 23, 2022

Notion 颜色参考(也仅仅是参考),主要是它的颜色可读性和舒适感不错,大面积长时间盯着也不会刺眼。

Screen Shot 2022-05-23 at 15 35 52

Screen Shot 2022-05-23 at 15 35 30

Logseq 后面出的绝大多数主题都有着合理的亮暗背景色,个人觉得用 --ls -background-color--ls-text-primary 写死插件的颜色是合理且兼容性非常好的。如果真出现了一些主题在亮色模式用黑色背景的情况,确实是需要用户自定义了,但个人认为这种情况是属于 corner case。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants