Ringo Base

主にAppleに関連する話題についてあれこれ書いているブログです

ホーム > ウェブ関連 > 見にくくなった新デザインのGoogle リーダーを見やすくしてみました

見にくくなった新デザインのGoogle リーダーを見やすくしてみました

Posted on 11/02/2011 | Categories: ウェブ関連

昨日からGoogleリーダーが刷新され新しいデザインになりました。以前のものに比べて視認性が悪くなってしまったので、スタイルシートで下の画像のように見やすくしてみました。

クリックすると拡大します

時間が無かったもので下記のスタイルシートはリスト表示の時だけのものとなっています。無駄なコードが多いと思われますので、ここはこうしたほうがいいという所があったら教えていただけるとありがたいです。

私はChromeの「Chrome Stylist」という拡張機能で設定してうまく表示されていますが、おそらくSafariやFirefoxでも同様のアドオンで、少し修正するだけで適用させることができると思います。

#top-bar {
　　height: 39px !important;
}

#search {
　　padding: 5px 0px 0px 0px !important;
}

#viewer-header {
　　height: 39px !important;
}

#viewer-top-controls-container {
　　margin: -14px 0px 0px 0px !important;
}

#viewer-header {
　　background: #ebeff9 !important;
　　padding: 0px 0px 0px 10px !important;
}

#chrome-viewer-container {
　　background: #ebeff9 !important;
}

#title-and-status-holder {
　　background: #c2cff1 !important;
　　padding-left: 13px !important;
　　margin: 0px 0px 0px 0px !important;
}

#entries {
　　padding-right: 0 !important;
}

#entries.list .collapsed .entry-date {
　　margin: 5px 28px 0px 0px !important;
}

#entries.list .collapsed {
　　background-color: #ebeff9 !important;
　　border-color: #ebeff9 !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.list .read .collapsed {
　　background-color: #efefef !important;
　　border-color: #efefef !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.cards .card {
　　background-color: #ebeff9 !important;
　　border-color: #ebeff9 !important;
　　border:1px !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.cards .read .card {
　　background-color: #ffffff !important;
　　border-color: #ffffff !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.list .collapsed:hover {
　　background-color: #ffffff !important;
　　border-color: #ffffff !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.list .read .collapsed:hover {
　　background-color: #ffffff !important;
　　border-color: #ffffff !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.cards .card:hover {
　　background-color: #ffffff !important;
　　border-color: #ffffff !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

#entries.cards .read .card:hover {
　　background-color: #ebeff9 !important;
　　border-color: #ebeff9 !important;
　　border:1px !important;
　　margin: -1px 0px 0px 0px !important;
　　padding: 0px 0px 2px 0px !important;
}

新デザインは白地になって見にくくなったという方が多いようなので、このスタイルシートが少しでもそのような方の助けになれば嬉しいです。よかったら試してみていただきたいと思います。

【関連記事】

他の方にも見てもらいたいと思ったらシェアしてくれると嬉しいです！

≪ iTunes Storeで「パイレーツ・オブ・カリビアン／生命の泉」のレンタル＆販売が開始されました

6日午後10時から「スティーブ・ジョブズの軌跡」という追悼番組が放送されます ≫

コメント (0) | トラックバック (0)

コメント投稿フォーム

トラックバック

トラックバックURL：http://dbarg2.blog102.fc2.com/tb.php/1255-8f337677

| Home |

スポンサードリンク

ブログ内検索