希望可以折叠代码
能否写一个代码片段来折叠过长的代码,例如 CSDN 的代码 😄
希望可以折叠代码
能否写一个代码片段来折叠过长的代码,例如 CSDN 的代码 😄
思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。
融合块、大纲和双向链接,重构你的思维。
代码片段分为 CSS 与 JS 两种代码,添加在 [设置 - 外观 - 代码片段] 中,这些代码会在思源笔记加载时自动执行,用于改善笔记的样式或功能。
用户在该标签下分享代码片段时需在帖子标题前添加 [css]
或 [js]
用于区分代码片段类型。
提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。
我在 @JeffreyChen 的基础上,增加了 js 代码,不知是否是你想要的效果。
亮色主题样式
暗色主题样式
js 代码如下 (仅需把下面代码放到 js 片段即可,代码中已含 css)
参数说明:
const codeMaxHeight = 300,当代码块内容高度超出多少像素是折叠,注意:这里的高度是指.hljs 元素的高度,默认是 300px
对所有代码块生效,数值可以自己改:
/* 代码块限制最大高度 CSS片段 */
div:not(#preview) > .protyle-wysiwyg .code-block .hljs {
max-height: 800px;
}
我在 @JeffreyChen 的基础上,增加了 js 代码,不知是否是你想要的效果。
亮色主题样式
暗色主题样式
js 代码如下 (仅需把下面代码放到 js 片段即可,代码中已含 css)
参数说明:
const codeMaxHeight = 300,当代码块内容高度超出多少像素是折叠,注意:这里的高度是指.hljs 元素的高度,默认是 300px
我有一个 59 个代码块的文档,好像并没有生效,只是可以滑动,那个展开的按钮好像并没有出现
抱歉,我这边无法重现。
首先,在新空间尝试测试问题数及新数据,确保不是因为某些原因或缓存等造成影响导致意外。
如果仍未解决,请参考 [js] 折叠代码块 - wilsons 的回帖 这里的回复
另外,提醒下,思源代码片段,修改代码中后建议重启思源,否则系统中可能存在多份代码相互影响。
已修复,请用新代码测试。
这个 bug 是当思源块有用户自定义 dom 时,提交块内容时,自定义 dom 被当做块内容的一部分被提交,代码块这里便当做了代码的一部分被提交。
本次修改采用拦截思源块提交 api,并在提交前过滤自定义 dom 的临时解决方案。
相关 bug 已提交思源官方:Issue #12684 · siyuan-note/siyuan
还是有些 bug,复现如下:
<script>alert("xss");</script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
Redis 是一个开源的使用 ANSI C 语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value 数据库,并提供多种语言的 API。从 2010 年 3 月 15 日起,Redis 的开发工作由 VMware 主持。从 2013 年 5 月开始,Redis 的开发由 Pivotal 赞助。
Swagger 是一款非常流行的 API 开发工具,它遵循 OpenAPI Specification(这是一种通用的、和编程语言无关的 API 描述规范)。Swagger 贯穿整个 API 生命周期,如 API 的设计、编写文档、测试和部署。
微软是一家美国跨国科技公司,也是世界 PC 软件开发的先导,由比尔·盖茨与保罗·艾伦创办于 1975 年,公司总部设立在华盛顿州的雷德蒙德(Redmond,邻近西雅图)。以研发、制造、授权和提供广泛的电脑软件服务业务为主。
webpack 是一个用于前端开发的模块加载器和打包工具,它能把各种资源,例如 JS、CSS(less/sass)、图片等都作为模块来使用和处理。
发布对别人有帮助的原创内容是最好的 SEO 方式。
V2EX 是创意工作者们的社区。这里目前汇聚了超过 400,000 名主要来自互联网行业、游戏行业和媒体行业的创意工作者。V2EX 希望能够成为创意工作者们的生活和事业的一部分。
Typecho 是一款博客程序,它在 GPLv2 许可证下发行,基于 PHP 构建,可以运行在各种平台上,支持多种数据库(MySQL、PostgreSQL、SQLite)。
ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。
ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。
C 语言是一门通用计算机编程语言,应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。
InfluxDB 是一个开源的没有外部依赖的时间序列数据库。适用于记录度量,事件及实时分析。
设计模式(Design pattern)代表了最佳的实践,通常被有经验的面向对象的软件开发人员所采用。设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。
RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣,为数百万人服务的开源嵌入式知识学习交流平台。
昆明尊园房地产经纪有限公司,即:Kunming Zunyuan Property Agency Company Limited(简称“尊园地产”)于 2007 年 6 月开始筹备,2007 年 8 月 18 日正式成立,注册资本 200 万元,公司性质为股份经纪有限公司,主营业务为:代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。
SSL(Secure Sockets Layer 安全套接层),及其继任者传输层安全(Transport Layer Security,TLS)是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。
NetBeans 是一个始于 1997 年的 Xelfi 计划,本身是捷克布拉格查理大学的数学及物理学院的学生计划。此计划延伸而成立了一家公司进而发展这个商用版本的 NetBeans IDE,直到 1999 年 Sun 买下此公司。Sun 于次年(2000 年)六月将 NetBeans IDE 开源,直到现在 NetBeans 的社群依然持续增长。
Postman 是一款简单好用的 HTTP API 调试工具。
WordPress 是一个使用 PHP 语言开发的博客平台,用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统(CMS)来使用。WordPress 是一个免费的开源项目,在 GNU 通用公共许可证(GPLv2)下授权发布。
宕机,多指一些网站、游戏、网络应用等服务器一种区别于正常运行的状态,也叫“Down 机”、“当机”或“死机”。宕机状态不仅仅是指服务器“挂掉了”、“死机了”状态,也包括服务器假死、停用、关闭等一些原因而导致出现的不能够正常运行的状态。
Lute 是一款结构化的 Markdown 引擎,支持 Go 和 JavaScript。
Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境。