// ここからアイコンとスタイルの定義 // - アイコンの名前はエンコードしなくてOK、日本語でもOK // - スタイル部分は content だけ必須、バックスラッシュ2個必要なので注意、あとはお好みで const tagIconStyles = { "!" : "{ content: '\\f06a'; color: #F6AE2D }", /* ひらめき */ "?" : "{ content: '\\f059'; color: #758E4F }", /* 疑問、要調査 */ "*" : "{ content: '\\f069'; color: #F26419 }", /* 重要 */ "_" : "{ content: '\\f0c8'; color: #08BDBD }", /* タスク */ "x" : "{ content: '\\f14a'; color: #2489C5 }", /* 完了タスク */ ">" : "{ content: '\\f14d'; color: lightgrey }", /* 先送りしたタスク */ "<" : "{ content: '\\f274'; color: lightgrey }", /* 日付を決めたタスク */ "e" : "{ content: '\\f192'; color: #F26419 }", /* イベント */ "good" : "{ content: '\\f164' }", /* おまけ。下に説明があるよ */ "bad" : "{ content: '\\f165' }", "good_meal" : "{ content: '\\f087\\f805\\f069'; letter-spacing: .2em }" }; // ここから下は無視してね --------------------- (function(m){ let charSelectors = [], afterLinkSelectors = [], iconStyle = "" const linkSelFmt = ".line:not(.cursor-line) a[href$='/#']:not(.icon)" const charStyle = "{display:inline-block;width:0;text-indent:-9999px}" const afterLinkStyle = "{display:inline-block;min-width:1.15em;padding-left:1px;font: 900 110%/normal 'Font Awesome 5 Free';text-align:center}" const a = "::after", f = " span" const enc = ['@$&+=:;", ','@$&+=:;",_'] const encode = tag => Array.from(tag).map(c => { const i = enc[0].indexOf(c) return -1 < i && enc[1][i] ? enc[1][i] : encodeURIComponent(c) }).join(""); for (var k in m) { const href = encode(k) charSelectors.push(linkSelFmt.replace(/#/, href) + f) afterLinkSelectors.push(linkSelFmt.replace(/#/, href) + a) iconStyle += linkSelFmt.replace(/#/, href) + a + m[k] } let style = document.createElement('style') style.appendChild(document.createTextNode(charSelectors.join(",") + charStyle)) style.appendChild(document.createTextNode(afterLinkSelectors.join(",") + afterLinkStyle)) style.appendChild(document.createTextNode(iconStyle)) document.head.appendChild(style) })(tagIconStyles)