Pastel Orange はパステルオレンジ色(#ffb347)をメインカラーとしたはてなブログのテーマです。
はてなブログの設定ページにある「デザインCSS」に以下のようなコードを記述すると、背景を好みの画像に変更することができます。background-position プロパティの値(center または center bottom など)は、画像に応じて調整してください。
body { background-image: url(はてなフォトライフなどにアップロードした画像のURL); background-position: center; background-repeat: no-repeat; background-size: cover; }
上記の画像の背景画像には 2560×1600 Wallpaper 00586 | Mac壁紙.com を用いています。
上記の画像の背景画像には Summer Beach Scene ❤ 4K HD Desktop Wallpaper for 4K Ultra HD TV • Dual Monitor Desktops • Tablet • Smartphone • Mobile Devices を用いています。
好みの画像に変更してブログ名などの文字が読みにくかった場合は、はてなブログの設定ページにある「デザインCSS」に以下のようなコードを記述して、文字の色を変更してください。
/* ブログ名 */ #title a { color: #fff; } /* ブログの説明 */ #blog-description { color: #fff; } /* タイトル下 */ .top-editarea { color: #fff; } /* フッタ */ .bottom-editeria { color: #fff; }
上記の画像の背景画像には Funny Laika On The Grass ❤ 4K HD Desktop Wallpaper for 4K Ultra HD TV • Tablet • Smartphone • Mobile Devices を用いています。
上記の画像の背景画像には 2560×1600 Wallpaper 00381 | Mac壁紙.com を用いています。
GitHub https://github.com/ark-tds/Pastel-Orange でも公開しています。詳しい更新履歴は、https://github.com/ark-tds/Pastel-Orange/commits/master を参照してください。
大まかな更新履歴
- 2016/7/15
- 目次にマージンを追加する
- 2016/7/11
- 背景色をグラデーションから #f7f7f7f に変更する
- 2016/4/19
- テーマ名を「Colorful Theme」から「Pastel Orange」に変更する
- はてなブログを編集・管理する際に使用を推奨するWebブラウザの変更について - はてなブログ開発ブログ を基に、IE 10 以下のサポートを打ち切る
- パステルオレンジ色 #ffb347 をメインカラーとして扱う
- アクセントカラーを #ff3e61 から #ff5747 へ変更する
- hr 要素の明度を上げる(#ffddad から #fff2e0 に変更する)
- 背景画像を固定させる(スクロールに伴って移動させない)
- 2016/3/20
- 他のモジュールと同じように、HTML モジュールのアイコンフォントとモジュールタイトルのマージンを開ける
- 区切り線(hr 要素)にデザインを追加する
- 2016/3/16
- 目次にデザインを追加する
- コメント欄全体にデザインを追加する
- 参加グループモジュールにデザインを追加する
- グローバルフッターにデザインを追加する
- IE8、9に対して互換性を向上させる
- 見出し h1~h3 の背景色を透過から白色 #fff に変更する
- 2016/3/5
- パンくずリスト(カテゴリーページ)の「ホーム」にアイコン Web フォントを追加する
- 2016/2/28
- 背景を画像からグラデーションに変更する
- グラデーションの背景に合わせてヘッダーやフッターなどの背景を変更する
- グローバルフッターを暗めのデザインに変更する
- ボタンなどの角の丸み(border-radius)を調整する
- 2015/9/22
- ページャーのシェブロン(矢印)をアイコン Web フォントにする
- サブカラーの彩度を下げる(#feaf39 から #ffd274 にする)
- 「引用する」ボタンと重ならないように、引用のデザインを変更する
- 2015/8/14
- Windows と Mac の見た目を近づけるために b 要素と strong 要素の linear-gradient の値を調整する
- 2015/8/13
- プロフィールモジュールのプロフィールアイコンの下にマージンを空ける
- 2015/8/12
- 編集ボタンにアイコン Web フォントを付加する
- a 要素付きモジュールタイトルで無効にしていたポインターイベントを有効にする
- 参加グループモジュールのリストのマーカーを非表示にする
- 月別アーカイブモジュールで年と月の行頭を揃える
- 2015/08/06
- 公開