theme: make chapter a marker instead of a nested div #210

this makes styling easier as document has the same DOM for chapter and default
This commit is contained in:
Sören Weber 2022-02-27 09:53:33 +01:00
parent fe67f0c630
commit 7eee4a86d8
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589
5 changed files with 20 additions and 34 deletions

View file

@ -25,16 +25,14 @@
<body class="default-animation" data-url="/">
<div id="body default-animation" style="margin-left:0px;">
<div id="overlay"></div>
<div id="chapter">
<main id="body-inner">
<h1>{{ T "title-404" }}</h1>
<p></p>
<p>{{ T "message-404" }}</p>
<p></p>
<p><a href="{{ "" | relLangURL }}">{{ T "Go-to-homepage" }}</a></p>
<p><img src="{{ "/images/gopher-404.jpg" | relURL }}" style="width:50%" alt="Page not found!"></p>
</main>
</div>
<main id="body-inner" class="chapter">
<h1>{{ T "title-404" }}</h1>
<p></p>
<p>{{ T "message-404" }}</p>
<p></p>
<p><a href="{{ "" | relLangURL }}">{{ T "Go-to-homepage" }}</a></p>
<p><img src="{{ "/images/gopher-404.jpg" | relURL }}" style="width:50%" alt="Page not found!"></p>
</main>
</div>
</body>
</html>

View file

@ -4,9 +4,6 @@
{{- end }}
</footer>
</main><!-- #body-inner -->
{{- if .Params.chapter }}
</div> <!-- end chapter-->
{{- end }}
{{- partial "custom-comments.html" . }}
</div>
</div><!-- #body -->

View file

@ -98,10 +98,7 @@
{{- partial "toc.html" . }}
{{- end }}
</div></div>
{{- if .Params.chapter }}
<div id="chapter">
{{- end }}
<main id="body-inner">
<main id="body-inner"{{if .Params.chapter}} class="chapter"{{end}}>
<div id="head-tags">
{{- partial "tags.html" . }}
</div>

View file

@ -73,7 +73,7 @@ pre {
hr{
border-bottom: 1px solid #ddd;
}
#chapter h1 {
#body-inner.chapter h1 {
border-bottom: 1px solid #ddd;
}
.footline {

View file

@ -52,16 +52,16 @@ body {
line-height: 1.574;
}
body #chapter h1 {
body #body-inner.chapter h1 {
font-size: 3.5rem;
}
@media only all and (min-width: 48em) and (max-width: 59.938em) {
body #chapter h1 {
body #body-inner.chapter h1 {
font-size: 3rem;
}
}
@media only all and (max-width: 47.938em) {
body #chapter h1 {
body #body-inner.chapter h1 {
font-size: 2rem;
}
}
@ -392,29 +392,23 @@ th {
}
}
#chapter {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
padding: 2rem 0;
#body-inner.chapter {
margin-left: auto;
margin-right: auto;
padding: 2rem 9rem;
}
#chapter #body-inner {
max-width: 80%;
}
#chapter #body-inner h3:first-of-type {
#body-inner.chapter h3:first-of-type {
font-weight: 200;
text-align: center;
}
#chapter h1 {
#body-inner.chapter h1 {
border-bottom: 4px solid rgba( 134, 134, 134, .125 );
font-size: 5rem;
}
#chapter p {
#body-inner.chapter p {
font-size: 1.2rem;
text-align: justify;
}