知名度はあまり高くないけど、個人的に愛用しているエディタ、Bracketsについての自分用メモ。
知名度低さからか、いくらググってもHowToのブログとか日本語文献が殆どないので、ここに残すよ (`・ω・´)
問題
(やや重いという点を除いて)とても素敵なエディタなのだが、1点、どうしても不便を感じる仕様が。
複数ファイルを開くタブのような機能である「作業中ファイル」欄。
これ、ファイルをたくさん開きすぎると邪魔な高さ制限がついていて地味に不便なのだ。
スクロールしないとファイル群全体を見渡せないし、なんかファイル続けて複数閉じる時急に順番変わって閉じ間違えるし… ※Bracketsユーザならきっとわかる。
解決…?
Bracketsの先進的で凄い所でもあるのだが、実はエディタ自体がHTML、CSS等で実装されていて、エディタを開いた状態でF12
キーを押すと、見慣れた画面が出る。ここをいじれば、実はカスタマイズもできる。
でも、私が知らないだけか、このF12
で変更した結果は、次回起動時、維持されない。なんか「Sources」タブから「Save」できそうなボタンもあったが、押しても何も起こらなかった (´・ω・`)
だったら、Brackets内臓のCSSファイルを直接編集しちゃおう!
(もちろんBrackets自身でもできるし、他のでもOK! でもメモ帳はBOMがこわいからイヤ 自己責任で!)
解決!!
BracketsのCSSは、brackets.min.css
というファイルが司ってるみたい。
DevToolsを探してみると、そのパスが載っていたから、それを直接開くよ!
私の場合は
C:\Program Files\Brackets\www\styles\brackets.min.css
だった(`・ω・´)みんなも似たような場所にあると思う…
まずアクセス権
いきなりC:\Program Files\Brackets\www\styles\brackets.min.css
を編集・保存しようとすると、
アクセスが許可されていないので保存できません。そりゃそうよね…
だから、まずファイルに一般ユーザのアクセス権を与える。
- そのファイルを右クリック
- プロパティ→セキュリティ→編集→一般Userのアクセス権許可(フルコントロールとか与える)
いよいよ編集
問題の高さ制限箇所は、セレクタ.open-files-container
の中の、max-height:200px
が原因みたい。
こいつめ!
.open-files-container
のCSSを、より大きいpx等お好みの値に書き替えよう!
【例】
-: max-height:200px
+: max-height:500px
そして、忘れず保存。
ていうか一緒にresize: vertical
も付けると強力(`;ω;´)
あとがき
あ、Bracketsでもvh
(viewport units)とか使えるのかな… 試してないや(´・ω・`)
ともあれ、これでホラ!! 大成功!!!
(会社のWin7パソコン、圧倒的ペイントマウスクオリティ…)
アプデしたら戻っちゃいそうだから、もし戻っちゃったらまたここ見よう。
とりあえずこれで様子見。
追記:そもそもなんでこんな仕様?
私は個人趣味でファイルを1つずつちまちま書く程度の一般素人なのだけど、
IT企業が大規模開発で実用する時は、プロジェクトのフォルダをまるごと開くことが多いみたい。
Bracketsには、フォルダをまるごと「Brackets project」として開く機能がついていて、開いたフォルダは「作業中ファイル」欄の下に表示される。
公式にはそっちの機能の方を推しているようで、そっちの欄の方がメインになることを想定して、「作業中ファイル」欄は小さく表示される設計にしてあるのだろうな、と思ふ(´・ω・`)