思源笔记主题 Notion

本贴最后更新于 1753 天前,其中的信息可能已经时移俗易

参考 Notion 写的一个明亮模式的主题。

才发现明亮模式的主题好难写,暗黑模式下我写的那个主题哐哐哐两三种黑色 + 阴影就成了,剩下的都是编辑器内部样式;而明亮模式光 UI 就需要调好久,十几种白色排在一起晃得人眼晕(可能是我太菜了)。

已经发布,可直接从社区集市下载安装。具体简介见仓库

重点

  • 如果有什么样式相关的改进建议,可以在这个帖子下告诉我
  • 我的另一个主题帖同样如此

preview.png

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    28445 引用 • 119765 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • 写得太好了,感谢!

    一点小建议:悬浮窗没有边框,颜色也和背景一样,和背景融为一体了,有点难区分出悬浮窗的边界

    1 回复
  • svchord

    你是指哪个悬浮窗呢?

    1 回复
  • 不好意思,是我弄错了,我不想要图片有阴影,所以注释了阴影部分的代码,导致块引用的悬浮窗阴影也没了。

    我想问一下,如果我想图片没有阴影,块引用悬浮窗有阴影或边界要怎么调整呢。谢谢!

    1 回复
  • svchord

    你可以用 --b3-dialog-shadow 作为搜索条件,找到含有 span[data-type="img"] img, 的这一行代码,注释掉就可以了。我看了下也觉得图片用这个阴影有点问题,我试试换一个。

  • 很好看!

  • fangly 1 评论

    image.png

    社区集市按钮看不见了

    刚刚改好了,你可以更新看看
    svchord
  • Achuan-2 4 评论

    支持支持!

    Light 和 Dark 主题两个一起维护真的蛮累的,真的改不动了……自己的笔记都没写多少,全花在门面上了……
    Achuan-2
    @Achuan-2 哈哈哈我是在写笔记的过程中看到哪个不顺眼就改掉了
    svchord
    @zqhjl 我也这样啊,然而打字半小时,修改主题 4 小时,不过现在亮色主题已经是我满意的样子了(至少今天是,苦笑),也不想再花太多时间改了
    Achuan-2
    @Achuan-2 哈哈哈哈一样一样,我也已经基本上满意了,不想主动找 bug,所以才想着发到论坛里收集下别人找到的 bug
    svchord
  • image.png

    分屏的时候看不见分界线

    顺带再问一个问题,如果我想要上方的编辑工具栏不要隐藏,无论我鼠标移不移上去都一直显示的话,代码要怎么改呢?谢谢

    1 回复
    1 操作
    fangly 在 2021-03-05 16:38:54 更新了该回帖
  • 感谢大佬,辛苦了。之前一直在用 Atom One Dark!

    1 回复
  • svchord

    哈哈哈哈谢谢

  • svchord

    分屏这个是我一直以来的设计了,因为把内定的 border 颜色改成和背景颜色相同了,如果要修改的话整体 UI 就不好看了。

    如果是想要不隐藏的话,可以以 富文本工具栏 为搜索条件找到如下代码:

    .vditor-toolbar__item {
      transition: opacity 400ms ease 0s;
      opacity: 0;
      margin: 0 2px;
      margin-bottom: 4px;
    }
    
    .vditor-toolbar:not(.vditor-toolbar--hide):hover .vditor-toolbar__item {
      opacity: 1;
    }
    

    把其中的 transition: opacity 400ms ease 0s;opacity: 0; 以及

    .vditor-toolbar:not(.vditor-toolbar--hide):hover .vditor-toolbar__item {
      opacity: 1;
    }
    

    都注释掉就可以了

  • 一个改进的小点,不知道能不能实现,当我的块引用锚文本设置为代码时,如下.

    ((20210403014754-acq594t "{{.text}}")), 显示出来的效果 锚文本,能够再锚文本类型为代码时,也给该锚文本加一个下划线或其他方便区分的样式,方便区分,而非只有鼠标移上去的时候,才显示下划线.

    image.png

    image.png

    1 回复
  • svchord

    我去看了下,好像 {{.text}} 没有被设置特定的选择器,所以你的这个想法应该是实现不了…你可以试试发个帖子看看 D 大 V 姐会不会采纳这个建议

请输入回帖内容 ...

