noteが読みやすくなるブックマークレット
noteのページが読みにくかったので
左右の余白を埋め、行間を詰め、左側にある謎のフロートアイコンを消すブックマークレットを作りました。使うとnoteのページが劇的に読みやすくなるように感じます。
使い方
javascript:(function(){var widthElems=['article','section','main','aside','details','figcaption','figure','footer','header','nav','summary','time'];for(var k=0;k<widthElems.length;k++){var wElems=document.querySelectorAll(widthElems[k]);for(var l=0;l<wElems.length;l++){wElems[l].style.width='90%';}}var tElems=['p','h1','h2','h3','h4','h5','h6','li','span','a','div'];for(var t=0;t<tElems.length;t++){var elems=document.querySelectorAll(tElems[t]);for(var i=0;i<elems.length;i++){elems[i].style.lineHeight='1.0';}}var delElems=document.querySelectorAll('div.p-article__sideCreatorInfo');for(var j=0;j<delElems.length;j++){delElems[j].parentNode.removeChild(delElems[j]);}})();
実行結果例
過去投稿したnoteにて動作確認
参考
改行とインデントをつけて記載します。配列で指定した要素について過不足などはあるかもしれません。
javascript:(function() {
var widthElems = ['article', 'section', 'main', 'aside', 'details', 'figcaption', 'figure', 'footer', 'header', 'nav', 'summary', 'time'];
for (var k = 0; k < widthElems.length; k++) {
var wElems = document.querySelectorAll(widthElems[k]);
for (var l = 0; l < wElems.length; l++) {
wElems[l].style.width = '90%';
}
}
var tElems = ['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'li', 'span', 'a', 'div'];
for (var t = 0; t < tElems.length; t++) {
var elems = document.querySelectorAll(tElems[t]);
for (var i = 0; i < elems.length; i++) {
elems[i].style.lineHeight = '1.0';
}
}
var delElems = document.querySelectorAll('div.p-article__sideCreatorInfo');
for (var j = 0; j < delElems.length; j++) {
delElems[j].parentNode.removeChild(delElems[j]);
}
})();
おまけ Qiita横幅調整用
javascript:(function(){var elems=document.querySelectorAll('.p-items_main');for(var i=0;i<elems.length;i++){elems[i].style.maxWidth='90%';}})();
この記事が気に入ったらサポートをしてみませんか?