settings
code:style.css
/* デフォルトのフォントを「M Plus 1p」に変更.絵文字も「Noto Emoji」を読み込み */
.editor, .stream, li.page-list-item {
font-family: 'M PLUS 1p', 'Noto Color Emoji', sans-serif;
}
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
😂❤️😍🤣😊🥺🙏💕😭😘👍😅👏😁🔥💖
😂❤️😍🤣😊🥺🙏💕😭😘👍😅👏😁🔥💖
😂❤️😍🤣😊🥺🙏💕😭😘👍😅👏😁🔥💖
😂❤️😍🤣😊🥺🙏💕😭😘👍😅👏😁🔥💖
😂❤️😍🤣😊🥺🙏💕😭😘👍😅👏😁🔥💖
😂❤️😍🤣😊🥺🙏💕😭😘👍😅👏😁🔥💖
code:style.css
/* コードブロックのフォントを「M Plus 1 Code」に変更 */
.line span.code-block .code-body {
font-family: 'M PLUS 1 Code';
}
/icons/hr.icon
チェックボックスを実現する
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;
padding-right: 5px;
font-family: 'Font Awesome 5 Free';
font-weight: 400;
font-size: 120%;
text-align: center;
vertical-align: middle
}
.line:not(.cursor-line) ahref$='/o':not(.icon)::after { content: '\f0c8';
}
.line:not(.cursor-line) ahref$='/v':not(.icon)::after { content: '\f14a';
}
参考
寄せ記法
code:style.css
/* 中央寄せ */
.deco-\| {
position: absolute;
width: 100%;
text-align: center;
}
/* 右寄せ */
.deco-\> {
position: absolute;
width: 100%;
text-align: right;
}
/* 左寄せ */
.deco-\< {
position: absolute;
width: 100%;
text-align: left;
}
中央寄せ
shinyaoguri.icon
右寄せ
shinyaoguri.icon
左寄せ
shinyaoguri.icon
吹き出し記法
吹き出しのようになるよ
長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。長い文章でも大丈夫。
文字のサイズも変更できる
ユニティちゃん.iconアイコンと組み合わせると
会話みたいな感じで面白いよねshinyaoguri.icon
ユニティちゃん.icon実は両方でもいける
ユニティちゃん.iconいいねshinyaoguri.icon
code:style.css
.deco-\{, .deco-\} {
font-size: 1em;
padding: 0.3em 0.5em 0.3em 0.5em;
border-radius: 0.4em;
margin: auto 0.5em;
display: inline-block;
max-width: calc(100% - 100px);
vertical-align: top;
}
/* 左吹き出し */
.deco-\{:before {
position: absolute;
margin: 0;
padding: 0;
transform: translateX(-180%) translateY(calc(1em - 80%));
width: 0;
content: "";
border-width: 0 0 0.6em 0.6em;
border-style: solid;
}
/* 右吹き出し */
.deco-\}:after {
position: absolute;
margin: 0;
padding: 0;
transform: translateX(80%) translateY(calc(1em - 80%));
width: 0;
content: "";
border-width: 0 0.6em 0.6em 0;
border-style: solid;
}
/* 強調記法との組み合わせ */
.deco-\!:before, .deco-\!:after {
}
/* 吹き出し中のリンク文字色 */
.deco-\{ a, .deco-\} a {
}
強調記法
code:style.css
.deco-\! { /* 重要な部分は!を付ける */
background-color: #e66; /* 赤背景 */ font-size: 1.0em; /* 重要なので最初から大きな文字にする */
}
文章中の大事な部分を赤くできる
あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモリーオ市、郊外のぎらぎらひかる草の波。またそのなかでいっしょになったたくさんのひとたち、ファゼーロとロザーロ、羊飼のミーロや、顔の赤いこどもたち、地主のテーモ、山猫博士のボーガント・デストゥパーゴなど、いまこの暗い巨きな石の建物のなかで考えていると、みんなむかし風のなつかしい青い幻燈のように思われます。では、わたくしはいつかの小さなみだしをつけながら、しずかにあの年のイーハトーヴォの五月から十月までを書きつけましょう。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
彼らの機器や装置はすべて生命体だ。
文中引用記法
code:style.css
.deco-\" {
border-radius: .2em;
padding: .4em .4em;
background-color: rgba(128,128,128,0.1);
font-size:95%; font-style: italic
}
.deco-\"::before {
font-size:100%;
margin: 0px 5px 0px 5px;
font-family: 'FontAwesome';
content: '\275d';
vertical-align: super
}
.deco-\"::after {
font-size:100%;
margin: 0px 5px 0px 5px;
font-family: 'FontAwesome';
content: '\275e';
vertical-align: super
}
文中で何かを引用するときに引用みたいな感じで書くことができる
/icons/hr.icon
見出しを認識する
H1あああ
H2あああ
H3あああ
H4 あああ
H5 あああ
settingsを非表示にする
code:style.css
// display: none;
//}
ピン留めされたページを独立した段にする
code:style.css
.page-list-item.pin + .page-list-item:not(.pin) {
grid-column-start: 1;
}