はてなブックマークのhotentryをユーザスタイルシートで見やすくする 2
はてなブックマークのhotentryをユーザスタイルシートで見やすくするのスタイルシートを整理し、概要文を表示するように変更しました。併せてfavicon等の配置も移動しています。
ホットエントリー用ユーザスタイルシート(概要文表示版)
/* 適用先(正規表現)
http://b\.hatena\.ne\.jp/(hotentry.*|video.*)
*/
/* ボディ */
body {
background-color:#F0F0F0 !important;
}
/* 広告 */
div#header-space, li.ad-unit {
display: none !important;
}
/*ヘッダ*/
div#branding h1 a {
top: 0px !important;
}
#branding {
height: 50px !important;
}
#branding form {
top: 10px !important;
}
div#total {
display: none !important;
}
/*ナビゲーション*/
ul#navi-category {
margin-top: 0;
}
ul#navi-page {
height: 20px !important;
margin-top:0 !important;
background-color: #CCC !important;
}
ul#navi-page li {
line-height: 20px !important;
}
ul#navi-page li.current {
height: 20px !important;
background-color: #999 !important;
}
ul#navi-page li a {
height: 20px !important;
}
ul#navi-page li.current h2 a {
line-height: 20px !important;
}
ul#navi-page li.current::after {
border: none !important;
}
/* box */
div.box-wrap.top {
margin: 10px 0 !important;
}
div.box1_1 {
width: 100% !important;
border: 1px solid #CCC;
border-radius:4px;
background-color: white;
}
ul.entry-vertical-3, ul.entry-vertical-4 {
background-image: none !important;
}
/* エントリユニット */
li.entry-unit {
width:100% !important;
border-bottom:1px solid #ccc;
position:relative;
margin:0 !important;
padding:0 !important;
min-height: 45px !important;
}
Ul.entry-vertical-4 li.entry-unit {
height: 45px !important;
}
li.entry-unit:last-child {
border-bottom:none;
}
/* USERS */
ul.users {
border:none !important;
height: auto !important;
float: left;
font-size: 10px !important;
margin: 5px 5px 5px 60px !important;
border-bottom: none;
width: 80px;
text-align: center;
position: absolute !important;
left: 817px !important;
}
ul.users li a {
padding: 0 5px !important;
color:#FF0707 !important;
background-color: #FFCBCB;
line-height: 14px;
}
ul.users strong span, ul.users em span {
font-size:12px !important;
width:10%;
font-weight:bold !important;
letter-spacing:0px !important;
}
/* エントリコンテンツ */
div.entry-contents {
width: auto !important;
padding:0 !important;
border-bottom:none !important;
}
/*サムネイル*/
.thumbnail a {
position: absolute !important;
top: 5px !important;
left: 5px !important;
margin: 0px !important;
}
.thumbnail a img {
width:50px !important;
height: auto !important;
}
a.video span.play {
display: none !important;
}
/* エントリデータ */
ul.entry-data {
margin: 0 !important;
}
ul.entry-data li.category {
display: none !important;
}
ul.entry-data li.date {
line-height: 14px !important;
margin-top:5px;
position: absolute !important;
left: 777px !important;
top: 0px !important;
}
/* タイトル */
div.entry-contents h3 {
margin:0 !important;
font-size: 14px !important;
position: absolute !important;
left: 80px !important;
top: 3px !important;
}
div.entry-contents h3 a {
color: #0088cc !important;
}
div.entry-contents h3 a:hover {
color: #005580 !important;
}
div.entry-contents h3 a:visited {
color: #aaa !important;
}
/* 概要 */
div.entry-contents blockquote {
margin: 23px 5px 5px 60px !important;
line-height: 14px !important;
}
/* エントリメタ */
ul.entry-meta {
position: absolute;
top: 3px;
right: 5px;
padding:0 !important;
border-bottom:none !important;
}
ul.entry-meta li.domain {
position: absolute !important;
left: -897px !important;
top: 2px !important;
width: 16px !important;
height: 16px !important;
overflow: hidden !important;
}
ul.entry-meta li.tag {
display: none !important;
}
/*フッタ*/
div.pager {
margin: 15px 0 !important;
text-align: left !important;
}
/*その他*/
.follow {
display: none !important;
}
設定方法等は前記事を参照して下さい。
おわりに
余談ですが、今更ながらはてなブックマークのホットエントリーがRSSに対応していることを知りました。「http://b.hatena.ne.jp/hotentry.rss」で購読できるようです。
なぜRSS Auto-Discoveryに対応していないのか。
関連記事
- はてなブックマークのhotentryをユーザスタイルシートで見やすくする
- はてなブックマークのhotentryをユーザスタイルシートで見やすくする 2
- はてなブックマークのhotentryをUserScriptでキー拡張する
- はてなブックマークの個別エントリページをユーザスタイルシートで見やすくする
追記＠2013/01/16
cssに若干修正が入ったのか、一部表示が崩れていたので修正しました。
追記＠2013/03/03
ナビゲーション部分がずれていたので修正しました。また、面倒なので広告削除部分も載せることにしました。
追記＠2013/05/16
はてなブックマーク側の変更によりサムネイルの表示が崩れていたので修正しました。
