[1.0船新版本 CSS 片段系列] 链接美化

不同于之前的花里胡哨,这次比较简单

  1. 换行不会导致动画错位
  2. 内外链接、相应符号颜色设置
  3. 添加前置图标,隐藏外链后置图标
  4. style setting可选在live preview时点击链接进行编辑

链接

详细介绍和片段在 语雀 / flowus

大佬能否实现一下, 内链也带跳转符号(最好是换一个跟外链不一样的), 然后点击链接能直接修改链接名字, 只有点击跳转符号才进行跳转.

css只能实现带个符号,不能缩小点击范围,得写插件

似乎是可以的,blue topaz主题就实现了只有点击符号才能跳转(点击链接直接编辑链接名),但自从v1.0我就回到默认主题加简单css片段了, 倒是这个功能还挺想继续使用的.

试了一下,功能可以实现,但是hover的动画效果会丢失,不在意的话可以加上这个实现

.cm-link .cm-underline,
.cm-hmd-internal-link .cm-underline {
  pointer-events: none;
}
1 个赞

有个小问题,脚注会被识别成外链。就是文末的 [^1]: ,会带外链图标,显示橙色,鼠标上移橙色字体还会被覆盖,导致看不见字。大佬有空改改 :face_holding_back_tears:

screenshot-20221023-004043

修复了一下,脚注现在可以选择颜色了

1 个赞