/suto3/UserCSS:朱書き記法

generated at 11/17/2024, 10:57:43 AM
UserCSS:朱書き記法
文字を赤くする記法。
校正（訂正・添削）などの目的で、文字色を変更する。
校正色 1
校正時に主に使う色
通常は 赤色
文字色、背景色と明確に区別できる色を使う
校正色 2
校正色 1の補助
通常は青色
校正色 3
校正色 1および校正色 2の補助
校正色 1および校正色 2では不都合な場合に用いる（めったに使わない）
校正色 0
校正色 を補助する目的で使う色

style.css:root{
  --pen-color-0: white;
  --pen-color-1: rgba(255,32,32,0.9);
  /* --pen-color-2: rgba(32,32,255,0.8); /* */
  --pen-color-2: var(--main-color, blue);
  --pen-color-3: rgba(32,224,32,0.9);
}

 朱書き記法のテスト テスト テスト
style.css/* 校正色 1 */
.deco-\# {
  color: var(--pen-color-1);
}
.deco-\# a {
  --page-link-color: var(--pen-color-1); /* リンクの色分けをしない */
  --empty-page-link-color: var(--pen-color-1);
  color: var(--pen-color-1);
}
/* 校正色 2 */
.deco-\~ {
  --page-link-color: var(--pen-color-2);
  --empty-page-link-color: var(--pen-color-2);
  color: var(--pen-color-2);
  /* background-color: var(--pen-color-2);*/
}
/* 校正色 3 */
.deco-\% {
  --page-link-color: var(--pen-color-3);
  --empty-page-link-color: var(--pen-color-3);
  color: var(--pen-color-3);
}

 [# テキスト]  で校正色 1
 [#* 太字]  で太字（ボールド）
 [#/ 斜体文字] で斜体（イタリック）
 [#- 打ち消し]  で打ち消し線（ストライキ）
 [#_ 下線]  で下線（アンダーライン）
 [#** 強調]  で強調　強調　強調
 [~ テキスト]  で校正色 2
 [~* 太字]  で太字（ボールド）
 [~/ 斜体文字] で斜体（イタリック）
 [~- 打ち消し]  で打ち消し線（ストライキ）
 [~_ 下線]  で下線（アンダーライン）
 [% テキスト]  で校正色 3
 [%* 太字]  で太字（ボールド）
 [%/ 斜体文字] で斜体（イタリック）
 [%- 打ち消し]  で打ち消し線（ストライキ）
 [%_ 下線]  で下線（アンダーライン）

校正書きを隠す（中途半端だけど、まあいいか）
stylexx.css.line:not(.cursor-line) .deco-\#:not(:hover) {
   color: transparent;
   background-color: transparent;
}
.line:not(.cursor-line) .deco-\~:not(:hover) {
   color: transparent;
   background-color: transparent;
}
.line:not(.cursor-line) .deco-\%:not(:hover) {
   color: transparent;
   background-color: transparent;
}

朱書き
UserCSS:マーカー記法
UserCSS:文字装飾記法