はてなブックマークリニューアル用設定

ユーザスタイルシート

不要な情報表示を削ったもの。Opera で動作確認。
http://img.f.hatena.ne.jp/images/fotolife/u/underthemoon/20081129/20081129012532.png


/* ユーザページ (id="hatena-bookmark-user") */

html,body,tr,td,th,a,p,div {
	font-family:メイリオ !important;
	line-height: 170% !important;
}

div.main {
	padding:20px 20px 40px 20px !important;
	}

/* リンク基本色 */
a {
	text-decoration: none !important;
	}

a:hover {
	color:#FF479F !important;
	text-decoration: none !important;
	}




/* ヘッダタイトル */
div#user-header h2 {
	font-size: 18px !important;
	letter-spacing: 3px;
	font-weight: normal !important;
	font-family: "Lucida Sans Unicode" !important;
	}


/* はてなブックマーク > underthemoon bookmark */
.breadcrumbs {display: none;}

/* ユーザーアイコン消し */
.profile-icon {display: none;}
.profile-image {display: none;}
li.followers {display: none;}


/* お気に入りユーザ表示消し */
ul.threshold li {
	color: #fff !important;
	}

ul.threshold li a {
	color: #fff !important;
	background-color: #fff !important;
	}

ul.threshold li.selected {
	background: url() left top no-repeat !important;
}

ul.threshold li.selected a {
	background: url() right top no-repeat !important;
}

/* ブックマーク/お気に入り/コレクション タブ */
.user-module a,
.user-bookmark a {
	color: #333 !important;
	}




/* ブックマークエントリ */
h3 a {
	font-size: 15px !important;
	color:#333 !important;
	text-decoration: none !important;
	line-height: 150% !important;
	}


/* ドメイン */
.domain {
	font-size: 12px !important;
	color: #bbb !important;
	/* ドメイン右寄せ */
	/* float: right !important; */
	}



/* カテゴリ消し */
li.category {display: none !important;}

/* ブックマークユーザ名消し */
/*.username {display: none !important;}*/


.curvebox-header {
	background-color: #CCC !important;
	}


/* コメントボックス CURVE BOX BLUE {{{ */
div.curvebox-body {
	border: 1px dotted !important;
	padding: 4px !important;
	border-color: #ccc !important;
	background: #fff !important;
}

div.curvebox-lb-bottom,
div.curvebox-lb-header,
div.curvebox-color-bottom,
div.curvebox-color-header,
div.curvebox-gray-bottom,
div.curvebox-gray-header,
div.curvebox-bottom,
div.curvebox-header {
	background: url() no-repeat right top !important;
}

div.curvebox-lb-bottom div,
div.curvebox-lb-header div,
div.curvebox-color-bottom div,
div.curvebox-color-header div,
div.curvebox-gray-bottom div,
div.curvebox-gray-header div,
div.curvebox-bottom div,
div.curvebox-header div {
	background: url() no-repeat right top !important;
}

#bookmarked_user li div.curvebox-header {
	margin-top: 0 !important;
	}

div.curvebox-bottom {margin-bottom: -10px !important; }


/* コメント編集欄 */
.inplace-form input {
	font-family: メイリオ !important;
	font-size: 13px !important;
	}

.inplace-form input.comment {
	width: 75% !important;
	}

.bookmark-appender-cancel {
	font-family: メイリオ !important;
	}



