いさぢちんメモ

d.hatena.ne.jp/mosshm/より移行。

はてブの糞すぎるレイアウトをとりあえずどうにかするusercss

はてなブックマークのエントリーページを改良しました - はてなブックマーク日記 - 機能変更、お知らせなど

一覧性云々はともかく、エントリページがとにかく見難いので。

@charset "utf-8";
/* Name: はてブ*/
div#container {min-width:0px!important;}
.curvebox-body {padding-right:20px!important;}
div#sidebar,div#ad {display:none!important;}
  • min-widthを止めて
  • いらん物を消して
  • div#mainがちゃんと横幅広がるように

すっきり。

ついでにいろいろ消す

div#add-bookmark-container {display:none!important;} /*あなたのブックマーク*/
div#favorite-bookmarks {display:none!important;} /*お気に入りユーザーのブックマーク*/
div#scored-bookmarks {display:none!important;} /*人気のブックマークコメント*/
div#new-bookmarks {display:none!important;} /*新着ブックマークコメント*/ 

div#referrers {display:none!important;} /*このエントリーを含むエントリー*/
div#reldiary {display:none!important;} /*このエントリーを含む日記*/

div#footer {display:none!important;} /*フッタ*/

あなたのブックマークと人気のブックマークコメントを消すだけでもかなりさっぱりする。
div#new-bookmarksを消すとmode=moreのコメントも表示されなくなるので、そこまで消す必要はないけど。

1行ブコメとアイコン縮小

ul.bookmark-list .comment {display:inline!important;}
ul.bookmark-list .header {display:inline!important;}
ul.bookmark-list img.profile-image {
	width:16px!important;
	height:16px!important;
	margin-left:-20px!important;
}
ul.bookmark-list li {padding-left:30px!important;}

編集と削除のボタンを:hoverで表示するように。

img.inplace-edit-icon,
img.inplace-delete-icon {display:none!important;}
li:hover img.inplace-edit-icon,
li:hover img.inplace-delete-icon {display:inline!important;}

一行コメントにならなくなっていたので、ul.bookmark-list .header {display:inline!important;} を追加。
編集・削除ボタンの:hoverを少し修正。

スクリーンショット

こんな感じ。