nia9865
https://gyazo.com/4be7dc39dee8eb332ee2683ccd2b5e8d
ポン酢です
DTMClubにもいます
仲良くしてね
アイコンがコロコロ変わります。気分で。
自己紹介…一応しますか…
普段は音madを作りながら映像制作を勉強しています。
この春から大学生です。至らぬ点が多いと思いますが、ご容赦下さい…
↑もう27年には卒業だよ…早いね…
一応個人Scrapboxありますので、普段どんなことしてるか気になる奇特な方変わった感性をお持ちの方はそちらもご一読ください。
Scrapboxのポップアップメニューに項目を増やすだけのScriptです。なので自分にしか適応されないはず…
とりあえず注意されるまで使うので駄目だったら注意してください。
code:script.js
// マーカー
scrapbox.PopupMenu.addButton({
title: '■',
onClick: text => [[${text}]]
})
// 黒字
scrapbox.PopupMenu.addButton({
title: '黒字',
onClick: text => [# ${text}]
})
// 赤字
scrapbox.PopupMenu.addButton({
title: '📕',
onClick: text => [! ${text}]
})
// 青字
scrapbox.PopupMenu.addButton({
title: '📘',
onClick: text => [% ${text}]
})
// 緑字
scrapbox.PopupMenu.addButton({
title: '📗',
onClick: text => [& ${text}]
})
// ルビつけ
scrapbox.PopupMenu.addButton({
title: 'ルビ',
onClick: text => [| ${text}[]]
})
そしてこれはTwitterの貼り付けがいい感じになるScript
code:script.js
// Twitter貼り付け
import('/api/code/ci7lus/tweet2image-upload/script.js');
あと自分にしか適応されないCSSです。自分が見やすくするためだけなのでお気になさらず
こっちも怒られたら消します
コードブロックの行番号を表示するUserCSS
code:style.css
@import '/api/code/Mijinko/コードブロックの行番号を表示するUserCSS/style.css';
画像に影をつける
code:style.css
.line img.image {
margin : 0 auto 0.7em;
border-radius: 0.35em;
filter: drop-shadow(0px 0px 5px rgba(160, 160, 160, 0.5));
top: 1em;
}
ポップアップメニューのアイコン化
code:style.css
/* ポップアップメニューの修飾ボタンをアイコン化 */
.popup-menu .button-container .button.strong-button > strong,
.popup-menu .button-container .button.italic-button > i,
.popup-menu .button-container .button.strike-button > strike {
display: inline-block; width: 0; text-indent: -9999px }
.popup-menu .button-container .button.link-button::after,
.popup-menu .button-container .button.strong-button::after,
.popup-menu .button-container .button.italic-button::after,
.popup-menu .button-container .button.strike-button::after {
font: 900 100%/normal 'Font Awesome 5 Free';
display: inline-block; min-width: 16px; text-align: center }
.popup-menu .button-container .button.strong-button::after { content: '\f032' }
.popup-menu .button-container .button.italic-button::after { content: '\f033' }
.popup-menu .button-container .button.strike-button::after { content: '\f0cc' }
/* ポップアップメニューのボタン周りの線を消す */
.selections .popup-menu .button-container .button:not(:first-of-type) { border: 0 }
外部リンクを区別するUserCSS
code:style.css
/* 外部リンクにiconをつける */
font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
font-weight: 900;
font-size: 1.2rem;
content: ' \f35d';
display: inline-block;
}
インデントの可視化
code:style.css
.indent-mark {
height: 100% !important;
}
.indent-mark .pad {
height: 100% !important;
overflow: unset !important;
}
.indent-mark span:nth-child(6n+1):not(:nth-last-child(1)):not(:nth-last-child(2)) .pad {
border-right: 2px solid #EAEAEA; /* 色の指定 */ }
.indent-mark span:nth-child(6n+2):not(:nth-last-child(1)):not(:nth-last-child(2)) .pad {
}
.indent-mark span:nth-child(6n+3):not(:nth-last-child(1)):not(:nth-last-child(2)) .pad {
}
.indent-mark span:nth-child(6n+4):not(:nth-last-child(1)):not(:nth-last-child(2)) .pad {
}
.indent-mark span:nth-child(6n+5):not(:nth-last-child(1)):not(:nth-last-child(2)) .pad {
}
.indent-mark span:nth-child(6n+):not(:nth-last-child(1)):not(:nth-last-child(2)) .pad {
}
見た目の変更
code:style.css
/* テロメアとページメニューを脇に寄せて本文を広く見せる */
@media screen and (min-width: 1200px) {
.line .telomere .telomere-border { left: calc((100% - 960px)/2 - 120px) }
.app:not(.presentation) .page-menu { text-align: right; width: calc(100% - 20px) } }
/* テロメアの存在感を薄くする */
.line .telomere .telomere-border:not(:hover) { opacity: .4 }
.line .telomere .telomere-border.unread:not(:hover) { opacity: .3 }
/* 本文の最後にテキスト挿入 */
.app:not(.presentation) .page.not-persistent::after {
content: '本文は書かれていない' }
タグのタグ化
code:style.css
/* ＃で始まるタグをラベル風にする */
padding: .5rem 1rem .5rem 0;
display: inline-block;
line-height: 1.3;
vertical-align: middle;
border-radius: 25px 0px 0px 25px;
margin-bottom: 0.6rem;
pading-right: 10px;
font-size: 0.9em;
border: none;
}
content: '●';
color: white;
margin: 0.6em;
}
border: none;
}