FirefoxのuserContent.cssネタ #3

FirefoxのuserContent.cssネタで内輪受けしたネタがあったので久々にエントリに。してみた。なお「某所とネタがかぶってるよ」とか「某所で書いたのを今さら引っ張り出してくるなよ」とかいう苦情は受けつけません。

Mac OS Xのフォームにフォーカスを当てると枠に青く色が付く機能をちょっとだけパクる

input:not([type]):focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="file"]:focus {
  outline: 2px solid #3D80DF !important;
}

outline-styleプロパティを工夫すると見目良くなるかも。borderプロパティではなくてoutineプロパティなのは、borderプロパティに比べてレイアウトを崩す可能性が少ないのと、サイト側のスタイルでのborderプロパティを無視しないようにするためとかそんな理由。-moz-outline-radiousがアンチエイリアスかかったりすればなぁとか。サイト側で予めoutineプロパティでこういった工夫をしているサイトがあるとそれを無視してしまうので!importantは付けない方が良いかもしれない。

そもそもそんな機能はブラウザが基本的に持っていなければならない機能のような気がするように思ったのは自分だけ?

livedoor Readerのフォントを変える

@-moz-document domain("reader.livedoor.com") {
  * {
    font-family: Verdana, sans-serif !important;
  }

  h1, h2, h3, h4, h5, h6, h1 *, h2 *, h3 *, h4 *, h5 *, h6 * {
    font-family: 'Trebuchet MS', sans-serif !important;
  }
}

Arialと日本語が組み合わさってるのはあんまり好きじゃないので。Arialだけとかなら良いんだけど。

livedoor Readerのpre要素を等幅フォントに

@-moz-document domain("reader.livedoor.com") {
  pre, pre * {
    font-family: monospace !important;
  }
}

pre要素は等幅で読みたいよね!」と誰となく言ってみる。

livedoor Readerのサイドバーをコンパクトに

@-moz-document domain("reader.livedoor.com") {
  div#subs_container, div#subs_container * {
    font-size: 11px !important;
  }

  span.treeitem {
    white-space: nowrap !important;
    overflow: hidden !important;
  }
}

サイドバーに表示される項目のタイトルが長いと折り返されてしまうのがちょっと気になる(通常ツリー・コントロールとかは折り返されないので違和感がある)ので。弊害として未読数が見えなくなったりするので、どうしても折り返しが気になるという人だけにしかオススメできない。

CodeZineの右カラムを削除する

@-moz-document domain("codezine.jp") {
  td.tmp_right {
    display: none !important;
  }
}

これは邪魔すぎだろとか思ったので。メインのナビメニューよりでかいとかありえない。ブラウザの横幅によっては本文よりもでかいとかいう。


巷ではStylishというExtensionでuser(Chrome|Content).cssをいじるのが流行りらしい。使ってないけど。再起動無しで反映されるのは良さそうだ。