/* コメントタグ */
span.tags {color: #fff !important;}
span.tags a {color: #db2abff !important;}

/* コメントフォント */
span.comment {
	font-family: メイリオ !important;
	color: #555 !important;
	}

span.delete-bookmark {
	font-family: メイリオ !important;
	color: #333 !important;
	}




/* ID & タグ タイトルバー (緑色) */
div.sidebar div.hatena-module-title {
	background: transparent url() top left no-repeat !important;
}

div.hatena-module-title h3 {
	font-family: メイリオ !important;
	color: #555 !important;
	}

div.sidebar div.hatena-module-body {border-top: 1px solid #ccc !important;}


/* ブックマークユーザ数 */

.users {font-size: 10px !important;}

strong a:link,
strong a:hover,
strong a:visited {
	color: #FF479F !important;
	background: #FFF !important;
	font-weight: normal !important;
}

em a:link,
em a:hover,
em a:visited {
	color: #FF479F !important;
	background: #FFF !important;
	font-weight: normal !important;
}

.users a {color: #999 !important;}
.users a:hover {color:#FF479F !important;}

/* ユーザー回りこみ */
/*	li.users {float: right !important;}	*/




/* 日時 */
span.timestamp {
	color: #aaa !important;
	float: right !important;
	}


/* ブックマーク数＆お気に入られ フォント */
span.label {
	color: #333 !important;
	font-family: メイリオ !important;
	font-weight: normal !important;
	}
.hatena-module-body a {color: #333 !important; }
.hatena-module-body a:hover {color:#FF479F !important; }

/* ブックマーク数ファビコン消し */
.users {
	background:url() no-repeat left center !important;
	}



/* タグクラウド */
a.tag {
	font-family: "Times New Roman" "Trebuchet MS" メイリオ !important;
	color: #555 !important;
	}

a:hover.tag {
	color:#FF479F !important;
	}

ul.tag-cloud li.tag-cloud-size-0 a { color: #949494 !important;}
ul.tag-cloud li.tag-cloud-size-1 a { color: #8a8a8a !important;}
ul.tag-cloud li.tag-cloud-size-2 a { color: #808080 !important;}
ul.tag-cloud li.tag-cloud-size-3 a { color: #767676 !important;}
ul.tag-cloud li.tag-cloud-size-4 a { color: #6c6c6c !important;}
ul.tag-cloud li.tag-cloud-size-5 a { color: #626262 !important;}
ul.tag-cloud li.tag-cloud-size-6 a { color: #585858 !important;}
ul.tag-cloud li.tag-cloud-size-7 a { color: #4e4e4e !important;}
ul.tag-cloud li.tag-cloud-size-8 a { color: #444444 !important;}
ul.tag-cloud li.tag-cloud-size-9 a { color: #3a3a3a !important;}
ul.tag-cloud li.tag-cloud-size-10 a { color: #303030 !important;}

ul#related-tags li {
	font-size: 17px !important;
	line-height: 130% !important;
	}


/* 次のn0件 */
div.pager {font-size: 11px !important;}
div.pager a {color: #333 !important;}
div.pager a:hover {color:#FF479F !important;}

/* feed消し */
div.feed {display: none !important;}


/* 検索フォーム */
div#user-search-area input {
	font-family:メイリオ !important;
	width: 150px;
	}

/* 検索結果 */
.result-window a.url,
.result-window a.url:hover,
.result-window a.url:visited,
.result-window a.url:link
	{
	color: #aaa !important;
	}

.result-window a.user {
	color: #999 !important;
	}

.result-window h3 a {font-size: 14px !important;}

.result-window {
	width: 600px !important;
	/*height: 600px !important;*/
	/* Opera用 検索ポップアップ位置修正 */
	position: absolute !important;
	Top: 80px !important;
	border:6px solid #ddd !important;
	font-size: 14px !important;
	}

.result-window div.pager span.shown {
	color: #333 !important;
}

.result-window div.progress-bar {
	height: 5px;
	background-color: #bbb !important;
	width: 0%;
	font-size: 1px;
	line-height: 0;
}


/* コレクション */
#bookmarked_asin	{
	margin: 2px !important;
	overflow: visible !important;
	}

#bookmarked_asin li {
	width: 150px !important;
	margin: 0px !important;
	padding: 5px !important;
	overflow: visible !important;
	}

#bookmarked_asin li a.thumbnail {
	width: 150px !important;
	height: 150px !important;
	margin-bottom: 0px !important;
	overflow: visible !important;
	}

#bookmarked_asin li span.users {
	display: none !important;
	}




/* ---------- 旧ブックマークレット用 (b.hatena.ne.jp/add?mode=confirm) ---------- */

/* 全体の横幅 */
body#hatena-bookmark-bookmarklet {
	font-size: 13px !important;
	margin: 5px 8px 8px 8px ;
	width: 600px !important;
	}

/* 警告エリア背景色 */
p.bookmarked-confirm {
	background: #eee !important;
	/* display: none !important; */
	}

/* ブックマークタイトル */
table.bookmarklet p#title-edit span.title {
	font-weight: normal !important;
	}

/* ブックマークURL */
table.bookmarklet a {
	color: #777 !important;
	}


/* コメント入力欄 & 追加/更新ボタン */
table.bookmarklet input {
	font-size: 13px !important;
	font-family: メイリオ !important;
	}

/* コメント欄 横幅 */
input#comment {width: 420px !important;}

/* タグ注意書き消し */
p.bookmarklet-notice {display: none !important ;}


/* おすすめタグ消し */
dl.recommend-tags {display: none !important ;}


/* タグクラウド文字サイズ是正 */
dl.all-tags dd {
	font-size: 100% !important;
	}

/* タグクラウド背景色 */
dd#all-tags {
	background: #fff !important;
	}

/* タグクラウド文字色 */
dd#all-tags span.tag {
	color: #666 !important;
	border: none !important;
	}

/* タグ選択色 */
#hatena-bookmark-user-add dd#all-tags span.tag-selected,
#hatena-bookmark-user-add dd#recommend-tags span.tag-selected,
dd#all-tags span.tag-selected,
dd#recommend-tags span.tag-selected {
	background: #888 !important;
	color: #fff !important;
}




/* ---------- エントリページ (b.hatena.ne.jp/entry/) ---------- */

/* エントリタイトル */
body#hatena-bookmark-entry div.entry-info h2.entrytitle {
	font-size: 20px !important;
	}

/* 参考になった */
body#hatena-bookmark-entry span.interest, 
body#hatena-bookmark-entry span.interest-count {
	display: none !important;
	}

/* ブックマークコメント */
body#hatena-bookmark-entry div.curvebox-lb-body {
	font-size: 13px !important;
	}

body#hatena-bookmark-entry ul#bookmarked_user span.comment {
	color: #111 !important;
	}

/* エントリ詳細 */
body#hatena-bookmark-entry blockquote { 
	display: normal;
	font-family: メイリオ !important;
	}

/* 時刻 */
body#hatena-bookmark-entry .timestamp {
	color: #666 !important;
	}

/* 関連ダイアリ消し */
body#hatena-bookmark-entry h2.comment bookmark-list,
body#hatena-bookmark-entry h2.reldiary {
	font-family: メイリオ !important;
	letter-spacing: normal !important;
	}




/* ---------- トップページ用 (b.hatena.ne.jp/) ---------- */

/* ヘッダカテゴリボタン消し */
div#category { 
	display: none !important;
	}

/* エントリ詳細 消し */
body#hatena-bookmark blockquote,
body#hatena-bookmark-hotentry blockquote,
body#hatena-bookmark-entrylist blockquote,
body#hatena-bookmark-hotentrynews blockquote,
body#hatena-bookmark-entrylistnews blockquote { 
	display: none !important;
	}

