settings
code:style.css
/* ＃で始まるタグをラベル風にする */
display: inline-block;
padding: 2px 8px;
margin: 0 8px 10px 0;
font-size: 0.8em;
border-radius: 3px;
transition: .3s;
-webkit-transform: scale(1);
transform: scale(1);
}
/* 小見出し用 */
.deco-\# {
font-weight: bold;
font-size: 110%;
border-bottom: solid 2px #ccc; padding-bottom: .2rem;
}
/* アスタリスク4つの強調文字 */
.line strong.level-4 {
width: 100%;
font-size: 1.3em;
border-bottom: dashed 1px var(--navbar-bg, rgba(53, 59, 72, 0.6));
line-height: 1.5;
padding: .8rem;
padding-left: 1rem;
}
/* アスタリスク2つの強調文字 */
.line strong.level-2 {
font-size: 1.3em;
border-left: solid .5rem var(--navbar-bg, rgba(53, 59, 72, 0.6));
line-height: 1.5;
padding: .8rem;
padding-left: 1rem;
}
/* スマホ表示を調整 */
@media screen and (max-width: 768px) {
.line strong.level-4 {
font-size: 130%;
line-height: 1.8;
font-weight: bold;
padding: .7rem;
}
.line strong.level-2 {
font-size: 110%;
font-weight: bold;
line-height: 2;
}
.deco-\# {
font-size: 100%;
}
}
/* タイトル表示 */
.line.line-title {
font-weight: bold;
border-bottom: solid 3px #ccc; line-height: 1.4;
color: var(--line-title-color, #000); }
.line.line-title .text {
font-size: 1.2em;
padding-bottom: .5em;
}
/* スマホ表示用に調整 */
@media screen and (max-width: 670px) {
.line.line-title .text {
font-size: 1.8rem;
}
}