Fix HTML indentation

This commit is contained in:
Tanner Collin 2022-07-15 15:04:24 -06:00
parent 00d582d0c7
commit d1057534ec
4 changed files with 303 additions and 316 deletions

View File

@ -3,7 +3,7 @@
{% block title %}{{ article.title|striptags }} | {{ SITENAME }}{% endblock %}
{% block head %}
{{ super() }}
{{ super() }}
{% if article.date %}
<meta name="date" content="{{article.date}}" />
@ -29,7 +29,6 @@
{% endblock %}
{% block content %}
{% if article.wide %}
<div class="content content-wide">
{% else %}
@ -50,7 +49,9 @@
</header>
<hr />
<article>
{{ article.content }}
{{ article.content }}
</article>
</div>

View File

@ -13,6 +13,7 @@
<style>
{% include 'style.css' %}
</style>
<script defer src="/theme/instant-page.js"></script>
@ -33,7 +34,7 @@
<span class="wname">Webring:</span> <a href="https://jason.schwarzenberger.co.nz/" class="wprev">&lt; Previous</a> | <a href="https://webring.t0.vc" class="windex">Index</a> | <a href="https://udia.ca" class="wnext">Next &gt;</a>
</p>
<p class="footer">
© 20122021 Tanner Collin
© 20122022 Tanner Collin
</p>
</body>
</html>

View File

@ -1,29 +1,11 @@
{% extends "base.html" %}
{% block head %}
{{ super() }}
{{ super() }}
<meta name="description" content="The personal website of Tanner Collin." />
<meta name="summary" content="The personal website of Tanner Collin." />
{% endblock %}
{% block info %}
<picture>
<source type="image/webp" srcset="/theme/me.webp">
<source type="image/jpeg" srcset="/theme/me.jpg">
<img src="/theme/me.jpg" width="128" height="164" class="me" alt="me smiling wide and looking into the camera lit up brightly">
</picture>
<div class="info">
<h1>Tanner Collin</h1>
<p class="contact-icons">
<a href="mailto:site4@tannercollin.com" rel="noreferrer noopener"><img alt="email" src="/theme/mail.svg" width="20" height="20" /></a>
<a href="https://t.me/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="telegram" src="/theme/telegram.svg" width="20" height="20" /></a>
<a href="https://github.com/tannercollin" target="_blank" rel="noreferrer noopener"><img alt="github" src="/theme/github.svg" width="20" height="20" /></a>
</p>
</div>
{% endblock %}
{% block content %}
<div class="content index">
<p>
@ -59,6 +41,7 @@
<div class="summary">
{{ article.summary }}
</div>
{% endfor %}
<h3>
@ -77,6 +60,7 @@
<div class="summary">
{{ article.summary }}
</div>
{% endfor %}
<h2>Writing</h2>
@ -88,6 +72,7 @@
<div class="summary">
{{ article.summary }}
</div>
{% endfor %}
</div>
{% endblock %}

View File

@ -1,124 +1,124 @@
html {
html {
overflow-y: scroll;
}
}
body {
body {
text-rendering: optimizeLegibility;
font-family: serif;
}
}
a {
a {
text-decoration: none;
outline: none;
}
}
a.external {
a.external {
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23fff' stroke='%23000' d='M1.5 4.518h5.982V10.5H1.5z'/%3E%3Cpath fill='%23000' d='M5.765 1H11v5.39L9.427 7.937l-1.31-1.31L5.393 9.35l-2.69-2.688 2.81-2.808L4.2 2.544z'/%3E%3Cpath fill='%23fff' d='m9.995 2.004.022 4.885L8.2 5.07 5.32 7.95 4.09 6.723l2.882-2.88-1.85-1.852z'/%3E%3C/svg%3E%0A");
background-position: center right;
background-repeat: no-repeat;
padding-right: 15px;
}
}
.info h1 {
.info h1 {
font: 1.1rem/1.0 sans-serif;
}
}
.index h3 {
.index h3 {
font: 1.1rem/1.5 serif;
}
}
.source {
.source {
font: 0.9rem/1.5 serif;
}
}
pre {
pre {
font-size: 0.9rem;
line-height: 1.2;
padding: 1rem;
overflow-x: auto;
}
}
:not(pre)>code {
:not(pre)>code {
padding: 0 2px;
font-size: 0.8rem;
}
}
.container {
.container {
max-width: 56rem;
margin: 2rem auto 12rem auto;
}
}
.footer {
.footer {
font: 0.9rem/1.5 serif;
text-align: center;
}
}
.toc {
.toc {
float: right;
padding: 0.75rem;
padding-top: 0;
margin-left: 0.75rem;
}
}
.toc ul {
.toc ul {
padding-left: 1.2rem;
margin: 0;
}
}
.toc li {
.toc li {
margin-top: 0.75rem;
}
}
.content p.metadata {
.content p.metadata {
font: 0.9rem/1.0 serif;
font-style: italic;
}
}
.content div.summary p {
.content div.summary p {
margin-top: -0.6rem;
margin-left: 1.5rem;
}
}
.content {
.content {
max-width: 36rem;
}
}
.content-wide {
.content-wide {
max-width: none;
}
}
.content p {
.content p {
font: 1.1rem/1.5 serif;
}
}
.content ul {
.content ul {
padding-left: 1.1rem;
}
}
.content li {
.content li {
font: 1.1rem/1.5 serif;
}
}
.content img {
.content img {
width: 100%;
max-width: 36rem;
height: auto;
}
}
.content .aside {
.content .aside {
display: inline;
float: left;
position: relative;
width: 8rem;
margin-left: -9rem;
font-size: 0.9rem;
}
}
.toclink:not(:hover) {
.toclink:not(:hover) {
border-bottom: none;
}
}
@media screen and (min-width:36rem) {
@media screen and (min-width:36rem) {
.content {
margin-left: 10rem;
}
@ -149,9 +149,9 @@ pre {
height: 1.25rem;
margin-left: 0.5rem;
}
}
}
@media screen and (max-width:36rem) {
@media screen and (max-width:36rem) {
.bar {
overflow: auto;
margin-top: -0.5rem;
@ -184,46 +184,46 @@ pre {
height: 1.25rem;
margin-right: 1rem;
}
}
}
body {
body {
background-color: #fff;
color: #000;
}
}
a {
a {
color: #000;
border-bottom: 1px solid #000;
}
}
a:visited {
a:visited {
color: #555;
border-bottom: 1px solid #555;
}
}
a.return-home:visited, a.toclink:visited, .toc a:visited {
a.return-home:visited, a.toclink:visited, .toc a:visited {
color: inherit;
border-bottom: inherit;
}
}
pre {
pre {
background-color: #ddd;
}
}
:not(pre)>code {
:not(pre)>code {
background-color: #ddd;
}
}
.toc {
.toc {
background-color: #ddd;
}
}
.content p.metadata {
.content p.metadata {
color: #555;
}
}
@media (prefers-color-scheme: dark) {
@media (prefers-color-scheme: dark) {
body {
background-color: #000;
color: #fff;
@ -262,4 +262,4 @@ pre {
.contact-icons img {
filter: invert(1);
}
}
}