推荐标签 标签

  • Angular

    AngularAngularJS 的新版本。

    26 引用 • 66 回帖 • 578 关注
  • AWS
    11 引用 • 28 回帖 • 2 关注
  • Follow
    4 引用 • 13 回帖 • 19 关注
  • webpack

    webpack 是一个用于前端开发的模块加载器和打包工具,它能把各种资源,例如 JS、CSS(less/sass)、图片等都作为模块来使用和处理。

    43 引用 • 130 回帖 • 259 关注
  • CodeMirror
    2 引用 • 17 回帖 • 197 关注
  • 叶归
    25 引用 • 100 回帖 • 37 关注
  • Firefox

    Mozilla Firefox 中文俗称“火狐”(正式缩写为 Fx 或 fx,非正式缩写为 FF),是一个开源的网页浏览器,使用 Gecko 排版引擎,支持多种操作系统,如 Windows、OSX 及 Linux 等。

    7 引用 • 30 回帖 • 367 关注
  • HBase

    HBase 是一个分布式的、面向列的开源数据库,该技术来源于 Fay Chang 所撰写的 Google 论文 “Bigtable:一个结构化数据的分布式存储系统”。就像 Bigtable 利用了 Google 文件系统所提供的分布式数据存储一样,HBase 在 Hadoop 之上提供了类似于 Bigtable 的能力。

    17 引用 • 6 回帖 • 72 关注
  • WordPress

    WordPress 是一个使用 PHP 语言开发的博客平台,用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统(CMS)来使用。WordPress 是一个免费的开源项目,在 GNU 通用公共许可证(GPLv2)下授权发布。

    46 引用 • 114 回帖 • 139 关注
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    11154 引用 • 50649 回帖 • 52 关注
  • Solidity

    Solidity 是一种智能合约高级语言,运行在 [以太坊] 虚拟机(EVM)之上。它的语法接近于 JavaScript,是一种面向对象的语言。

    3 引用 • 18 回帖 • 456 关注
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 694 关注
  • 尊园地产

    昆明尊园房地产经纪有限公司,即:Kunming Zunyuan Property Agency Company Limited(简称“尊园地产”)于 2007 年 6 月开始筹备,2007 年 8 月 18 日正式成立,注册资本 200 万元,公司性质为股份经纪有限公司,主营业务为:代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。

    1 引用 • 22 回帖 • 838 关注
  • Windows

    Microsoft Windows 是美国微软公司研发的一套操作系统,它问世于 1985 年,起初仅仅是 Microsoft-DOS 模拟环境,后续的系统版本由于微软不断的更新升级,不但易用,也慢慢的成为家家户户人们最喜爱的操作系统。

    232 引用 • 484 回帖 • 2 关注
  • golang

    Go 语言是 Google 推出的一种全新的编程语言,可以在不损失应用程序性能的情况下降低代码的复杂性。谷歌首席软件工程师罗布派克(Rob Pike)说:我们之所以开发 Go,是因为过去 10 多年间软件开发的难度令人沮丧。Go 是谷歌 2009 发布的第二款编程语言。

    502 引用 • 1397 回帖 • 239 关注
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器,支持所见即所得、即时渲染(类似 Typora)和分屏预览模式。它使用 TypeScript 实现,支持原生 JavaScript、Vue、React 和 Angular。

    386 引用 • 1892 回帖 • 1 关注
  • App

    App(应用程序,Application 的缩写)一般指手机软件。

    91 引用 • 384 回帖
  • MyBatis

    MyBatis 本是 Apache 软件基金会 的一个开源项目 iBatis,2010 年这个项目由 Apache 软件基金会迁移到了 google code,并且改名为 MyBatis ,2013 年 11 月再次迁移到了 GitHub。

    174 引用 • 414 回帖 • 343 关注
  • 区块链

    区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。所谓共识机制是区块链系统中实现不同节点之间建立信任、获取权益的数学算法 。

    92 引用 • 752 回帖
  • SQLite

    SQLite 是一个进程内的库,实现了自给自足的、无服务器的、零配置的、事务性的 SQL 数据库引擎。SQLite 是全世界使用最为广泛的数据库引擎。

    4 引用 • 7 回帖
  • Google

    Google(Google Inc.,NASDAQ:GOOG)是一家美国上市公司(公有股份公司),于 1998 年 9 月 7 日以私有股份公司的形式创立,设计并管理一个互联网搜索引擎。Google 公司的总部称作“Googleplex”,它位于加利福尼亚山景城。Google 目前被公认为是全球规模最大的搜索引擎,它提供了简单易用的免费服务。不作恶(Don't be evil)是谷歌公司的一项非正式的公司口号。

    51 引用 • 200 回帖 • 2 关注
  • 小薇

    小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。

    由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!

    35 引用 • 468 回帖 • 768 关注
  • BookxNote

    BookxNote 是一款全新的电子书学习工具,助力您的学习与思考,让您的大脑更高效的记忆。

    笔记整理交给我,一心只读圣贤书。

    1 引用 • 1 回帖
  • 资讯

    资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息,资讯有时效性和地域性。

    56 引用 • 85 回帖
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    176 引用 • 544 回帖
  • 程序员

    程序员是从事程序开发、程序维护的专业人员。

    599 引用 • 3541 回帖
  • WiFiDog

    WiFiDog 是一套开源的无线热点认证管理工具,主要功能包括:位置相关的内容递送;用户认证和授权;集中式网络监控。

    1 引用 • 7 回帖 • 633 关注