Typora コードブロックのカラーマッチングとタイトルシリアル番号実装コード

/*タイトルに自動的にシリアル番号が追加されます*/
.サイドバーコンテンツ{
    カウンターリセット:h1
}

.アウトライン-h1 {
    カウンターリセット:h2
}

.アウトライン-h2 {
    カウンターリセット: h3
}

.アウトライン-h3 {
    カウンターリセット:h4
}

.アウトライン-h4 {
    カウンターリセット: h5
}

.アウトライン-h5 {
    カウンターリセット: h6
}

.outline-h1>.outline-item>.outline-label:before {
    カウンター増分: h1;
    コンテンツ: カウンター(h1) " "
}

.outline-h2>.outline-item>.outline-label:before {
    カウンター増分: h2;
    コンテンツ: counter(h1) "."counter(h2) " "
}

.outline-h3>.outline-item>.outline-label:before {
    カウンター増分: h3;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) " "
}

.outline-h4>.outline-item>.outline-label:before {
    カウンター増分: h4;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) "."counter(h4) " "
}

.outline-h5>.outline-item>.outline-label:before {
    カウンター増分: h5;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) "."counter(h4) "."counter(h5) " "
}

.outline-h6>.outline-item>.outline-label:before {
    カウンター増分: h6;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) "."counter(h4) "."counter(h5) "."counter(h6) " "
}

＃書く {
    カウンターリセット:h1
}

h1 {
    カウンターリセット:h2
}

h2 {
    カウンターリセット: h3
}

h3 {
    カウンターリセット:h4
}

h4 {
    カウンターリセット: h5
}

h5 {
    カウンターリセット: h6
}

#h1:before {を記述する
    カウンター増分: h1;
    コンテンツ: カウンター(h1) " "
}

#h2:before {を記述する
    カウンター増分: h2;
    コンテンツ: counter(h1) "."counter(h2) " "
}

#h3:before を記述します。
h3.md-focus.md-heading:前

    {
    カウンター増分: h3;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) " "
}

#h4:before と記述し、
h4.md-focus.md-heading:before {
    カウンター増分: h4;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) "."counter(h4) " "
}

#h5:before と記述し、
h5.md-focus.md-heading:before {
    カウンター増分: h5;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) "."counter(h4) "."counter(h5) " "
}

#h6:before と記述し、
h6.md-focus.md-heading:前{
    カウンター増分: h6;
    コンテンツ: counter(h1) "."counter(h2) "."counter(h3) "."counter(h4) "."counter(h5) "."counter(h6) " "
}

#write>h3.md-focus:before,
#write>h4.md-focus:before,
#write>h5.md-focus:before,
#write>h6.md-focus:before,
h3.md-focus:前、
h4.md-focus:前、
h5.md-focus:前、
h6.md-focus:before {
    色: 継承;
    境界: 継承;
    境界線の半径: 継承;
    位置: 継承;
    左: イニシャル;
    フロート: なし;
    上: 初期;
    フォントサイズ: 継承;
    パディング左: 継承;
    パディング右: 継承;
    垂直方向の位置合わせ: 継承;
    フォントの太さ: 継承;
    行の高さ: 継承;
}
/*テーマによってコードブロックが異なるため、コード部分は統一されています*/
.CodeMirror行{
    左パディング: 4px;
}

.code-tooltip {
    ボックスの影: 0 1px 1px 0 rgba(0,28,36,.3);
    上境界線: 1px 実線 #eef2f2;
}

.md-フェンス、
コード、
{
    背景色: #f8f8f8;
    境界線の半径: 3px;
    パディング: 0;
    パディング左: 4px !重要;
    パディング右: 4px !重要;
    フォントサイズ: 0.9em;
}

コード {
    背景色: #f3f4f4;
    パディング: 0 2px 0 2px;
}

.md-フェンス {
    下部マージン: 15px;
    上マージン: 15px;
    パディング上部: 8px;
    パディング下部: 6px;
}


