308 lines
6.6 KiB
HTML
308 lines
6.6 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>{{ partial "title.txt" . }}</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<link rel="canonical" href="{{ .Permalink }}">
|
|
{{ range .AlternativeOutputFormats -}}
|
|
{{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
|
|
{{ end -}}
|
|
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/normalize.css">
|
|
<style>
|
|
html {
|
|
background-color: black;
|
|
color: #dfdfdf;
|
|
}
|
|
|
|
/* ubuntu-font */
|
|
@font-face {
|
|
font-family: "UbuntuMono";
|
|
src: local('UbuntuMono-B'),
|
|
url("{{ .Site.BaseURL }}fonts/UbuntuMono-Bold.ttf");
|
|
font-weight: bold;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "UbuntuMono";
|
|
src: local('UbuntuMono-RI'),
|
|
url("{{ .Site.BaseURL }}fonts/UbuntuMono-Italic.ttf");
|
|
font-style: italic;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "UbuntuMono";
|
|
src: local('UbuntuMono-R'),
|
|
url("{{ .Site.BaseURL }}fonts/UbuntuMono-Regular.ttf");
|
|
}
|
|
|
|
#background {
|
|
position: fixed;
|
|
z-index: -1;
|
|
background-color: rgb(47, 41, 41);
|
|
/*rgb(153, 34, 13);*/
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
@keyframes backgroundFallin {
|
|
00% {
|
|
height: 0%;
|
|
}
|
|
|
|
10% {
|
|
height: 0%;
|
|
}
|
|
|
|
50% {
|
|
height: 100%;
|
|
}
|
|
|
|
65% {
|
|
height: 80%;
|
|
}
|
|
|
|
80% {
|
|
height: 100%;
|
|
}
|
|
|
|
90% {
|
|
height: 90%;
|
|
}
|
|
|
|
100% {
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
@keyframes headspin {
|
|
0% {
|
|
transform: rotate(-760deg) scale(0, 0);
|
|
}
|
|
|
|
100% {
|
|
transform: rotate(0deg) scale(1, 1);
|
|
}
|
|
}
|
|
|
|
@keyframes dealfall {
|
|
0% {
|
|
transform: translateY(-2000%)
|
|
}
|
|
|
|
1% {
|
|
transform: translateY(-200%)
|
|
}
|
|
|
|
100% {
|
|
transform: translateY(0%)
|
|
}
|
|
}
|
|
|
|
body {
|
|
font-family: 'UbuntuMono';
|
|
display: flex;
|
|
flex-flow: row;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
}
|
|
|
|
body>header {
|
|
width: 100%;
|
|
position: absolute;
|
|
text-align: center;
|
|
align-content: center;
|
|
display: flex;
|
|
flex-flow: row;
|
|
}
|
|
|
|
body>header h1 {
|
|
display: flex;
|
|
flex-flow: row;
|
|
margin: 0;
|
|
}
|
|
|
|
#main {
|
|
flex: auto;
|
|
min-height: 100vh;
|
|
overflow: hidden;
|
|
|
|
display: flex;
|
|
flex-flow: column;
|
|
align-items: center;
|
|
}
|
|
|
|
#main>nav,
|
|
#main>main,
|
|
#main>footer {
|
|
padding: 15px;
|
|
}
|
|
|
|
#main>main {
|
|
flex: 1;
|
|
margin: auto;
|
|
}
|
|
|
|
#main>footer {
|
|
padding-top: 50px;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
html {
|
|
background-color: black;
|
|
color: #dfdfdf;
|
|
}
|
|
|
|
article img:not([src$=".jpg"]):not([src$=".jpeg"]) {
|
|
/* prevent transparent images from showing the black background */
|
|
background-color: white;
|
|
border: 5px solid white;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
|
|
/* Article list */
|
|
.article-list {
|
|
max-width: 45em;
|
|
width: 90vw;
|
|
}
|
|
|
|
.article-list article {
|
|
margin: 1.2em 0 0 0;
|
|
}
|
|
|
|
.article-list article>header {
|
|
display: flex;
|
|
flex-flow: row;
|
|
align-items: center;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.article-list article time {
|
|
color: grey;
|
|
}
|
|
|
|
.article-list article h3 {
|
|
display: inline-block;
|
|
margin: 0.5em;
|
|
}
|
|
|
|
.article-list .summary {
|
|
text-align: justify;
|
|
margin: 0 1em;
|
|
}
|
|
|
|
.article-list article small {
|
|
font-weight: normal;
|
|
color: gray;
|
|
}
|
|
|
|
a,
|
|
a:visited {
|
|
color: inherit;
|
|
}
|
|
|
|
article>header {
|
|
text-align: center;
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
article>header time {
|
|
color: gray;
|
|
}
|
|
|
|
article {
|
|
max-width: 45em;
|
|
width: 90vw;
|
|
text-align: justify;
|
|
}
|
|
|
|
table {
|
|
margin: auto;
|
|
width: 90%;
|
|
background: #221d1d;
|
|
}
|
|
|
|
table,
|
|
th,
|
|
td {
|
|
padding: 15px;
|
|
text-align: left;
|
|
border-color: #4c4c4c;
|
|
border-collapse: collapse;
|
|
border: 1px solid black;
|
|
}
|
|
|
|
article video,
|
|
article img {
|
|
max-width: 100%;
|
|
}
|
|
|
|
article img[src$='#center'] {
|
|
display: block;
|
|
margin: 0.7rem auto;
|
|
}
|
|
|
|
article img[src$='#floatleft'] {
|
|
float: left;
|
|
margin: 0.7rem;
|
|
}
|
|
|
|
article img[src$='#floatright'] {
|
|
float: right;
|
|
margin: 0.7rem;
|
|
}
|
|
|
|
.image-row {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: 1rem;
|
|
/* space btwn images */
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.image-row img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
article .footnotes {
|
|
font-size: 0.75em;
|
|
clear: inline-end;
|
|
}
|
|
|
|
pre {
|
|
background-color: #272822;
|
|
color: #f8f8f2;
|
|
padding: 15px;
|
|
overflow: auto;
|
|
|
|
tab-size: 2;
|
|
-moz-tab-size: 2;
|
|
}
|
|
|
|
p code,
|
|
li code {
|
|
color: #930d72;
|
|
}
|
|
|
|
.centerdiv {
|
|
margin: 0;
|
|
position: absolute;
|
|
display: flex;
|
|
width: 100%;
|
|
height: 90%;
|
|
z-index: -1;
|
|
}
|
|
|
|
.logo_anim {
|
|
margin: auto;
|
|
max-height: 60%;
|
|
max-width: 60%;
|
|
}
|
|
</style>
|
|
<link rel="shortcut icon" type="image/x-icon" href="{{ .Site.BaseURL }}\img\favicon.ico" />
|
|
</head>
|
|
|
|
<body> |