总需求:
有点复杂,以有序列表为例:
1. 折叠时,去除数字方框阴影
另:无序列表的折叠阴影不用去除
2. 只显示“‣”
3. 鼠标悬浮“‣”时,去除方框阴影、“折叠/展开”字样
4. 折叠标题,去除方框(任我行主题,可以理解为“去除折叠状态标识”)
总需求:
有点复杂,以有序列表为例:
1. 折叠时,去除数字方框阴影
另:无序列表的折叠阴影不用去除
2. 只显示“‣”
3. 鼠标悬浮“‣”时,去除方框阴影、“折叠/展开”字样
4. 折叠标题,去除方框(任我行主题,可以理解为“去除折叠状态标识”)
css 代码如下
/* 有序列表,折叠时,去除数字方框阴影; 无序列表的折叠阴影不用去除 */
.protyle-wysiwyg [data-node-id].li[data-subtype="o"][fold="1"]>.protyle-action:after{
background-color: transparent!important;
}
/* 只显示“‣” */
.protyle-gutters button[data-type="NodeList"] svg,
.protyle-gutters button[data-type="NodeListItem"] svg
{
display:none;
}
/* 鼠标悬浮“‣”时去除方框引用 */
.protyle-gutters button:hover svg{
background-color: transparent;
}
/* 折叠标题,去除方框(任我行主题,可以理解为“去除折叠状态标识”) */
.protyle-wysiwyg div[fold="1"]:not(div[data-type="NodeListItem"]){
background-color: transparent;
border:none;
}
/* 鼠标悬浮“‣”时,去除“折叠/展开”字样,css无法实现,见下面的js代码 */
鼠标悬浮“‣”时,去除“折叠/展开”字样,css 无法实现,js 代码如下
// 鼠标悬浮“‣”时,去除“折叠/展开”字样
(()=>{
whenElementExist(".layout__center").then((element)=>{
element.addEventListener('mouseover', async (e)=>{
if(e.target.closest('button[aria-label="折叠/展开"]')){
const tooltip = await whenElementExist("#tooltip");
tooltip.remove();
}
});
});
function whenElementExist(selector) {
return new Promise(resolve => {
const checkForElement = () => {
let element = null;
if (typeof selector === 'function') {
element = selector();
} else {
element = document.querySelector(selector);
}
if (element) {
resolve(element);
} else {
requestAnimationFrame(checkForElement);
}
};
checkForElement();
});
}
})();
另外,你需求里提到的一级标题,我想你本意应该不是仅针对一级标题的样式吧,所以这里的样式和 js 会应用到 h1-h6 所有标题。
Git 是 Linux Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。
Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机,如:iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。
应用程序编程接口(Application Programming Interface)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。
Bootstrap 是 Twitter 推出的一个用于前端开发的开源工具包。它由 Twitter 的设计师 Mark Otto 和 Jacob Thornton 合作开发,是一个 CSS / HTML 框架。
PWA(Progressive Web App)是 Google 在 2015 年提出、2016 年 6 月开始推广的项目。它结合了一系列现代 Web 技术,在网页应用中实现和原生应用相近的用户体验。
用爱发电 (Programming With Love) 是一个以开源精神为核心的民间开源爱好者技术组织,“用爱发电”象征开源与贡献精神,加入组织,代表你将遵守组织的“个人开源爱好者”的各项条款。申请加入:用爱发电组织邀请帖。
用爱发电组织官网:https://programmingwithlove.stackoverflow.wiki/
让我们欢迎这对新人。哦,不好意思说错了,让我们欢迎这位新人!
新手上路,请谨慎驾驶!
据说 99% 的性能瓶颈都在数据库。
WebSocket 是 HTML5 中定义的一种新协议,它实现了浏览器与服务器之间的全双工通信(full-duplex)。
Java 是一种可以撰写跨平台应用软件的面向对象的程序设计语言,是由 Sun Microsystems 公司于 1995 年 5 月推出的。Java 技术具有卓越的通用性、高效性、平台移植性和安全性。
发布对别人有帮助的原创内容是最好的 SEO 方式。
你若安好,便是晴天。
Hadoop 是由 Apache 基金会所开发的一个分布式系统基础架构。用户可以在不了解分布式底层细节的情况下,开发分布式程序。充分利用集群的威力进行高速运算和存储。
Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等,它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比,Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面,而不需要启动整个 Web 应用。
ZooKeeper 是一个分布式的,开放源码的分布式应用程序协调服务,是 Google 的 Chubby 一个开源的实现,是 Hadoop 和 HBase 的重要组件。它是一个为分布式应用提供一致性服务的软件,提供的功能包括:配置维护、域名服务、分布式同步、组服务等。
Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎,基于 RESTful 接口。Elasticsearch 是用 Java 开发的,并作为 Apache 许可条款下的开放源码发布,是当前流行的企业级搜索引擎。设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便。
PHP(Hypertext Preprocessor)是一种开源脚本语言。语法吸收了 C 语言、 Java 和 Perl 的特点,主要适用于 Web 开发领域,据说是世界上最好的编程语言。
Sphinx 是一个基于 SQL 的全文检索引擎,可以结合 MySQL、PostgreSQL 做全文搜索,它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索。
资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息,资讯有时效性和地域性。
大数据(big data)是指无法在一定时间范围内用常规软件工具进行捕捉、管理和处理的数据集合,是需要新处理模式才能具有更强的决策力、洞察发现力和流程优化能力的海量、高增长率和多样化的信息资产。
Open Source, Open Mind, Open Sight, Open Future!
Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。
jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。
ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。
CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。