Sentence_UserCSS
https://contenthub-static.grammarly.com/blog/wp-content/uploads/2021/04/types-of-sentences.jpeg
#import
文字を完全黒に References
code:style.css
.editor, .stream, li.page-list-item {font-family: 'M PLUS Rounded 1c'; color: #000; !important;}
チェックボックス
[o] これが o こうなるよ。
[v] これは v こうなるよ。
チェックボックスになるタグ 2 - Scrapboxとあそぶ
code: style.css
/* チェックボックスになるタグ v2 Font Awesome版 */
.line:not(.cursor-line) ahref$='/o':not(.icon) span,
.line:not(.cursor-line) ahref$='/v':not(.icon) span {
display: inline-block; width: 0; text-indent: -9999px }
.line:not(.cursor-line) ahref$='/o':not(.icon)::after,
.line:not(.cursor-line) ahref$='/v':not(.icon)::after {
display: inline-block; min-width: 1.15em; padding-left: 1px;
font-family: 'M PLUS Rounded 1c'; font-weight: 400;
font-size: 120%; text-align: center; vertical-align: middle }
.line:not(.cursor-line) ahref$='/o':not(.icon)::after { content: '\f0c8'; color: #08BDBD }
.line:not(.cursor-line) ahref$='/v':not(.icon)::after { content: '\f14a'; color: #2489C5 }
4. コードハイライト系 /m1dstream/Settings
code:style.css
/*　一旦背景黒だとカーソルが分かりづらいのでコメントアウト */
.line code {
padding: 4px 0;
font-size: 0.8em;
color: #839496;
background-color: #002b36;
}
.line span.code-block {
background-color: #002b36;
}
.page-list-item .description code {
padding: 4px;
font-size: 0.8em;
color: #839496;
background-color: #002b36;
}
5. Highlight JS
Reference: Dracula Code CSS
Reference: solarized-dark.css
code:style.css
/* Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull <sourdrums@gmail.com> */
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #002b36;
color: #839496;
}
.hljs-comment,
.hljs-quote {
color: #586e75;
}
/* Solarized Green */
.hljs-keyword,
.hljs-selector-tag,
.hljs-addition {
color: #859900;
}
/* Solarized Cyan */
.hljs-number,
.hljs-string,
.hljs-meta .hljs-meta-string,
.hljs-literal,
.hljs-doctag,
.hljs-regexp {
color: #2aa198;
}
/* Solarized Blue */
.hljs-title,
.hljs-section,
.hljs-name,
.hljs-selector-id,
.hljs-selector-class {
color: #268bd2;
}
/* Solarized Yellow */
.hljs-attribute,
.hljs-attr,
.hljs-variable,
.hljs-template-variable,
.hljs-class .hljs-title,
.hljs-type {
color: #b58900;
}
/* Solarized Orange */
.hljs-symbol,
.hljs-bullet,
.hljs-subst,
.hljs-meta,
.hljs-meta .hljs-keyword,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-link {
color: #cb4b16;
}
/* Solarized Red */
.hljs-built_in,
.hljs-deletion {
color: #dc322f;
}
.hljs-formula {
background: #073642;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: bolder;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-title,
.hljs-section,
.hljs-doctag,
.hljs-type,
.hljs-name,
.hljs-strong {
font-weight: bolder;
}
6. Hashtag thanks: Scrapbox
＃で始まるタグをラベル風にする
code:style.css
/* ＃で始まるタグをラベル風にする */
atype="hashTag" {
display: inline-block;
margin: 4px;
font-size: 14px;
height: 32px;
width: auto;
padding-left: 8px;
padding-right: 8px;
padding-top: 2px;
padding-bottom: 2px;
border-radius: 2px;
border-style: none;
color: #090909 !important;
background-color: rgba(12, 12, 13, 0.1);
}
atype="hashTag":hover {
background-color: rgba(12, 12, 13, 0.2);
}
atype="hashTag":active {
background-color: rgba(12, 12, 13, 0.3);
}
Reference
code:style.css
/*
atype="hashTag" {
padding: 0.2em 0.4em;
font-size: 1.2em;
color: #fff !important;
background-color: #938B4B;
border-radius: 0.2em;
}
*/
7. 蛍光ライン
[**　］←これに蛍光のラインを足す
settings - ???? - Scrapbox
文字装飾記法 - Scrapbox ヘルプ - Scrapbox
code:style.css-x
/* * <ーこれに蛍光のラインを足す */
.level-2{
background: linear-gradient(transparent 60%, rgb(105, 251, 170) 60%);
}
.level-1{
background: linear-gradient(transparent 80%, rgb(105, 251, 170) 80%);
}