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

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

思源在 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; }
  • 思源笔记

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

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

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

相关帖子

欢迎来到这里!

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

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

    实际使用时能用上这么多层级的得多牛啊

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

  • abbj 1 赞同 2 评论

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

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

    你这大缸挺能藏啊

  • Penn via macOS

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

  • 小白完全不懂这玩意咋用 😂

  • profox 1 赞同

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

  • 编程小白表示虽然看不懂,但感觉很强大。

  • 希望有更多的折腾大佬分享,代码片段不错,但因为主题的不同可能效果不一样,不像主题那样可以进集市,更多还是靠分享

  • fm77mhz via macOS

    分享者你好,首先感谢分享经验。我有一个小白的问题,为什么我复制了 CSS 片段之后并不能显示前面的点点呢?回车换行之后这个文本块前面没有任何标识(你截图里的点点),如果能解答非常谢谢你!

    1 回复
  • zxhd86 via Ubuntu

    这不是普通的段落块,在段落的开头输入 * 后空格启用,或者输入 / 后找到无序列表。

    更深入的了解建议去看一下思源的用户手册和 markdown 语法。

  • fm77mhz via macOS

    谢谢,我看到 RomaEdit 类似的软件是直接换行后就有一个原点,以为思源也借鉴了这种类型的记录方式。

  • huien

    这个要如何才能运用于手机的应用上,思源 app 的坚线真的大宽了。

请输入回帖内容 ...

推荐标签 标签

  • GraphQL

    GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时(类型系统由你的数据定义)。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。

    4 引用 • 3 回帖
  • 前端

    前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。

    245 引用 • 1338 回帖
  • AngularJS

    AngularJS 诞生于 2009 年,由 Misko Hevery 等人创建,后为 Google 所收购。是一款优秀的前端 JS 框架,已经被用于 Google 的多款产品当中。AngularJS 有着诸多特性,最为核心的是:MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等。2.0 版本后已经改名为 Angular。

    12 引用 • 50 回帖 • 499 关注
  • Telegram

    Telegram 是一个非盈利性、基于云端的即时消息服务。它提供了支持各大操作系统平台的开源的客户端,也提供了很多强大的 APIs 给开发者创建自己的客户端和机器人。

    5 引用 • 35 回帖
  • WebComponents

    Web Components 是 W3C 定义的标准,它给了前端开发者扩展浏览器标签的能力,可以方便地定制可复用组件,更好的进行模块化开发,解放了前端开发者的生产力。

    1 引用 • 8 关注
  • LeetCode

    LeetCode(力扣)是一个全球极客挚爱的高质量技术成长平台,想要学习和提升专业能力从这里开始,充足技术干货等你来啃,轻松拿下 Dream Offer!

    209 引用 • 72 回帖
  • 工具

    子曰:“工欲善其事,必先利其器。”

    295 引用 • 750 回帖
  • MySQL

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

    692 引用 • 535 回帖
  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。

    729 引用 • 1278 回帖
  • 域名

    域名(Domain Name),简称域名、网域,是由一串用点分隔的名字组成的 Internet 上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位(有时也指地理位置)。

    43 引用 • 208 回帖 • 1 关注
  • AWS
    11 引用 • 28 回帖 • 10 关注
  • Kubernetes

    Kubernetes 是 Google 开源的一个容器编排引擎,它支持自动化部署、大规模可伸缩、应用容器化管理。

    116 引用 • 54 回帖 • 1 关注
  • Swagger

    Swagger 是一款非常流行的 API 开发工具,它遵循 OpenAPI Specification(这是一种通用的、和编程语言无关的 API 描述规范)。Swagger 贯穿整个 API 生命周期,如 API 的设计、编写文档、测试和部署。

    26 引用 • 35 回帖 • 4 关注
  • Windows

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

    226 引用 • 476 回帖
  • Mac

    Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机,如:iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。

    167 引用 • 595 回帖 • 1 关注
  • Swift

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

    36 引用 • 37 回帖 • 544 关注
  • SMTP

    SMTP(Simple Mail Transfer Protocol)即简单邮件传输协议,它是一组用于由源地址到目的地址传送邮件的规则,由它来控制信件的中转方式。SMTP 协议属于 TCP/IP 协议簇,它帮助每台计算机在发送或中转信件时找到下一个目的地。

    4 引用 • 18 回帖 • 636 关注
  • 小说

    小说是以刻画人物形象为中心,通过完整的故事情节和环境描写来反映社会生活的文学体裁。

    31 引用 • 108 回帖
  • 反馈

    Communication channel for makers and users.

    126 引用 • 929 回帖 • 266 关注
  • 安装

    你若安好,便是晴天。

    132 引用 • 1184 回帖
  • Sillot

    Insights(注意当前设置 master 为默认分支)

    汐洛彖夲肜矩阵(Sillot T☳Converbenk Matrix),致力于服务智慧新彖乄,具有彖乄驱动、极致优雅、开发者友好的特点。其中汐洛绞架(Sillot-Gibbet)基于自思源笔记(siyuan-note),前身是思源笔记汐洛版(更早是思源笔记汐洛分支),是智慧新录乄终端(多端融合,移动端优先)。

    主仓库地址:Hi-Windom/Sillot

    文档地址:sillot.db.sc.cn

    注意事项:

    1. ⚠️ 汐洛仍在早期开发阶段,尚不稳定
    2. ⚠️ 汐洛并非面向普通用户设计,使用前请了解风险
    3. ⚠️ 汐洛绞架基于思源笔记,开发者尽最大努力与思源笔记保持兼容,但无法实现 100% 兼容
    29 引用 • 25 回帖 • 104 关注
  • Bug

    Bug 本意是指臭虫、缺陷、损坏、犯贫、窃听器、小虫等。现在人们把在程序中一些缺陷或问题统称为 bug(漏洞)。

    76 引用 • 1742 回帖
  • 新人

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

    52 引用 • 228 回帖
  • Bootstrap

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

    18 引用 • 33 回帖 • 657 关注
  • 开源

    Open Source, Open Mind, Open Sight, Open Future!

    409 引用 • 3586 回帖
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。

    132 引用 • 796 回帖
  • 电影

    这是一个不能说的秘密。

    122 引用 • 608 回帖