Files
Simon Nitzsche da6dba7db1 Update default.html
Styling overhaul for the page.
2024-11-17 19:34:27 +01:00

139 lines
3.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{{ page.title }} - {{ site.title }}</title>
<link rel="icon" type="image/x-icon" href="{{site.github.owner_gravatar_url}}">
<style>
* {
margin: 0;
padding: 0;
}
img {
width: 25vw;
}
h2 {
text-align: center;
margin-top: 15px;
margin-bottom: 48px;
letter-spacing: 0.1rem;
font-size: 2rem;
}
h3, p {
margin-bottom: 24px;
}
h3 {
letter-spacing: 0.07rem;
}
p {
letter-spacing: 0.02rem;
}
dl.faq > dt {
font-style: italic;
}
dl.faq > dt::before {
content: "Q: ";
}
dl.faq > dd > p:first-of-type::before {
content: "A: ";
}
.logo {
width: 9vw;
background: white;
padding: 20px;
border-radius: 50%;
border: 2px solid;
}
@media screen and (max-width: 800px) {
img {
width: 80vw;
}
.logo {
width: 20vw;
}
}
.credit {
margin-bottom: 50px;
}
html {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
}
body {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
}
.bg0 {
width: 100%;
height: 100%;
background: linear-gradient(to top, rgba(255, 255, 255, 0) 80%,
rgba(255, 255, 255, 1)), linear-gradient(to bottom, rgba(255, 255, 255, 0) 80%,
rgba(255, 255, 255, 1)), url('/bg0.webp') no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
position: fixed;
top: 0;
z-index: -2;
}
body > div:first-child > div:first-child {
background: #d1eaea8c;
padding: 20px;
border-radius: 25px;
backdrop-filter: blur(30px) contrast(0.9);
border: 1px solid #7baa7947;
}
b {
margin-top: 3px;
}
</style>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
</head>
<body style="font-family: 'Poppins', sans-serif; ">
<div style="text-align: center;">
<div style="margin: 50px auto; min-width: 400px; max-width: 1200px; width: 60%; text-align: start;">
<div style="text-align: center;"><img src="/DLU-4-256.webp" class="logo"></div>
{{ content }}
</div>
<div>
<a href="https://twitter.com/darkflameuniv?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-size="large"
data-dnt="true" data-show-count="false">Follow @darkflameuniv</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
<br><br>
<div class="bg0" style="min-height: 1000px;"></div>
</div>
</body>
</html>