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

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

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

链接

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

2 个赞

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

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

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

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

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

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

screenshot-20221023-004043

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

1 个赞

您好,似乎与Auto Link Title连用时可能会产生这样的问题:


可以看到Auto Link Title包含一些符号例如“_”的时候,一整段话会被识别成多个断开的链接。

我尝试了一下,切换到阅读模式就没有任何问题,只有在编辑模式下才会存在这个问题
image

flowus内已修复

还有十分不推荐得意黑作为阅读字体

关于字体您是如何考虑的?我使用得意黑主要考虑的平常中英文混杂的情况比较多,得意黑的中英文比较和谐,看起来不会有比较突兀的情况。


我是用自己做的 Maple-font/README_CN.md at main · subframe7536/Maple-font · GitHub

3 个赞

wow,感谢您的分享,我两相比较试试看。祝您新年快乐,兔年大吉!

动画效果的颜色条有点偏上,我新建了一个库也是这样,更改了电脑屏幕比例也不行,大佬能帮忙修复一下吗? :cry:

这个片段有些旧了,在我的主题里用了另外更好的实现方式,之后有空会重新整理发布出来

1 个赞

多谢多谢!主题里的确实很棒~ :smiley:

我想用现在的主题,所以瞎改了 css 片段,没想到让我试出来了哈哈。

--link-offset: calc(var(--font-text-size) * -1 - var(--size-4-4));

把这一行里面的-1改成-0.3就差不多。

2 个赞

请问下大佬,我想限制 ![[笔记]] 预览笔记时的窗口最大长度,如果超出最大长度则采用滚轮进行预览的形式。但我不太知道 Obsidian的 预览其他笔记窗口 的css样式在哪里,想请教下博主 :two_hearts:

.internal-embed { overflow-y: scroll; max-height: 100px; }
1 个赞