行頭記号付きマーカー記法
https://gyazo.com/6af63689eb85901630b18b60fd90ca72
UserCSS.icon UserScript.icon
埋め込み型のタグ。
#
テキストに下線を引き、行頭のページ余白に対応する記号等を表示するマーカー記法。
マーカー（<simbol-name>）はそのままページリンクになり、同じマーカーが使われている他のページが関連ページリストに表示される。
OneNote における Tag（ノートシール）と同様
書式：[# [<simbol-name>]テキスト]
# 内部リンク
例：
starテキスト
aaa starbbb cstarcc
aaaaanowwritingaaaaaaaaaaaaaaaaaaaaaaa
aaatbcaaaaaaaa
表示確認ボタン
--project-theme noskin
Anĝela Osto
Aureolo
Termika Radiado
ポップアップメニューにボタンを追加する #UserScript
code:script.js
scrapbox.PopupMenu.addButton({
title: '★',
onClick: text => text.split('\n').map(line => [# [star]${line}]).join('\n')
})
scrapbox.PopupMenu.addButton({
title: '?',
onClick: text => text.split('\n').map(line => [# [tbc]${line}]).join('\n')
})
scrapbox.PopupMenu.addButton({
title: '✎',
onClick: text => text.split('\n').map(line => [# [nowwriting]${line}]).join('\n')
})
#記法
#UserCSS
:has()
code:style.css
.line:not(.cursor-line) {
&:has(> .text spanclass=".deco-\#" > span:nth-child(1) > adata-page-title="star") {
& spanclass=".deco-\#":has(> span:nth-child(1) > adata-page-title="star") {
background: linear-gradient(transparent 65%, hsl(from var(--c-blue-1, skyblue) h s l / 65%) 35%);
/* ↑↑テキストの修飾を記入する↑↑ */
& > span:nth-child(1) > a { display: none; }
}
&::before {
content: "★";
color: hsl(from var(--c-blue-4, deepskyblue) h s l / 60%);
font-size: 1.4em; font-weight: bolder; line-height: 1;
font-family: var(--icons, "Font Awesome 5 Free"), "AppIcons", var(--fallback), sans-serif, icons;
vertical-align: top; text-align: end; text-wrap: balance;
/* ↑↑表示したい文字列または記号を記入する↑↑ */
display: inline-block;
position: absolute; top: calc((1em - 1rem) / 3); right: calc(100% + 0.25em);
width: 24px; height: auto; border-radius: 50%;
z-index: 100;
}
}
&:has(> .text spanclass=".deco-\#" > span:nth-child(1) > adata-page-title="nowwriting") {
& spanclass=".deco-\#":has(> span:nth-child(1) > adata-page-title="nowwriting") {
text-decoration: underline wavy var(--c-green-5, forestgreen);
/* ↑↑テキストの修飾を記入する↑↑ */
& > span:nth-child(1) > a { display: none; }
}
&::before {
content: "✎";
/* content: "\udb83\uddeb"; */
background-color: transparent; color: var(--c-green-4, forestgreen);
font-size: 1.4em; font-weight: 400; line-height: 1;
font-family: "Noto Emoji", var(--icons, "Font Awesome 5 Free"), "AppIcons", var(--fallback), sans-serif, icons;
vertical-align: top; text-align: end; text-wrap: balance;
/* ↑↑表示したい文字列または記号を記入する↑↑ */
display: inline-block;
width: 1.4em; height: auto; border-radius: 50%;
position: absolute; top: calc((1em - 1rem) / 3); right: calc(100% + 0.25em);
z-index: 100;
}
}
&:has(> .text spanclass=".deco-\#" > span:nth-child(1) > adata-page-title="tbc") {
& spanclass=".deco-\#":has(> span:nth-child(1) > adata-page-title="tbc") {
text-decoration: underline wavy var(--c-yellow-5, darkorange);
/* ↑↑テキストの修飾を記入する↑↑ */
& > span:nth-child(1) > a { display: none; }
}
&::before {
content: "?";
background-color: transparent; color: var(--c-orange-5, darkorange);
font-size: 1.4em; font-weight: 400; line-height: 1;
font-family: var(--icons, "Font Awesome 5 Free"), "AppIcons", var(--fallback), sans-serif, icons;
vertical-align: top; text-align: center; text-wrap: balance;
/* ↑↑表示したい文字列または記号を記入する↑↑ */
display: inline-block;
width: 24px; height: auto; border-radius: 50% 50% 50% 50%;
position: absolute; top: calc((1em - 1rem) / 3); right: calc(100% + 0.25em);
z-index: 100;
}
}
}