セクション表示系
セクションごとに区切る。
code:lib.css
.app:not(.presentation) .line.section-title:not(.line-title) {
position: relative;
}
.app:not(.presentation) .line.section-title:not(.line-title) .text {
padding-top: 1em;
}
.app:not(.presentation) .line.section-title:not(.line-title):before {
content: "";
display: block;
width: 111%;
position: absolute;
left: -49px;
border: 1px lightgray solid;
}
code:lib.css
.app {
counter-reset: section;
}
.app:not(.presentation) .line.section-title:not(.line-title) {
position: relative;
}
.app:not(.presentation) .line.section-title:not(.line-title):after {
z-index: 500; /* テロメアよりは上/ヘッダよりは下 適宜二分探索してくれ……。 */
counter-increment: section;
content: counter(section);
display: inline-block;
width: 1.6em;
height: 1.6em;
position: absolute;
top: -10px;
left: -55px;
border-radius: 50%;
font: 600 normal 90%/1.6 'Century Gothic', Arial, sans-serif;
text-align: center;
white-space: nowrap
}