.md-タスクリスト項目 > 入力 {
  左マージン: -1.3em;
}

@media 印刷 {
    html{
        フォントサイズ: 13px;
    }
    テーブル、
    前 {
        ページ区切り内部: 回避;
    }
    前 {
        単語折り返し: 単語を区切る;
    }
}

.md-フェンス {
	背景色: #f8f8f8;
}
#pre.md-meta-block {を記述する
	パディング: 1rem;
    フォントサイズ: 85%;
    行の高さ: 1.45;
    背景色: #f7f7f7;
    境界線: 0;
    境界線の半径: 3px;
    色: #777777;
    上マージン: 0 !重要;
}

.mathjax-block>.code-tooltip {
	下部: .375rem;
}



/*暗い背景*/

# .md-fences:not([mermaid-type]) と記述します。
    上部パディング: 7px;
    境界線の半径: 10px;
    背景色: #282c34;
    色: #eeeeee;
}

.code-tooltip .ty-input,
.code-tooltip 入力 {
    色: #eee;
}


/*MAC の 3 つのアイコン*/
.CodeMirror-wrap .CodeMirror-scroll {
    パディング上部: 20px;
}

#.md-fences:before {を記述します
    コンテンツ： "";
    zインデックス: 4;
    表示: ブロック;
    位置: 絶対;
    上: 7px;
    左: 13px;
    幅: 15px;
    高さ: 15px;
    境界線の半径: 50%;
    フロート: 左;
    背景色: #fa3534;
}

# .CodeMirror-scroll:before {を記述します
    コンテンツ： "";
    表示: ブロック;
    位置: 絶対;
    上: 0px;
    左: 29px;
    幅: 15px;
    高さ: 15px;
    境界線の半径: 50%;
    フロート: 左;
    zインデックス: 999;
    背景色: #ff9900;
}
#write .md-fences::after {
    コンテンツ： "";
    zインデックス: 4;
    表示: ブロック;
    位置: 絶対;
    上: 7px;
    左: 53px;
    幅: 15px;
    高さ: 15px;
    境界線の半径: 50%;
    フロート: 左;
    背景色: #19be6b;
}

/*色*/
.CodeMirror-line .cm-number,/*number*/
.CodeMirror-line .cm-property{/*呼び出されたメソッド*/
    色: #f08d49;
}
.CodeMirror-line .cm-variable-3,/*パラメータ、型*/
.CodeMirror-line .cm-qualifier,/*css クラス*/
.CodeMirror-line .cm-variable-2{/*使用されるパラメータ*/
    色: #FFCB6B;
}
.CodeMirror-line .cm-meta,/*省略記号、コメントなど*/
.CodeMirror-line .cm-atom,/*css属性値、ブール値など*/
.CodeMirror-line .cm-keyword{/*キーワード*/
    色: #cc99cd;
}
.CodeMirror-line .cm-def,/*変数名*/
.CodeMirror-line .cm-variable{/*使用する変数名*/
    色: #FFCB6B;
}
.CodeMirror-line .cm-builtin{/*呼び出される属性*/
    色: #82AAFF;
}
.CodeMirror-line .cm-comment{/*コメント*/
    色: #888;
}
.CodeMirror-line .cm-string,/*文字列*/
.CodeMirror-line .cm-string-2{/*正規表現*/
    色: #7ec699
}
.CodeMirror 行 .cm 演算子 {/*演算子*/
    色: #67cdcc
}
.CodeMirror div.CodeMirror-cursor{/* カーソル */
    左境界線: 1px 実線 #fff;
    zインデックス: 3;
}
.CodeMirror-selected,/*選択された背景*/
.CodeMirror-選択されたテキスト{
    背景: #666 !重要;
}

/*html*/
.CodeMirror-line .cm-tag{/*タグ名*/
    色: #F07178;
}
.CodeMirror-line .cm-bracket{/*タグ山括弧*/
    色: #FFF;
}
.CodeMirror-line .cm-attribute{/*属性*/
    色: #FFCB6B;
}