登录 注册

思源笔记挂件丨终于能在笔记里插入倒数日了

Github repo：Achuan-2/siyuan-widget-dayCounter

💌 缘起

一直都很馋 wolai 的动态日历图标，苦于思源笔记没有相关挂件，于是在 GPT 的帮助下，我开发了一个倒数日挂件

由于前端基础很薄弱，对思源笔记的 API 调用也不熟悉，到处拼贴竟然成功了哈哈哈，还是很佩服自己的。

✨ 界面预览

Clip_2024-04-06_04-21-58

结合分栏，可以集合多个倒数日

Clip_2024-04-06_04-29-37

‍

🐯 主要功能

  • 支持指定日期，动态进行倒数和正数日计算，依赖 js 代码，不依赖网络，支持添加具体事件名称

    • 如果指定日期早于当天日期，则正数
    • 如果指定日期晚于当天日期，则倒数

  • 支持设置背景色，进行一定美化

  • 配置支持自动保存到思源笔记的块属性，永久保留在笔记里

  • 支持导出模板后加载配置，方便重复调用特定倒数日/正数日

Clip_2024-04-06_04-20-39

🐛 已知问题

  • 设计的文字比较大，挂件块不适合调得太小，事件名称不适合写的太长（不过一般也不会写太长吧？）
  • 设置颜色 Color Picker 不支持粘贴颜色
  • 为了保证初次加载挂件和模板能正常保存和读取块属性，加了 500ms 的延迟，所以显示会比较慢些

如果知道以上问题如何解决的大佬欢迎告知，感激不尽

❤ 致谢

☎️ 意见交流

欢迎在 Github 提 issue 或是通过邮箱联系我

如果你喜欢这个挂件，欢迎在爱发电给我买包辣条，这会激励我更新和完善挂件

  • 思源笔记

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

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

    18829 引用 • 70486 回帖
7 操作
Achuan-2 在 2024-04-06 05:10:39 更新了该帖
Achuan-2 在 2024-04-06 04:32:14 更新了该帖
Achuan-2 在 2024-04-06 04:30:59 更新了该帖
Achuan-2 在 2024-04-06 04:30:05 更新了该帖 Achuan-2 在 2024-04-06 04:20:55 更新了该帖 Achuan-2 在 2024-04-06 03:43:26 更新了该帖 Achuan-2 在 2024-04-06 03:40:36 更新了该帖
上海 位置
9 感谢
1 收藏
3 赞同
7 操作
5 回帖
2
217 180 3 30 2 1

相关帖子

5 回帖
思源笔记挂件丨终于能在笔记里插入倒数日了

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • javad78 •
    付费者

    真不错！👍

  • 其他回帖
  • Achuan-2 •
    订阅者 先知 作者

    如果需要用超级块拍横排多个挂件，目前思源并不支持垂直居中，可以自己添加 css 代码片段

    /* 横向超级块中图片和挂件垂直居中 */
.protyle-wysiwyg  .sb[data-sb-layout="col"]:has(.img),
.protyle-wysiwyg  .sb[data-sb-layout="col"]:has(.iframe){
        align-items: center;
}
/* 防止用自定义emoj的纯文本段落也垂直居中 */
.protyle-wysiwyg  .sb[data-sb-layout="col"]:has(.img[style="max-width: 30px;"]){
        align-items: start;
}

    启用前

    Clip20240406174648.png

    启用后

    Clip20240406174708.png

    希望后续思源能提供横向排版垂直布局的设置：横向超级块建议添加垂直布局选项 · Issue #10906 · siyuan-note/siyuan (github.com)

    2 操作
    Achuan-2 在 2024-04-06 18:48:19 更新了该回帖
    Achuan-2 在 2024-04-06 18:41:18 更新了该回帖
  • Achuan-2 •
    订阅者 先知 作者

    v0.05 支持周期倒数设置

    • 年：指定每年几月几号的事件
      • 注：如果设置日期为闰年的 2 月 29 日，则下一周期为四年后的 2 月 29 日
    • 月：指定每月几号的事件（只支持每月 1-28 号和月末设置）
      • 注：如果设置日期为当月的月末，则自动为每月月末，例如设置日期为 2024 年 2 月 29 日，则自动改为 2024 年 4 月 30 日；如果设置日期为 2024 年 1 月 29 日，到 2024 年的 4 月事件就变为了 4 月 30 日。
    • 周：指定每周几的事件

    Clip20240410192256.png

  • DataWealth •
    订阅者 恶龙

    必须狠狠支持！期待更多 GTD 相关的功能

  • 查看全部回帖
Achuan-2
给时间以生命而不是给生命以时间，个人博客https://www.achuan-2.top/ 上海
回帖
565
 帖子
191
 积分
780