登录 注册

自定义样式：搜索窗口改造（窗口放大 + 左右布局）

本贴最后更新于 930 天前，其中的信息可能已经时移世易

如果兄弟们用的满意，别忘了使用我得推荐码：K9TdVww

作为 512 成员之一，推荐码还没有开张过。。

  • 20220506 更新：搜索结果列表改成双行显示（照搬 notion-theme，感谢作者 🤝）

  • 20220404 更新代码：

    • 调整结果预览区域的高度，避免对应笔记底部内容不能完整显示
    • 禁止搜索结果列表出现横向滚动条（不良后果是如果笔记路径很长就会无法完整显示，我觉得这个不重要）；
    • 调整窄窗口上下布局时，搜索结果部分和结果预览部分的相对比例。

  • 20220402 更新代码：当窗口宽度较窄（尺寸可自定义）时，左右分栏不合适，ctrl+p 窗口将自动调整为上下布局

  • 20220330 更新代码：修正对 ctrl+r 的影响

  • 20220329 更新代码：

    • 左右宽度自动计算占据一半，不再写死；
      • 实际是左边宽度占据一定比例，右边自动充满，因此，你也可以修改左边宽度，做成左窄右宽的类似侧边栏效果
    • 加了一点署名信息，放了我的推荐码，希望能够被使用，满足一下虚荣心

    各位可以随意在自己的主题使用，不用告知我

一直觉得思源的全局搜索还不够好用，空间利用效率不高，理想情况是 vscode 或者 obsidian 那样的。可惜自己搞不定，那就先在自己能力范围内，把目前的搜索界面小改一下：

改造效果如下：

图片.png

图片.png

相应 css 代码如下（不要解压，直接去掉.zip 后缀后，@import 到当前主题即可。注释很清楚，可以随意修改）：

CtrlP.css 删掉 zip 不要解压.zip

  • 思源笔记

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

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

    22346 引用 • 89411 回帖 • 1 关注
1 引用
搜索窗口左右显示，适配 2.5.2 • yjmsiyuan
6 操作
abbj 在 2022-05-06 23:07:31 更新了该帖
abbj 在 2022-04-04 23:45:17 更新了该帖
abbj 在 2022-04-02 09:51:01 更新了该帖
abbj 在 2022-03-30 14:00:30 更新了该帖 abbj 在 2022-03-29 10:35:20 更新了该帖 abbj 在 2022-03-29 10:29:44 更新了该帖
3 感谢
1 关注
3 收藏
1 引用
6 操作
34 回帖
13
7
6
3
2
3.2k 490 454 1.2k 67 34 927

相关帖子

优质回帖
  • abbj • • 1 • 1 赞同
    订阅者 支持者 勇士 作者

    你好，我看最新的 notion 主题应该是修复了这个问题，我暂时没空研究。你可以换成 notion,或者先研究下他是怎么改的。

    不忙了我再改完更新这里 🙏

  • abbj • • 1 赞同
    订阅者 支持者 勇士 作者

    想要恢复官方宽度的话，直接把 width 那行删掉就行。

    官方宽度的数值在开发者工具里可以看出来。

  • abbj • • 1 赞同
    订阅者 支持者 勇士 作者

    @participants 各位，又有更新了，建议跟进，原先的版本有点小问题，结果预览显示不全。

34 回帖
自定义样式：搜索窗口改造（窗口放大 + 左右布局）

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • abbj • • 1 赞同
    订阅者 支持者 勇士 作者

    @participants 各位，又有更新了，建议跟进，原先的版本有点小问题，结果预览显示不全。

  • 其他回帖
  • abbj •
    订阅者 支持者 勇士 作者

    可以的，随意用吧，能让更多人用到就更好了，我自己懒得上传集市。

    代码有更新（正文有说明），记得下载新版。

    我也不是大佬，D 和 V 才是，我就是需要学习，找到一个满意的工具不容易，希望大家一起，让跟多人接触和使用思源笔记，让两位开发者持续改进这个工具 😄😄

    1 回复
  • abbj •
    订阅者 支持者 勇士 作者

    是的，是官方设计的问题。感觉自定义 css 的方法优化空间不大了。

    个人感觉最好是搜索结果按所在文件分组，可以折叠展开，使用效率比现在高很多。

    1 回复
  • Zhangwuji •

    大佬好，在使用主题的过程中，有朋友给 CtrlP.css 提供了反馈，说搜索窗口太大，能否减小窗口尺寸。

    不知这个有没有实现的可能

    Issue #27 · UserZYF/zhang-light

    1 回复
  • 查看全部回帖
abbj
我的小站 https://blog.abbj.top/
回帖
386
 帖子
124
 积分
13934

近期热议

