Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8777

青空一行文庫ブックマークレット

$
0
0

青空文庫の作品を「一行にする」ブックマークレットです。岩下 智氏の作られた一行文庫に触発されて作りました。人や環境によっては複数行より読みやすくなると思います。
20200627.png

javascript: (() => { let text = ''; document.querySelectorAll('body > h1, body > h2, body > h3, .metadata, .main_text').forEach(node => { text += node.innerHTML.replace(/<(\/?ruby|\/?rb|\/?rp|\/?rt)>/g, '___$1___').replace(/<[^>]+>/g, '').replace(/___([^_]+)___/g, '<$1>') + ' '; }); text = text.trim().replace(/(\r\n|\r)+/g, '\n').replace(/\n{2,}/g, '\n').replace(/\n/g, ' ').replace(/ {2,}/g, ' '); document.querySelectorAll('body > *').forEach(node => { node.style.display = 'none'; }); document.body.innerHTML += `<div style="letter-spacing: 0.25em; white-space: nowrap; writing-mode: vertical-rl;">${text}</div>`; document.body.style.cssText = 'background-color: #001020; color: #f0f0f0; display: flex; justify-content: center; font-family: "游明朝","Yu Mincho",YuMincho,"Hiragino Mincho Pro",serif; font-feature-settings: "pkna"; font-size: calc(2.5vh + 10px); -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; margin: 2em;'; })(); void 0;

ご存知の通り、青空文庫の HTML フォーマットは完全に統一されているわけではないため、作品によってはレイアウトが崩壊したり、外字が非表示になったりする可能性があります(外字についてはルビが振られているはずなので、可読性は損なわれないかと)。
また、スマートフォンでの使用を想定したフォントサイズにしているため、環境によってはフォントサイズの調整が必要になる可能性もあります。 PC では font-size: calc(2.5vh + 10px);2.5vh2vhくらいにした方が良いかもしれません。

【その他の青空文庫用ブックマークレット】
* 青空文庫の闇堕ちブックマークレット
* 青空文庫スピーカー


Viewing all articles
Browse latest Browse all 8777

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>