はてブの新しい画面が見にくい

はてブ

慣れるまで時間がかかりそう。慣れてそのまま使うか、我慢できずにいじるか、どっちか微妙な感じ。
とりあえず、もやもやをStylishで解消できるか挑戦。


まず使用前。

そして使用後。

なんかごちゃごちゃしてスッキリしないですな。だめか。


やった内容。

  • タイトルを小さくした
    • でかすぎると思ったから
  • ドメインの表示を目立たないようにした
    • リンクはリンクの色!!ってことなんだろうけど、めざわりだったから
  • **usersの左のアイコン消した
    • どう見てもただの飾りです
  • **usersの表示をコメントの枠の上にオーパラップ
    • 1行つかうのもったいなくて
  • 編集アイコンをでかくしてhoverしたときに色つけ
    • 16x16は小さすぎて押しにくいし、×ボタンが隣にあるくせに、どっちが押されるかはっきりわからない
  • B!アイコンを消した
    • 邪魔だったからhoverしたときだけ表示
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("b.hatena.ne.jp") {
div.main h3 { font-size:100% !important; }
#bookmarked_user h3 a.domain { color:#999 !important; }
#bookmarked_user li.category { display:none !important; }
#bookmarked_user li.users { position:absolute; margin-top:0px !important; 
left:42px; z-index:1; background-color:#fff !important; 
font-size:8pt !important; }
li.users { background-image:none !important; padding:1px 4px !important; }
#bookmarked_user li.addbookmark { position:absolute; 
margin-top:-1.5em !important; right:22px; visibility:hidden; }
#bookmarked_user li:hover li.addbookmark { visibility:visible; }
img.inplace-edit-icon { position:absolute; margin-top:-8px !important; 
width:40px; height:32px; }
img.inplace-edit-icon:hover { background-color:#fd6; }
}