VScodeのショートカットキーあんまり覚えてないけど毎回Ctrl+K Ctrl+Rでショートカットのヘルプを開くのもめんどくさいなぁ…
ということでVScodeの背景に常に薄っすらショートカット一覧が表示されるようにしました。
拡張機能を勝手にインストールできない会社の業務用PCでも使えるよう拡張機能は使わず実現します。
表示例
こんな感じで表示されます。
日本語版のVScodeショートカット一覧はこちらの画像に階調反転・透過処理したものを使わせていただきました。
使用するショートカット一覧画像
※透過処理・階調反転・透明度調整済のためほぼ真っ白に見えます
表示手順: CSSを編集する
注：CSS編集前にファイルのバックアップを取っておくことをおすすめします。
ファイルを書き換えた後は、VScode立ち上げ時に以下のような警告がでるようになります。
表示が出るだけで私は特に不具合なく使えていますが、CSSの編集は自己責任でお願いします。
-
workbench.desktop.main.cssを開く
VScodeインストール先の\Microsoft VS Code\resources\app\out\vs\workbench\workbench.desktop.main.cssに入っているはずです。 -
末尾に以下の設定を追加
.monaco-editor,.monaco-editor-background {
background: url(画像ファイルのパス) no-repeat;
background-position:right top;
background-size:contain;
}
これでエディター部分に背景画像が表示されるようになるはずです。
おまけ
上記では画像自体に透明度調整をかけていますが、普通に手持ちの風景画像とかを表示したい場合はCSSで透明度調整することになると思います。
その場合はopacityを設定して透明度を調整するとよいと思います。opacity: 0.7;くらいがちょうどいいかも？
ただ、この場合はエディター部分全体が薄っすら透明になるので背景以外の文字なども多少見た目が変わります。
拡張機能を使うのであれば「壊れている可能性が～」の警告も出ませんし、透明度の設定も不要になるので、何らかの理由で拡張機能を入れられないという人以外は素直に拡張機能を使うのがベターだと思います。
一応、拡張機能を使って背景画像にショートカット一覧を表示したいという人向けに不透明度調整なしの画像も貼っておきます。※これもほぼ真っ白に見えると思います
