[WordPress.com] カレンダーウィジェットの日付を丸くする

WordPress.com にはカレンダーウィジェットというのがあります。私自身は、どちらかというと機能的なことよりもブログのデザインの一つとして利用している面が強いです。

そういうわけで、とりあえず、私自身のブログで使っているカレンダー用の CSS を紹介しておきます。

Twenty Eleven

AccessMenuBarApps-1
/* カレンダー comemo-theme-twenty-eleven rev.0.1 */
.widget_calendar #wp-calendar th,.widget_calendar #wp-calendar tfoot td {
border: none;
background: none;
}

.widget_calendar #wp-calendar td,
.widget_calendar #wp-calendar th {
width: 14%;
}

#today {
border: 1px solid #d38110;
border-radius: 2px;
}

.widget_calendar tbody td a, .widget_calendar tbody td a:visited {
background-color: #DC8110;
border-radius: 12px 12px 12px 12px;
color: #FFFFFF;
display: inline-block;
height: 24px;
line-height: 24px;
margin: 1px;
vertical-align: middle;
width: 24px;
}

.widget_calendar tbody td a:hover {
background-color: #e8a870;
color: white;
}
続きを読む →

#2013

テーマ「Twenty Eleven」のカテゴリーウィジェットのメニューをボックス状にするための CSS

以下のCSSを追加すると

#secondary aside {
padding:30px 0 0;
}

aside[id*=categories] ol,aside[id*=categories] ul {
list-style:none outside none;
}

aside[id*=categories] li:hover,aside[id*=categories] li.hover {
position:static;
}

aside[id*=categories] li {
float:left;
clear:both;
padding:10px 15px;
}

aside[id*=categories] li ul li,aside[id*=categories] li {
background-image:url('https://comemo508.files.wordpress.com/2012/03/lzk8cl.png');
background-repeat:repeat-x;
background-position:0 90%;
box-shadow:rgba(0,0,0,0.4) 0 1px 2px;
line-height:26px;
width:15em;
}

aside[id*=categories] li:hover {
background-image:url('https://comemo508.files.wordpress.com/2012/03/lzk8cl.png');
background-repeat:repeat-x;
background-position:0 10%;
}

aside[id*=categories] a {
color:#cccccc;
}

aside[id*=categories] li:hover > a {
color:#373737;
}

aside[id*=categories] ul li ul li {
border:medium none;
line-height:36px;
margin:8px 0 -8px 15px;
padding:5px 0 5px 10px;
}

aside[id*=categories] ul li ul li ul li {
margin:0 0 0 15px;
}

aside[id*=categories] li ul li a {
border:0 none;
line-height:36px;
margin:-10px 0;
}

aside[id*=categories] li ul {
left:-999em;
position:absolute;
width:12em;
}

aside[id*=categories] li:hover ul,aside[id*=categories] li li:hover ul {
left:-999em;
}

aside[id*=categories] li:hover ul.sub-menu li ul.sub-menu {
left:-999em;
}

aside[id*=categories] li ul.sub-menu li:hover ul.sub-menu {
left:-999em;
}

カテゴリーがボックス状になります。

categorybox01

rect3015

kategorybox02

#2013

テーマ「Twenty Eleven」のアーカイブ表示でフッター部分を削除するための CSS

以下の CSS を追加すると、

.archive #supplementary {
display:none;
}

アーカイブ表示(月毎、カテゴリー毎等での投稿記事の時系列一覧表示)のときにフッター部分が削除されます。

#2013

テーマ「Twenty Eleven」にお知らせをつけるための CSS

テーマ「Twenty Eleven」にお知らせをつけるための CSS についての覚書です。

agsgsddsf

続きを読む →

#2013

[WordPress.com] テーマ「Twenty Eleven」で全幅テンプレートを使う

3月 | 2013 | comemo | ページ 4

続きを読む →

#2013

メニューや文章の右側に丸いマークを入れる

リンク先が英語のものにマークをつける方法についての覚書です。

dsfhsdghsd

続きを読む →

#2013

ウィジェット「人気の投稿とページ」をタイル状に表示する

dsfgsfgfsd

続きを読む →

#2013