临时记忆卡片

以前一直没有用过 Anki,这几天看了一下社区里大佬的项目,发现我目前的笔记格式中,并没有办法直接导入 Anki.大批量修改又很麻烦.

而具体 cloze 等各种格式我也还没弄明白, 一个个修改格式太费时间.先自己临时凑合以下.后续再研究研究.

方法很简单,就是改一下 CSS,希望能帮到和我面临相同困境的朋友,

效果演示

属性 memory 随便一个值

image.png

属性 memory=type1 从第二行开始, 双数行鼠标悬浮显示

image.png

属性 memory=type2 从第二行开始, 单数行鼠标悬浮显示

image.png

CSS 代码

粗体和高亮同样达到效果.

暗黑主题最好自己调一下配色. 默认黑暗主题的那几个卡片背景真的没法用,V 姐可以改一下吗 😭@Vanessa

/*memory list 属性设置为memory=todo 时生效*/
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory]>.li[data-subtype=u]:nth-child(2n+3) {
	background:var(--b3-card-success-background)!important;
	border-radius:10px;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory]>.li[data-subtype=u]:nth-child(2n+2) {
	background:var(--b3-card-error-background)!important;
	border-radius:10px;
}
/*type1*/
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type1]>.li[data-subtype=u]:nth-child(2n+3) {
	color: transparent!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type1]>.li[data-subtype=u]:nth-child(2n+3) strong {
	color: transparent!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type1]>.li[data-subtype=u]:nth-child(2n+3) mark {
	background-color: transparent!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type1]>.li[data-subtype=u]:nth-child(2n+3):hover {
	color:var(--b3-theme-on-background) !important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type1]>.li[data-subtype=u]:nth-child(2n+3):hover strong {
	color: var(--b3-protyle-inline-strong-color)!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type1]>.li[data-subtype=u]:nth-child(2n+3):hover mark {
	background-color: var(--b3-protyle-inline-mark-background)!important;
}
/*type2*/
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type2]>.li[data-subtype=u]:nth-child(2n+2) {
	color: transparent!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type2]>.li[data-subtype=u]:nth-child(2n+2) strong {
	color: transparent!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type2]>.li[data-subtype=u]:nth-child(2n+2) mark {
	background-color: transparent!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type2]>.li[data-subtype=u]:nth-child(2n+2):hover {
	color: var(--b3-theme-on-background) !important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type2]>.li[data-subtype=u]:nth-child(2n+2):hover strong {
	color: var(--b3-protyle-inline-strong-color)!important;
}
.list[data-subtype=u][data-type=NodeList][data-node-id][custom-memory=type2]>.li[data-subtype=u]:nth-child(2n+2):hover mark {
	background-color: var(--b3-protyle-inline-mark-background)!important;
}

广告 我要投放

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • crowds21
    订阅者 作者

    我每次偷懒的法子,不管啥软件参照默认的主题, 觉得深了往上往左拉一点,觉得潜了往右往下拉一点. 要是观感还是不好,就加点透明度. 这么调一下还挺快的.

    image.png

    这四个背景色辨识度实在太低了,一眼看过去完全分不清.

    image.png

    image.png

  • 其他回帖
  • Vanessa
    订阅者

    哈哈,调不出来,给两个颜色参考下呗

    2 回复
  • crowds21
    订阅者 作者

    如果写一些需要记忆的东西,格式还是直接参考 AnkiSiyuan Clouder0/AnkiSiyuan: A tool to link Anki & Siyuan. (github.com)比较好

    毕竟正经工具帮你记忆和自己硬背效果是有差距的.

    1 操作
    crowds21 在 2021-09-19 21:02:09 更新了该回帖
  • crowds21 1 3 评论
    订阅者 作者
        --b3-card-error-background: #dd9a92AA;
        --b3-card-warning-background: #f8b254AA;
        --b3-card-info-background: #6bc0ffAA;
        --b3-card-success-background: #95e495AA;
    

    image.png

    image.png

    第一个是调整后的,第二个是原来的. 😳

    前景色没改过么? 你是设计师?
    Vanessa
    @Vanessa 不是,学生. 我就纯粹觉得默认颜色看着眼睛难受.因为这四个我自己用的比较多
    crowds21
    谢谢,下个版本改进
    Vanessa