typora多样式代码块实现

typora多样式代码块实现

修改主题下的css文件

1. 找到文件所在位置

2. 在文件中加入以下代码

.blockquote-tuijian {
    border-color: #5bc0de;
    color: #37b3d7;
    background-color: #f4f8fa;
}
.blockquote-jinggao {
    background-color: #fcf8f2;
    border-color: #f0ad4e;
    color: #ee9e33;
}
.blockquote-weixian {
    color: #c42f2b;
    background-color: #fdf7f7;
    border-color: #d9534f;
}

修改typora程序下的main.js文件

1. 文件所在路径为/Applications/Typora.app/Contents/Resources/TypeMark/appsrc/main.js

2. 修改文件下的文件内容(先找到下面的关键字，在其下进行修改–>case o.blockquote)

case o.blockquote:
// 转换开始
if (E(t, n).indexOf("【警告】") != -1 ) {
  // 警告
  return "<blockquote class='blockquote-jinggao'>" + E(t, n) + "</blockquote>";
} else if (E(t, n).indexOf("【说明】") != -1 ) {
  // 推荐
  return "<blockquote class='blockquote-tuijian'>" + E(t, n) + "</blockquote>";
} else if (E(t, n).indexOf("【注意】") != -1 ) {
  // 危险
  return "<blockquote class='blockquote-weixian'>" + E(t, n) + "</blockquote>";
} else { // info 默认格式
  return "<blockquote class='test'>" + E(t, n) + "</blockquote>";
}

case o.blockquote:
// 转换开始
if (h(this).indexOf("【警告】") != -1 ) {
  // 警告
  return "<blockquote " + m(this) + " class='blockquote-jinggao' >" + h(this) + "</blockquote>";
} else if (h(this).indexOf("【说明】") != -1 ) {
  // 说明
  return "<blockquote " + m(this) + " class='blockquote-tuijian' >" + h(this) + "</blockquote>";
} else if (h(this).indexOf("【注意】") != -1 ) {
  // 危险
  return "<blockquote " + m(this) + " class='blockquote-weixian' >" + h(this) + "</blockquote>";
} else { // info 默认格式
  return "<blockquote " + m(this) + " >" + h(this) + "</blockquote>";
}

然后再alfred中设置快捷键

最后的实现效果如下