1 files changed, 136 insertions, 0 deletions
diff --git a/static/global.css b/static/global.css
new file mode 100644
index 0000000..6a2ec49
--- /dev/null
+++ b/static/global.css
@@ -0,0 +1,136 @@
+
+
+* {
+	--bg: #050505;
+	--dim-bg: #444444;
+	--code-bg: #222222;
+	--text: #EEEEEE;
+	--dim-text: #CDCDCD;
+	--link: #00E800;
+	--link-active: #22FF22;
+	overflow-wrap: break-word;
+}
+
+@media (prefers-color-scheme: light) {
+	* {
+		--bg: #FAFAFA;
+		--dim-bg: #D0D0D0;
+		--code-bg: #E0E0E0;
+		--text: #000000;
+		--dim-text: #555555;
+		--link: #CC6600;
+		--link-active: #FF8000;
+	}
+}
+
+body {
+	--transition: .15s;
+	background-color: var(--bg);
+	color: var(--text);
+	margin: 2em .5em;
+	font-family: sans-serif;
+}
+
+p {
+	text-align: justify;
+}
+
+@media screen and (orientation: landscape) {
+	body {
+		margin: 2em 20%;
+	}
+}
+
+h1 {
+	text-align: center;
+	padding: 1em;
+}
+
+header {
+	position: absolute;
+	top: 0;
+	left: 0;
+	padding: .5rem;
+	text-align: center;
+	width: 100vw;
+	box-sizing: border-box;
+}
+
+.x-scroll {
+	overflow-x: auto;
+}
+pre {
+	padding: 1em;
+	background-color: var(--code-bg);
+	width: fit-content;
+}
+
+figure > img {
+	width: 100%;
+}
+
+.profilepicture {
+	--width: min(40%, 10rem);
+	border: 3px solid gold;
+	border-radius: 50%;
+	width: var(--width);
+	margin: 2rem calc((100% - var(--width)) / 2) 0 calc((100% - var(--width)) / 2);
+}
+
+.pixelart {
+	image-rendering: pixelated;
+}
+
+a {
+	color: var(--link);
+	transition: color var(--transition);
+}
+a:hover,a:focus {
+  color: var(--link-active);
+}
+#skiptocontent {
+	opacity: 0;
+	position: absolute;
+	transition: opacity var(--transition);
+	top: -5em;
+	left: 1em;
+	
+}
+#skiptocontent:focus {
+	top: 1em;
+	opacity: 1;
+}
+
+nav.menu > a {
+	display: block;
+	background-color: var(--bg);
+	transition: background-color var(--transition), color var(--transition);
+	border: 0 solid black;
+	text-decoration: none;
+	padding: .3em;
+}
+nav.menu > a:first-child {
+	border-radius: .5em .5em 0 0;
+}
+nav.menu > a:last-child {
+	border-radius: 0 0 .5em .5em;
+}
+nav.menu > a:only-child {
+	border-radius: .5em;
+}
+nav.menu > a:hover,nav.menu > a:focus {
+	background-color: var(--dim-bg);
+}
+nav.menu > a > p:not(:first-child) {
+	color: var(--dim-text);
+}
+nav.menu > a:hover > p:not(:first-child) {
+	color: var(--text);
+}
+nav.menu > a > p {
+	margin: 0;
+	padding: .1em;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}