NeoCities HTML Template
<!DOCTYPE html>
<html dir="auto">
<head>
<title>NeoCities HTML Template</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@charset "utf-8";
:root {
--main-bg-color: #00006b;
--main-color: #fff4e6;
--alternate-bg-color: #1c0021;
--alternate-color: #fffdeb;
--main-border-color: #f43f32;
--link-color: #ff0000;
}
@media (prefers-color-scheme: dark) {
:root {
--main-bg-color: #fff4e6;
--main-color: #00006b;
--alternate-bg-color: #fffdeb;
--alternate-color: #1c0021;
--main-border-color: #f43f32;
--link-color: #ff0000;
}
}
html {
font-size: 100%;
font-family: -apple-system, BlinkMacSystemFont, "helvetica neue", helvetica, roboto, noto, "segoe ui", arial, sans-serif;
line-height: 1.4;
}
body {
margin: 0;
padding: 1em;
background-color: var(--main-bg-color);
color: var(--main-color);
}
@media (max-device-width: 480px) {}
@media (min-device-width: 481px) {
body {
margin: auto;
max-width: 600px;
}
}
blockquote {
font-style: italic;
margin: 1.5em 2em;
padding: 1em;
background-color: var(--alternate-bg-color);
color: var(--alternate-color);
}
a {
color: var(--link-color);
}
pre {
display: block;
overflow: scroll;
width: 100%;
background-color: var(--alternate-bg-color);
padding: .5em 1em;
margin: 1em 0;
}
code {
background-color: var(--alternate-bg-color);
color: var(--alternate-color);
font-family: Menlo, Courier, sans-serif;
padding: 2px 3px;
}
table {
margin: 1.5em 0;
border: 1px solid var(--main-border-color);
border-collapse: collapse;
}
th {
padding: .25em .5em;
background: var(--alternate-bg-color);
border: 1px solid var(--main-border-color);
}
td {
padding: .25em .5em;
border: 1px solid var(--main-border-color);
}
img {
max-width: 90%;
}
</style>
</head>
<body>
<h1>NeoCities HTML Template</h1>
<p><!DOCTYPE html>
<html dir="auto"></p>
<head>
<title>NeoCities HTML Template</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@charset "utf-8";
<pre><code>:root {
--main-bg-color: #00006b;
--main-color: #fff4e6;
--alternate-bg-color: #1c0021;
--alternate-color: #fffdeb;
--main-border-color: #f43f32;
--link-color: #ff0000;
}
@media (prefers-color-scheme: dark) {
:root {
--main-bg-color: #fff4e6;
--main-color: #00006b;
--alternate-bg-color: #fffdeb;
--alternate-color: #1c0021;
--main-border-color: #f43f32;
--link-color: #ff0000;
}
}
html {
font-size: 100%;
font-family: -apple-system, BlinkMacSystemFont, "helvetica neue", helvetica, roboto, noto, "segoe ui", arial, sans-serif;
line-height: 1.4;
}
body {
margin: 0;
padding: 1em;
background-color: var(--main-bg-color);
color: var(--main-color);
}
@media (max-device-width: 480px) {}
@media (min-device-width: 481px) {
body {
margin: auto;
max-width: 600px;
}
}
blockquote {
font-style: italic;
margin: 1.5em 2em;
padding: 1em;
background-color: var(--alternate-bg-color);
color: var(--alternate-color);
}
a {
color: var(--link-color);
}
pre {
display: block;
overflow: scroll;
width: 100%;
background-color: var(--alternate-bg-color);
padding: .5em 1em;
margin: 1em 0;
}
code {
background-color: var(--alternate-bg-color);
color: var(--alternate-color);
font-family: Menlo, Courier, sans-serif;
padding: 2px 3px;
}
table {
margin: 1.5em 0;
border: 1px solid var(--main-border-color);
border-collapse: collapse;
}
th {
padding: .25em .5em;
background: var(--alternate-bg-color);
border: 1px solid var(--main-border-color);
}
td {
padding: .25em .5em;
border: 1px solid var(--main-border-color);
}
img {
max-width: 90%;
}
</code></pre>
<p></style>
</head></p>
<body>
[[draft]]</body>
<footer>
<p><a href="https://twitter.com/NeoYokel">Twitter</a> - <a href="https://mastodon.social/@DavidBlue">Mastodon</a> - <a href="https://t.me/davidblue">Telegram</a></p>
</footer>
</html>
</body>
<footer>
<p><a href="https://twitter.com/NeoYokel">Twitter</a> - <a href="https://mastodon.social/@DavidBlue">Mastodon</a> - <a href="https://t.me/davidblue">Telegram</a></p>
</footer>
</html>