【Chrome】StylishでPocketを2カラムに変える
Pocketに放り込みすぎて読み切れないので、2カラムにして読み飛ばそうという考えです。
ただ<h$>要素がないと縦に長くなってしまうけれども。
こんな感じ
変更したところ
- ヘッダーの固定を解除
- 2カラム
<h$>要素を区切りみたいにしてるので、無いと縦に長くなる。 - フォント
自分の好きなやつ - 他細かいところ
ヘッダーのグラデーションを無くす、背景を黒、文字を白など
CSSのコード
#page #content .wrapper { background-color: #515151; border: none; } #page.show_footer #content .wrapper { background-color: #f1f1f1; } header#PKT_header, #page nav, #page #subnav, #queue_title.titleItem { position: absolute; } #page nav, #page #subnav { background: #eee; top: 0; } #page_reader[font="serif"] .reader_content { font-family: "ほにゃ字Re","Lucida Grande","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; /*** 好きなフォントに ***/ width: 800px; color: #eee; margin-top: 5em; } .reader_head { border-bottom: 1px solid #616161; } .reader_head h1, .sub li, .sub li a { transition: .15s linear; } .reader_head h1 { color: #515151; } .sub li, .sub li a { color: #eee; } .reader_head h1:hover, .sub li:hover, .sub li a:hover { color: #eee; } .text_body { -webkit-columns: 380px auto; -webkit-column-gap: 19px; -webkit-column-rule: 1px solid #616161; } .text_body h1, .text_body h2, .text_body h3 { -webkit-column-span: all; } .text_body h1, .text_body h2 { color: #00B4FF; font-weight: bold; font-size: 1.8em; padding-bottom: .5em; margin: 1em 0; } .text_body h3 { color: #eee; font-weight: bold; font-size: 1.5em; padding-left: 1em; border-left: .5em solid #00B4FF; margin: 1em 0; } .text_body h4 { color: #eee; border-bottom: 1px solid #00B4FF; text-indent: .5em; } .text_body a { color: #00B4FF; transition: .15s linear; } .text_body a:hover { color: #00ffcb; } .RIL_IMG.loaded, .RIL_IMG img { max-width: 100%; } strong, b { font-weight: normal; }
Stylistの準備
- 以下からインストール後開く
- 上のコードを"コード"に貼り付け
- 適用先で"次で始まるURL"を選択して"http://getpocket.com/"と入力かコピペ
- 適当な名前を入力して有効にチェック後保存
2 column Pocket (only read page) - userstyles.orgにも投稿してみた。
うまく投稿をできてないので、インストール後に適用先を変える手間が必要な模様。
どうやって適用先を投稿に含めるのかわかんない。
ほにゃ字というフォントがオヌヌメ