引用标注

这是一个更新,它使组件现代化并带来了富文本编辑器支持!:rocket:
它可能需要一些润色或存在未预料到的边缘情况,但我认为它是一个不错的良好开端。:folded_hands:

简而言之

富文本编辑器

我们来谈谈富文本编辑器以及可以期待什么!

创建提示框:

您有四种方法来插入提示框:

  • 键盘快捷键
  • 工具栏
  • 输入规则
    • /callout\u003c:type\u003e
    • !!\u003ctype\u003e
  • 粘贴支持
    视频

编辑提示框

编辑提示框的控件仅在您事先选中它时才会出现。

  • 类型选择器
    点击图标后,会出现一个浮动菜单。
  • 自定义标题
    支持行内格式和表情符号
  • 折叠
    将提示框设置为可折叠。可以从选项菜单中访问。
    视频

组织提示框

  • 移动控件

    • 桌面
      有一个手柄可以拖放提示框。
    • 触摸设备
      您可以将提示框上下移动或将它们嵌套到相邻的提示框中。默认情况下它是禁用的,以避免视图中出现冗余,因为您不会经常这样做。您可以在选项中切换它。
    视频

  • 键盘导航
    这有助于更轻松地进出嵌套的提示框。
    此版本中的行为一致性可能需要在将来进行一些调整。

    • \u003ckbd\u003e←\u003c/kbd\u003e 在标题的开头,提示框选择器将自动打开。
    • \u003ckbd\u003e ↑\u003c/kbd\u003e \u003ckbd\u003e ↓\u003c/kbd\u003e 在没有要着陆的段落的提示框正文中,它会创建一个段落;如果您以空内容退出,则该段落将被移除。
    • 在标题内按 \u003ckbd\u003eEnter\u003c/kbd\u003e 会将光标移到正文(并在必要时创建一个)。
    视频

  • 点击插入

    • 在没有段落的区域,您可以点击内部以打开一个段落。
    • 如果您愿意,也可以使用按钮在提示框内部或外部打开一个段落。
      视频

可能稍后我会寻找:

  • 输入规则自动完成
  • 使用现代 CSS 改进颜色,以确保一致性和可见性,尤其是在深色模式下。
  • 我希望删除所有设置,首先关注简洁性,仅通过 CSS 实现高级自定义,但现在已经太晚了 :rofl:

特别感谢 Moin 提供反馈。

就是这样。请告诉我您的想法。非常欢迎反馈!

7 个赞