読者です 読者をやめる 読者になる 読者になる

tpex_ovon's blog

Web屋の人。はてブトップのユーザースタイルシートの記事しか書いてない。

はてブのカテゴリーの新着がトップページに出たらしいので対応ユーザースタイルシート作った。

カテゴリーごとの新着エントリーが、トップページに復活しました - はてなブックマーク日記 - 機能変更、お知らせなど

本・映画・匿名ダイアリーがメインカラムで
その他のカテゴリーが右カラムという追いやられ感。
なぜか動画のカテゴリーだけメインにあるのは、動画のサムネを大きく出したいからでしょうね。

それぞれのカテゴリーの重み付けが情報の内容ではなく、デザインのため配置しましたって感じがする。
右カラムのエントリーが3つづつしか無いのもメインカラムのレイアウトの絡みだろうなあ・・・・。

f:id:tpex_ovon:20130131170455j:plain

ところではてなブログでコードを綺麗に出せる記法を知ったので早速使ってみた。

/*お好みで*/
body{background-color:#F0F0F0;}
.box3_2,.box1_1,ul#navi-category{background-color: white;}

/*リンクカラー*/
div.entry-contents h3 a{color: #0056BD !important;}
div.entry-contents h3 a:visited{color: #838 !important;}


/*いらないブロック消す*/
ul.entry-list-xl div.entry-contents blockquote,
ul.entry-list-xl li.entry-unit ul.entry-comment,
ul.entry-list-l div.entry-contents blockquote,
ul.entry-list-l li.entry-unit ul.entry-comment,
div.entry-contents blockquote,
li.entry-unit .follow.hb-favorites-appended,
a.thumbnail
{display: none !important;}

/*復活*/
ul.entry-list-xl ul.entry-data{display:block;}

/*ボックスボーダー*/

.box1_2,
.box3_2,
.box1_1{width: 100% !important;border: 1px solid #CCC;border-radius:4px;}

/*背景画像ボーダー消す*/
div.box-wrap.box2.mix,ul.entry-vertical-4,ul.entry-vertical-3,div.box1_1 li.more-entry{background-image: none !important;}

h2 {margin:0;padding: 5px 0 5px 5px;display:block;border-radius: 3px 3px 0 0;}
.box1_1 h2,.box3_1 h2{background-color: #2C6EBD;}

/*右サイドバー*/
.box3_1{width: 100% !important;margin:0px !important;}
.entry-vertical-3,
.entry-list-m{border: 1px solid #CCC;border-radius:0 0 4px 4px; border-top:none;background-color: white;}
div.box3_1 h2{margin:15px 0 0 0 !important;}
div.box-wrap.box3.mix{margin-top:0;}
div.box3_1 ul.entry-list-m li.entry-list{min-height:auto !important;position: relative;border-bottom:1px solid #ccc;}
div.box3_1 li.entry-list div.entry-contents h3 {float: none !important;font-size: 16px;}
div.box3_1 li.entry-list div.entry-contents {border-top:none;}
div.box3_1 li.entry-list ul.users strong span, div.box3_1 li.entry-list ul.users span {display:inline;}

/*エントリーリスト*/
ul.entry-data,ul.entry-data li{margin:0 0 0 0 !important;}
ul.entry-data li.date{line-height:1!important;}
.entry-contents h3{margin:0 !important; clear:none !important;line-height:1 !important;}
.hb-entry-link-container{ padding-right:170px !important;}

li.entry-unit{ width:100% !important; border-bottom:1px solid #ccc; overflow:hidden; position:relative;}
li.entry-unit:last-child{border-bottom:none;}
li.entry-unit ul.users {border-bottom:none;}
ul.entry-list-xl,
ul.entry-list-l,
li.entry-unit{margin:0 !important;}
li.entry-unit, li.entry-list {clear:both; padding:0;}
ul.entry-list-xl{border-bottom:1px solid #ccc;}


ul.entry-meta{position: absolute;top: 5px;right: 5px;padding:0 !important;border-bottom:none !important;}
ul.entry-meta li.tag {display: none !important;}
ul.entry-meta li.domain {margin: 0px 0px 3px 0;}


/*サムネ*/
/*a.thumbnail{display: inline !important;margin:0 !important;}
a.thumbnail img,
Ul.entry-vertical-4 li.entry-unit div.entry-contents a.video,
 ul.entry-vertical-4 li.entry-unit.video div.entry-contents a.thumbnail {width:50px !important;height: auto !important;}*/

a.video span.play{display:none !important;}

/*カテゴリー・日付*/
ul.entry-data{padding:4px 0 0 0 !important;}
ul.entry-data li.category a,
ul.entry-vertical-4 ul.entry-data li.category a{background:none !important;color: #303030!important;padding:0 !important;margin-right: 5px !important; line-height:1 !important;}

/*レイアウト*/
div.entry-contents{float:left; width:89%;margin:0 !important;padding:5px 0 !important;border-bottom:none !important;}


/*xxx user*/
ul.users{border:none !important;height: auto !important;float: left;font-size:9px !important; margin: 5px;border-bottom: none;width: 80px !important;text-align: center;padding:0!important;}
ul.users li{font-weight:bold !important;}
ul.users li a {padding-left: 0 !important;color:#FF0707 !important;background-color: #FFCBCB;border-bottom: 1px solid #FF0707;}
ul.users strong span,
ul.users em span{font-size:12px !important;font-weight:bold !important;letter-spacing:0px !important;margin-right:0px !important;} 

div.shim-elem-for-height{ height:30px !important;}

/*もっと読む*/
li.more-entry a {color: #383838;}