Scrapboxの新Themeが軒並みバグる
原因はfilter: invert()を使っているせいだと推測してるtakker.icon
default-lightとclassic themeはバグらない
報告出しました
/forum-jp/新しく追加されたThemeでコードの文字選択がバグる
日本語と敬語がやや怪しい
もし変な文体があったら直してくれると助かります
直ったぽい？yosider.icon
書こうとしたら先越されたーtakker.icon
笑
そうみたいです
filter: invert()を使わない方針で実装し直したみたい
syntax highlightの各classに一つづつ色を指定するようになった
/icons/感謝.icontakker.iconyosider.icon
仕事が早い…yosider.icon
応急処置法 (2通り)
以下をUserCSSに追加する
code:css
html {
--invert-color: unset !important;
}
Classic Themeに切り替える
/icons/感謝.iconyosider.icon
今度はsyntax highlightが死んでる！
条件
data-project-themeが<html>に指定されていない
data-project-theme="default"
報告した
/forum-jp/syntax highlightに色がつかない
なんか最近Scrapboxのhackしかやっていない気がするtakker.icon
本業が進まない……
直ってる？yosider.icon
直ってるっぽい！ (@smartphone)takker.icon
背景
Scrapboxの新ThemeのCSSに--invert-colorというカスタムプロパティが導入された
dark themeにおいて、色を反転させるために使用されている
filter: invert(100%)で色反転する
light themeはfilter: invert(0%)が設定されている
詳しい説明は/shokai/Dark Editor CSSが詳しい
ところが、<code>にfilter: invertを適用すると、cursorの座標計算がバグるという問題がある
今回追加された新テーマ全てに--invert-color
実は以前からtakker.iconは把握していた
/shokai/Dark Editor CSSをベースとしたCSSを使っているときにこの現象が起きていた
scrapbox-card-bubbleの位置などもおかしくなっていた
たぶんdiv.cursorの座標計算結果がおかしくなっていたんじゃないか？
そこでなるべく個別に色を指定するようにした/appbirdNotebook-public/Atomっぽい色合いにしたい！をベースに作ったCSSに切り替えて使っていた
とくに報告はしていなかった
全員が全員dark themeを使っているわけではないし
ただ今回のは報告を出すべきだな
標準で提供されているThemeを選んだだけでバグる
/icons/hr.icon
from 2021/01/07
dark themeどうやって実装しているんだろうと思ったら、filter: invert()使っちゃっていたかーtakker.icon
これ使うとインラインコード記法とかがバグるんだよなあ
oh...
バグるとはどんな感じ？
今調査中です
過程：/takker/Scrapboxの新Themeに合わせてUserCSSを組み替える#5ff6c9df1280f00000f8f4b7
dark themeどころか全てのThemeでバグることがわかったtakker.icon
おま環の可能性もなくはない
他の人の動作状況も知りたいです
ほんとだ、コードの文字選択がバグる(Default Dark theme)yosider.icon
--invert-colorが指定された全てのThemeでバグる
/villagepumpはthemeがそもそも指定されていないのでバグらない
バグとは関係ないけど、filterは重いからあんまり使いたくないんですよね...
/icons2/へえ〜.icon