思源 v2.4.7 代码片段分享:让你能塞进更多大纲

本贴最后更新于 708 天前,其中的信息可能已经天翻地覆

思源在 v2.4.7 来了一次史诗级更新,支持 css、js 片段,终于能折腾这些跨不同主题的东西了。

代码片段如何使用,参见这个

思源笔记对应大纲式笔记的支持还是不错的,但是我一直觉得思源的大纲层级缩进距离太大了:

图片.png

在第 22 层就会缩进去

而 logseq 感觉好点:

图片.png

能缩进到 26 层级

remNote 能支持到 33 层级:

图片.png

个人认为,缩进对于大纲笔记的观感影响是很大的。当缩进距离过大时,不需要进入几个层级,就会感觉页面被空白和竖线占据,让人感觉不舒服。

固然,这些更改在 css 层面是很容易实现的,但是更换主题、更新主题就要重来一变,让人不胜其烦——但是,这已经是过去式了!思源支持代码片段了!

这是修改后的层级:

  • 大档

图片.png

  • 中档

图片.png

  • 小档

图片.png

css 片段见下:

/*大档*/
.protyle-wysiwyg [data-node-id].li>div:nth-child(2) {
    margin-top: -0.3em !important;
}
.protyle-wysiwyg [data-node-id].li>[data-node-id] {
    margin-left: 1.7em !important;
    padding-left: 0.3em;
}
.protyle-wysiwyg [data-node-id].li>.list {
    padding-left: 0em;
}

/*中档*/
.protyle-wysiwyg [data-node-id].li>div:nth-child(2) {
    margin-top: -0.3em !important;
}
.protyle-wysiwyg [data-node-id].li>[data-node-id] {
    margin-left: 1.4em !important;
    padding-left: 0.6em;
}
.protyle-wysiwyg [data-node-id].li>.list {
    padding-left: 0em;
}

/*小档*/
.protyle-wysiwyg [data-node-id].li>div:nth-child(2) {
    margin-top: -0.3em !important;
}
.protyle-wysiwyg [data-node-id].li>[data-node-id] {
    margin-left: 1.1em !important;
    padding-left: 0.9em;
}
.protyle-wysiwyg [data-node-id].li>.list {
    padding-left: 0em;
}
  • 思源笔记

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

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

    22025 引用 • 87847 回帖 • 3 关注
1 操作
zxhd86 在 2022-10-29 12:44:32 更新了该帖

相关帖子

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • profox 1 赞同

    我特别希望 siyuan 的这个文档树窗口,能够增加一个横向滚动条,否则要展开找到如楼主所示的最底层的页面,太痛苦了

  • 其他回帖
  • Penn

    天啊 思源支持 css 片段了!!!!!!!

  • 这个思维,隐藏得极其深刻呀

  • abbj 1 赞同 2 评论

    我需要一个文档树和大纲显示层级竖线的片段,以及浮动弹出侧边栏的片段,感觉集市里需要增加一个代码片段板块 @88250

    提建议时,建议用“很重要”来阐述,不建议用“我需要”来表达
    Bard
    你说得对。 但其实我想给 d 大看的主要是后一句“感觉需要增加代码片段板块”。前面一句只是表达自己的想法,说完之后想起来可以提一个这样的建议。整体看起来语气是不太对。
    abbj
  • 查看全部回帖

