そこに落ちてた帳面

なんか拾った帳面に色々書いてありましたよ

Atomカスタマイズ - Show Invisibles 改行やスペースをもっと見やすくする

AtomのShow Invisiblesオプションを有効にすると改行やスペースが表示されるようになるのだけれど、どうもこのオプションだけでは非常に色が薄く判断しづらいので少しカスタマイズしてみました。

 

手順1

Setting > Editor > Show Invisibleを有効に

f:id:meochika:20170223153004j:plain

 

手順2

Setting > Themes > your stylesheetをクリックして開く

f:id:meochika:20170223154058j:plain

 

手順3

styles.lessの一番下へ以下を追加

@invisible-color: rgba(197, 200, 198, 0.4);

atom-text-editor::shadow {

.indent-guide {
color: @invisible-color;
}

.invisible-character {
color: @invisible-color;
}

}

 

ちなみに今回使用した色

f:id:meochika:20170223170702j:plain

WEB色見本 原色大辞典 - HTMLカラーコード

 

で、こんな感じに

f:id:meochika:20170223171519j:plain

初期値よりはっきりしてるので見やすくなった

 

色は(197,200,198,0.4)の部分で好みにカスタマイズ可能。

パラメーターは( r, g, b, transparency)です。

 

後はご自由に。