li.tags { 
	display: none !important;
	}

#container {
	margin: 0 20px !important;
	padding: 10px 10px 0 10px !important;
	}

#sidebar {
	float: left !important;
	width: 100% !important;
	margin-left: 10px !important;
	}

検索クエリ

http://b.hatena.ne.jp/user/?q=

以前の "?word=" から "?q=" に変更された。インクリメンタルサーチの実装により独立した検索結果ページは消滅したが、クエリに単語を入れて投げると検索開始状態でブックマークページを開く。

Proxomitron 検索結果の表示を高速化するフィルタ

前述の検索クエリで外部からブックマーク検索をかけた場合、トップページのブックマークとタグクラウドを表示した後に検索ポップアップを表示するためリニューアル前と比べ無駄があり遅い。レンダリングを速めるため検索結果のみを表示させるスタイルシートを Proxomitron で挿入する。
http://img.f.hatena.ne.jp/images/fotolife/u/underthemoon/20081129/20081129012916.png

[Patterns]
Name = "Hatena Bookmark : UserPage CSS : Search Simpler"
Active = TRUE
URL = "b.hatena.ne.jp/user/?q\="
Limit = 20
Match = "(^(^</head>))$STOP()"
Replace = "\r\n"
          "<!-- User Search Simpler -->\r"
          "<style type="text/css">\r\n"
          ".main { display: none !important; }\r"
          "ul#tags { display: none !important; }\r"
          "</style>\r"
          "\r\n"

