Typora のコードブロックに言語を表示させる
Markdown書くのに、Typora と Boostnote の間を行ったり来たりしている今日この頃
Typora 便利なんですが Qiita や Boostnote みたいにコードブロックの先頭に言語やファイル名を表示してほしい。
標準で入ってる GitHub のテーマ
これを
こうしたい
(GitHubのプレビューにはそんなのついてないよという指摘は横においておく)
ユーザーCSSでカスタマイズ
1. コードブロックの左上に言語を表示させるCSS
.md-fences .CodeMirror.cm-s-inner:not([lang=""]):before { content: attr(lang); color: #eee; background-color: #777; display: inline-block; padding: 2px 4px; }
これを typoraの/themes フォルダに <適応させたいテーマ名>.user.cssという名前で保存
全部のテーマに適応したい場合は
base.user.css特定のテーマだけに適応したい場合は
<テーマ名>.user.css
2. Typoraを再起動する
- Typora 公式のテーマギャラリーにあった Gitlab のテーマに適応させるとこんな感じ
いいかんじ
本当は c : は省略して hoge.c だけ表示させたいけどやり方わからないわ、CSSど素人にはこの辺が限界か
ちなみにTyporaでは言語の後にファイル名入れるときは : の後ろにスペース入れないとコードシンタックス効かないみたい
quiitaではスペース入れると逆に効かなくなる
はてなブログでは:入れた時点でアウトっぽい？
ややこしいわ