推荐标签 标签

  • JavaScript

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

    729 引用 • 1327 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用，而且功能强大。你无需专门学习，只需看上几眼，就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 611 关注
  • 爬虫

    网络爬虫（Spider、Crawler），是一种按照一定的规则，自动地抓取万维网信息的程序。

    106 引用 • 275 回帖
  • 旅游

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

    90 引用 • 899 回帖
  • Solidity

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

    3 引用 • 18 回帖 • 399 关注
  • JRebel

    JRebel 是一款 Java 虚拟机插件，它使得 Java 程序员能在不进行重部署的情况下，即时看到代码的改变对一个应用程序带来的影响。

    26 引用 • 78 回帖 • 664 关注
  • Firefox

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

    8 引用 • 30 回帖 • 407 关注
  • MongoDB

    MongoDB（来自于英文单词“Humongous”，中文含义为“庞大”）是一个基于分布式文件存储的数据库，由 C++ 语言编写。旨在为应用提供可扩展的高性能数据存储解决方案。MongoDB 是一个介于关系数据库和非关系数据库之间的产品，是非关系数据库当中功能最丰富，最像关系数据库的。它支持的数据结构非常松散，是类似 JSON 的 BSON 格式，因此可以存储比较复杂的数据类型。

    90 引用 • 59 回帖 • 1 关注
  • Maven

    Maven 是基于项目对象模型（POM）、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    186 引用 • 318 回帖 • 303 关注
  • 微信

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

    130 引用 • 793 回帖
  • RESTful

    一种软件架构设计风格而不是标准，提供了一组设计原则和约束条件，主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁，更有层次，更易于实现缓存等机制。

    30 引用 • 114 回帖 • 1 关注
  • JSON

    JSON （JavaScript Object Notation）是一种轻量级的数据交换格式。易于人类阅读和编写。同时也易于机器解析和生成。

    52 引用 • 190 回帖
  • 小薇

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

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

    34 引用 • 467 回帖 • 742 关注
  • IDEA

    IDEA 全称 IntelliJ IDEA，是一款 Java 语言开发的集成环境，在业界被公认为最好的 Java 开发工具之一。IDEA 是 JetBrains 公司的产品，这家公司总部位于捷克共和国的首都布拉格，开发人员以严谨著称的东欧程序员为主。

    180 引用 • 400 回帖
  • CSS

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

    198 引用 • 550 回帖
  • VirtualBox

    VirtualBox 是一款开源虚拟机软件，最早由德国 Innotek 公司开发，由 Sun Microsystems 公司出品的软件，使用 Qt 编写，在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 6 关注
  • 黑曜石

    黑曜石是一款强大的知识库工具，支持本地 Markdown 文件编辑，支持双向链接和关系图。

    A second brain, for you, forever.

    15 引用 • 122 回帖
  • CSDN

    CSDN (Chinese Software Developer Network) 创立于 1999 年，是中国的 IT 社区和服务平台，为中国的软件开发者和 IT 从业者提供知识传播、职业发展、软件开发等全生命周期服务，满足他们在职业发展中学习及共享知识和信息、建立职业发展社交圈、通过软件开发实现技术商业化等刚性需求。

    14 引用 • 155 回帖
  • ZooKeeper

    ZooKeeper 是一个分布式的，开放源码的分布式应用程序协调服务，是 Google 的 Chubby 一个开源的实现，是 Hadoop 和 HBase 的重要组件。它是一个为分布式应用提供一致性服务的软件，提供的功能包括：配置维护、域名服务、分布式同步、组服务等。

    59 引用 • 29 回帖 • 5 关注
  • LeetCode

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

    209 引用 • 72 回帖
  • Ruby

    Ruby 是一种开源的面向对象程序设计的服务器端脚本语言，在 20 世纪 90 年代中期由日本的松本行弘（まつもとゆきひろ/Yukihiro Matsumoto）设计并开发。在 Ruby 社区，松本也被称为马茨（Matz）。

    7 引用 • 31 回帖 • 211 关注
  • 宕机

    宕机，多指一些网站、游戏、网络应用等服务器一种区别于正常运行的状态，也叫“Down 机”、“当机”或“死机”。宕机状态不仅仅是指服务器“挂掉了”、“死机了”状态，也包括服务器假死、停用、关闭等一些原因而导致出现的不能够正常运行的状态。

    13 引用 • 82 回帖 • 53 关注
  • Redis

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

    286 引用 • 248 回帖 • 62 关注
  • 大数据

    大数据（big data）是指无法在一定时间范围内用常规软件工具进行捕捉、管理和处理的数据集合，是需要新处理模式才能具有更强的决策力、洞察发现力和流程优化能力的海量、高增长率和多样化的信息资产。

    93 引用 • 113 回帖
  • 音乐

    你听到信仰的声音了么？

    60 引用 • 511 回帖
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成，还支持通过插件进行扩展。

    10 引用 • 5 回帖
  • 学习

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

    169 引用 • 506 回帖

最新标签