すたすた式
Firefox Windows10
新しい記事を書きました。ver.0.31で使用が変わったようです。フォントの大きさと透過だけですが対応しました。
試行錯誤の結果です。正しいやり方かどうかわかりませんし、何かしらのリスクがあるかもしれません。
userContent.css ファイルを chrome フォルダーに入れる方法です。
環境は、Windows10 64bit , Firefox 65.0.2 64bit , Vim-Vixen 0.20 です。
Windows のメモ帳などで、下のコードをコピペ。
ファイル名 userContent.css 文字コードは UTF-8 で保存。（とりあえずデスクトップとかに）
input,textarea{ime-mode:inactive;} /* IME OFF 初期値英数入力 */ .vimvixen-console-completion { /* o とか t と打つと出てくるやつ */ opacity: 0.8; /* 透過 */ font-size: 16px !important; } .vimvixen-console-completion-item.vimvixen-completion-selected { /* tabキーで選択すると色が変わるところ */ background-color: pink !important; } .vimvixen-console-message { /* エラーメッセージの大きさ */ font-size: 16px !important; } .vimvixen-console-command-prompt { /* コロン: の大きさ */ font-size: 16px !important; } .vimvixen-console-command-input { /* 一番下の入力エリアの文字 */ font-size: 18px !important; }
UTF-8 で保存する
Firefox 右上の3本線（メニュー）から、ヘルプ - トラブルシューティング情報とすすむ。
プロファイルフォルダーの欄の「フォルダーを開く」をクリック
（トラブルシューティング情報までのアクセスは URLバーに about:support と入力してもOK）
開いたプロファイルフォルダーのなかに chrome という名前のフォルダーがなければ新しく作成する（すでにあれば、そのまま）
chromeフォルダーのなかに、先ほど作った userContent.css ファイルを置く。
（すでに userContent.css ファイルがある場合は上記コードを追加すればいいと思います。）
Firefoxを再起動すれば変更が適用されます。
Hint は、拡張機能 stylus をつかっても変更できました。（stylus を使うときは !important は、いりませんでした）
.vimvixen-hint { font-size: 16px !important; }
F12 キー（開発ツール）でスタイルエディターを見ました。（URLバーに about:blank と入れてから調べると余計なものがなくて楽でした）
インラインスタイルシートが3個（3種類）ありました
.vimvixen-console-frame { margin: 0; padding: 0; bottom: 0; left: 0; width: 100%; height: 100%; position: fixed; z-index: 2147483647; border: none; background-color: unset; pointer-events: none; }
.vimvixen-hint { background-color: yellow; border: 1px solid gold; font-weight: bold; position: absolute; text-transform: uppercase; z-index: 2147483647; font-size: 12px; color: black; }
html, body, * { margin: 0; padding: 0; } body { position: absolute; bottom: 0; left: 0; right: 0; overflow: hidden; } .vimvixen-console { bottom: 0; margin: 0; padding: 0; } .vimvixen-console-command-wrapper { border-top: 1px solid gray; } .vimvixen-console-completion { background-color: white; font-style: normal; font-family: monospace; font-size: 12px; line-height: 16px; } .vimvixen-console-completion-title { background-color: lightgray; font-weight: bold; margin: 0; padding: 0; } .vimvixen-console-completion-item { padding-left: 1.5rem; background-position: 0 center; background-size: contain; background-repeat: no-repeat; white-space: pre; } .vimvixen-console-completion-item.vimvixen-completion-selected { background-color: yellow; } .vimvixen-console-completion-item-caption { display: inline-block; width: 40%; text-overflow: ellipsis; overflow: hidden; } .vimvixen-console-completion-item-url { display: inline-block; color: green; width: 60%; text-overflow: ellipsis; overflow: hidden; } .vimvixen-console-message { font-style: normal; font-family: monospace; font-size: 12px; line-height: 16px; border-top: 1px solid gray; } .vimvixen-console-error { background-color: red; font-weight: bold; color: white; } .vimvixen-console-info { background-color: white; font-weight: normal; color: green; } .vimvixen-console-command { background-color: white; display: flex; } .vimvixen-console-command-prompt { font-style: normal; font-family: monospace; font-size: 12px; line-height: 16px; } .vimvixen-console-command-input { border: none; flex-grow: 1; font-style: normal; font-family: monospace; font-size: 12px; line-height: 16px; }
stylus を使っての変更を試しましたが（Hint 以外）うまくいかず、 userContent.css ファイルをつくる方法にしました。
基本的には、変更したいプロパティの値に !important をつけて優先順位を上げるとうまくいくようです。
仕様等、変わるまではこれでいけそうです。
今回フォントの種類については、userContent.css に font-family で個別に指定せず、Firefoxのオプション - 一般にある、言語と外観のフォントと配色の「詳細設定」、等幅(Monospace)から選びました。
サイト内検索に使ってください 🐤
© 2015 すたすた式
Enjoy!👍
QooQ
コメントなし:
コメントを投稿