または、 ul class="menu" を \k でも可。

Proxomitron コメント欄のブックマーカを消すフィルタ (ユーザページ用)

コメント欄でタグの前に表示されるブックマーカは自分のページに不要だが他人のだと必要な場合がある。Opera のユーザスタイルシートはドメイン単位で管理されるため URL からアカウントを判別できない。 Proxomitron で自分のページにだけ削除用のスタイルシートを挿入する。

[Patterns]
Name = "Hatena Bookmark : UserPage CSS"
Active = TRUE
URL = "b.hatena.ne.jp/user/"
Limit = 20
Match = "(^(^</head>))$STOP()"
Replace = "\r\n"
          "<!-- User CSS -->\r"
          "<style type="text/css">\r"
          ".username { display: none !important; }\r"
          "</style>\r"
          "\r\n"

Proxmotron はてなスターを非表示するフィルタ (ユーザページ用)

ユーザページで "Add Star" ボタンが消える。星も消える。

[Patterns]
Name = "Hatena Bookmark : Prevent Hatena Star (UserPage)"
Active = TRUE
URL = "b.hatena.ne.jp/user/"
Limit = 50
Match = "Hatena.Bookmark.Star.loadStar\('ul.comment li'\)$STOP()"
Replace = "<!-- Prevent Hatena Star -->"

カラーテーマを強制固定する

ブラウザを再起動するとカラーテーマがデフォルトに戻ってしまうのでデフォルトのカラーテーマ自体を任意に置き換える。スタイルシートで指定できない一部の画像置換に Proxomitron を併用する。

/* MONOTONE {{{ */
#header {
	border-color: #bdbdbd !important;
	background: #f9f9f9 !important;
}

#header #searchtext {
	border-top-color:		#a5a5a5 !important;
	border-right-color:	#f2f2f2 !important;
	border-bottom-color: #f2f2f2 !important;
	border-left-color:	 #a5a5a5 !important;
	color: #333 !important;
}

#header #search {
	background-image: url(/images/formseparator-mt.gif) !important;
}



#header #navigation ul li a {
		color: #000 !important;
}

div.tabbar,
div.tabbar ul.tab li a,
div.tabbar ul.tab li.selected a,
h2.hotentry {
	background-position: right -120px !important;
}

h2.newhotentry {
	background-position: right -270px !important;
}

div.tabbar ul.tab li,
div.tabbar ul.tab li.selected {
	background-position: left -120px !important;
}

div.tabbar ul.tab li.selected a {
	color: #666 !important;
}

div.tabbar ul.tab li a	{
	color: #999 !important;
}

div.tabbar ul.tab {
	background-image: url(/images/entry_title_bg_left-mt.gif) !important;
}

ul.threshold li a {
		color: #b3b3b3 !important;
}

ul.threshold li.selected {
	background-position: left -104px !important;
}

ul.threshold li.selected a {
	background-position: right -104px !important;
}

#colorselecter img {
	background-position: left -60px !important;
}

div.curvebox-color-body {
		border-color: #ccc !important;
		background: #f9f9f9 !important;
}
div.curvebox-color-header { background-position: right -150px !important; }
div.curvebox-color-header div { background-position: left -150px !important; }
div.curvebox-color-bottom { background-position: right -165px !important; }
div.curvebox-color-bottom div { background-position: left -165px !important; }

div.sidebar div.hatena-module-title {
	background-image: url(/images/sidebar_h3_bg-mt.gif) !important;
}

#searchmain div.search_container div input.inputtext {
	background-position: left -140px !important;
}

#searchmain div.search_container div input.inputbutton {
	background-position: right -140px !important;
	color: #333 !important;
}

/* }}} */



[Patterns]
Name = "Hatena Bookmark : Color Theme (Monotone)"
Active = TRUE
URL = "b.hatena.ne.jp/"
Limit = 32
Match = "(logo1|logo2|"
        "searchbutton|"
        "title_hotentry|title_newhotentry|title_newsindex|"
        "title_hotvideo|title_hotasin"
        ")\1.gif"
Replace = "\1-mt.gif"