settings
スマホ向けのバーがかっこいい
style.css@import '/api/code/motoso/吹き出し記法/style.css';本文のフォントを変更 via /masui/settings#5eb740908ee92a00000ba104
この
style.css はこのページのトップにないと有効にならない@importがあるからだね
abc 太字にならない...
abcいやちょっと太いな？
abc
なぜ？
mac Chromeだと太字にならない
iOSでは太字になる
太字になるフォントとならないフォントがある
太字になる
太字にならない
太字ががたがたになる
style.css.disable @import url("https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c");
html, body, #editor, .grid li {
font-family: helvetica, arial, "Noto Sans JP", sans-serif ;
}インライン引用記法
style.css.deco-\" {
border-radius: .2em;
padding: 0 .4em;
background-color: rgba(128,128,128,0.1);
font-size: 95%;
/* font-style: italic; */
}
.line:not(.cursor-line) .deco-\"::before {
color: #a0a0a0;
font-size: 85%;
/* font-family: 'FontAwesome'; */
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: '\f10d';
position: relative;
top: -0.5em;
left: -0.2em;
}style.css .deco-\% {
color: #393a4a;
background-color: rgba(120, 172, 255, 0.15);
padding: 0.1em 0.2em 0.1em 0.2em;
}
.scrapcalc_result {
font-style:italic;
font-weight:bold;
background-color:yellow;
}style.css.search-form .dropdown-menu .dropdown-item>a[href^="/motoso/%E2%9D%8C"] {
color: gray;
}
.search-form .dropdown-menu .dropdown-item>a[href^="/motoso/%E2%9D%8C"]::before {
content: "(表記ゆれ)";
font-size: 10px;
vertical-align: bottom;
}via /takker/settings
privateのScrapboxのリンクを張っておきたいときに使う
style.css.page-link[href^="/motosoh"]:before{content:"\1f512"} [./ [/takker/リンクを出典アイコンにするUserCSS]] style.css.line .deco-\. {
font-size: .8em;
position: relative;
top: -0.5em;
}
.line:not(.cursor-line) .deco-\. a:is(.page-link:not(.icon), .link) span:not(.empty-char-index) + span + span ~ span {
display: inline-block;
width: 0;
text-indent: -9999px;
}
.line:not(.cursor-line) .deco-\. .page-link:not(.icon) span.empty-char-index ~ span.char-index {
display: inherit;
width: inherit;
text-indent: inherit;
}
.line:not(.cursor-line) .deco-\. a.page-link:not(.icon) span.empty-char-index + span::before {
content: "#";
}
.line .deco-\. :is(.page-link:not(.icon), .link)::before {
display: inline-block;
min-width: 1.15em;
padding-left: 1px;
/* padding: 0 1px; */
font-family: "Font Awesome 5 Free","Font Awesome 5 Brands";
text-align: center;
vertical-align: middle;
font-weight: 900;
content: "\f02d";
}
/* 斜体を取り消す */
.line .deco-\..deco-\/ {
font-style: initial;
}
.line .deco-\..deco-\/ :is(.page-link:not(.icon), .link)::before {
font-weight: 400;
content: "\f15c";
}プロジェクトタイトル
2024-04-17にCSSが変更されて壊れた
style.css /* Project description */
.project-home > .title:after {
content: " - Long-term greedy";
white-space: pre;
font-size: 0.7em;
}背景の画像を変える
style.cssbody {
background-color: #cfd1e8;
background-image: url("https://i.gyazo.com/8d65198f72652e8887d2c941f39805b4.png");
}
/* 付箋の折返しを背景と同色に */
.grid li.page-list-item a .pin {
background: linear-gradient(45deg, var(--card-backside, #aaa), var(--card-backside, #aaa) 50%, #cfd1e8 50%, #cfd1e8)
}PC版ブランドアイコンの変更
style.css /* Overwrite the brand icon */
.brand-icon {
--logo-url: url("https://i.gyazo.com/c7a4f6f00515ecf3b5a7c7e1088c9562.png");
width: 36px;
height: 36px;
background-color: white;
background-position: center;
background-size: cover;
border: 4px solid transparent;
border-radius: 50%;
}
.brand-icon {
background-image: var(--logo-url);
background-repeat: no-repeat;
}
.brand-icon svg {
display: none;
}運用停止中
［* ］<-これに蛍光のラインを足す
ナビゲーションの色を変える
style.css .navbar {
/* #78ACFF #816BFF #6172E8*/
background: linear-gradient(90deg, rgba(120, 172, 255, 0.7), rgba(97, 114, 232, 0.7) 20% 40%, rgba(129, 107, 255, 0.7) 60%);
}テロメアの色を変更
style.css.line .telomere .telomere-border.unread {
border-color: #78ACFF;
}＃で始まるタグをラベル風にする
Scrapboxがラベル風になっていないのは、おそらく文脈の中の単語をハッシュタグにすることが価値がある使い方だと想定しているから
style.css/* ＃で始まるタグをラベル風にする */
a[type="hashTag"]{
display: inline-block;
padding: 2px 8px;
margin: 4px;
background-color: rgba(12, 12, 13, 0.1);
color: #090909;
font-size: 0.8em;
/* border: 1px solid #61B8E8; */
border-radius: 3px;
transition: .1s;
-webkit-transform: scale(1);
transform: scale(1);
}
a[type="hashTag"]:hover{
background: rgba(97, 114, 232, 0.3);
/* border: 1px solid #6172E8; */
}
a[type="hashTag"]:active{
background: rgba(97, 114, 232, 0.4);
/* border: 1px solid #6172E8; */
} 行頭のドットを薄く
style.css .line .indent-mark .dot {
top: 11px;
width: 6px;
height: 3px;
background-color: #6172E8;
}