推荐标签 标签

  • OkHttp

    OkHttp 是一款 HTTP & HTTP/2 客户端库,专为 Android 和 Java 应用打造。

    16 引用 • 6 回帖 • 60 关注
  • Bootstrap

    Bootstrap 是 Twitter 推出的一个用于前端开发的开源工具包。它由 Twitter 的设计师 Mark Otto 和 Jacob Thornton 合作开发,是一个 CSS / HTML 框架。

    18 引用 • 33 回帖 • 663 关注
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架,使用 Node.js 编写。

    21 引用 • 140 回帖 • 7 关注
  • CloudFoundry

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。

    5 引用 • 18 回帖 • 164 关注
  • Swift

    Swift 是苹果于 2014 年 WWDC(苹果开发者大会)发布的开发语言,可与 Objective-C 共同运行于 Mac OS 和 iOS 平台,用于搭建基于苹果平台的应用程序。

    36 引用 • 37 回帖 • 534 关注
  • Android

    Android 是一种以 Linux 为基础的开放源码操作系统,主要使用于便携设备。2005 年由 Google 收购注资,并拉拢多家制造商组成开放手机联盟开发改良,逐渐扩展到到平板电脑及其他领域上。

    334 引用 • 323 回帖
  • 酷鸟浏览器

    安全 · 稳定 · 快速
    为跨境从业人员提供专业的跨境浏览器

    3 引用 • 59 回帖 • 31 关注
  • 阿里巴巴

    阿里巴巴网络技术有限公司(简称:阿里巴巴集团)是以曾担任英语教师的马云为首的 18 人,于 1999 年在中国杭州创立,他们相信互联网能够创造公平的竞争环境,让小企业通过创新与科技扩展业务,并在参与国内或全球市场竞争时处于更有利的位置。

    43 引用 • 221 回帖 • 126 关注
  • 架构

    我们平时所说的“架构”主要是指软件架构,这是有关软件整体结构与组件的抽象描述,用于指导软件系统各个方面的设计。另外还有“业务架构”、“网络架构”、“硬件架构”等细分领域。

    142 引用 • 442 回帖
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    197 引用 • 547 回帖
  • Typecho

    Typecho 是一款博客程序,它在 GPLv2 许可证下发行,基于 PHP 构建,可以运行在各种平台上,支持多种数据库(MySQL、PostgreSQL、SQLite)。

    12 引用 • 65 回帖 • 452 关注
  • Windows

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

    221 引用 • 473 回帖
  • 星云链

    星云链是一个开源公链,业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎,一个公链的所有功能,它基本都有,比如你可以用它来开发部署你的去中心化的 APP,你可以在上面编写智能合约,发送交易等等。3 分钟快速接入星云链 (NAS) 测试网

    3 引用 • 16 回帖 • 1 关注
  • Gzip

    gzip (GNU zip)是 GNU 自由软件的文件压缩程序。我们在 Linux 中经常会用到后缀为 .gz 的文件,它们就是 Gzip 格式的。现今已经成为互联网上使用非常普遍的一种数据压缩格式,或者说一种文件格式。

    9 引用 • 12 回帖 • 136 关注
  • 数据库

    据说 99% 的性能瓶颈都在数据库。

    338 引用 • 705 回帖
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”,乌云众测平台认证的“安全云”,为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 541 关注
  • 新人

    让我们欢迎这对新人。哦,不好意思说错了,让我们欢迎这位新人!
    新手上路,请谨慎驾驶!

    52 引用 • 228 回帖
  • 游戏

    沉迷游戏伤身,强撸灰飞烟灭。

    176 引用 • 815 回帖
  • Thymeleaf

    Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等,它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比,Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个 Web 应用。

    11 引用 • 19 回帖 • 354 关注
  • PWA

    PWA(Progressive Web App)是 Google 在 2015 年提出、2016 年 6 月开始推广的项目。它结合了一系列现代 Web 技术,在网页应用中实现和原生应用相近的用户体验。

    14 引用 • 69 回帖 • 151 关注
  • Notion

    Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.

    6 引用 • 38 回帖
  • FlowUs

    FlowUs.息流 个人及团队的新一代生产力工具。

    让复杂的信息管理更轻松、自由、充满创意。

    1 引用 • 1 关注
  • V2Ray
    1 引用 • 15 回帖
  • 旅游

    希望你我能在旅途中找到人生的下一站。

    90 引用 • 899 回帖 • 2 关注
  • Redis

    Redis 是一个开源的使用 ANSI C 语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value 数据库,并提供多种语言的 API。从 2010 年 3 月 15 日起,Redis 的开发工作由 VMware 主持。从 2013 年 5 月开始,Redis 的开发由 Pivotal 赞助。

    286 引用 • 248 回帖 • 74 关注
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现,服务器端用 Erlang 语言编写,支持多种语言客户端,如:Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息,在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 367 关注
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    677 引用 • 535 回帖