first commit

static/css/themes/dark.css

@@ -0,0 +1,132 @@
+@import url("dark-chroma.css");
+
+a {
+	color: #A1A1EA;
+}
+
+.highlight > * {
+	border-color: #505050;
+}
+
+:not(pre) > code {
+	/* inline code elements */
+	background-color: rgba(90, 90, 90, 0.25);
+}
+
+a > code {
+	background-color: rgba(65, 65, 170, 0.3);
+}
+
+.section-list li > * {
+	background-color: rgba(90, 90, 90, 0.25);
+}
+
+.section-list li > a {
+	background-color: rgba(65, 65, 170, 0.3);
+}
+
+/*
+body {
+	color: rgb(210, 210, 210);
+	background-color: rgb(27, 27, 27);
+}
+*/
+body {
+        color: rgb(210, 210, 210);
+        background-color: rgb(14, 14, 14);
+}
+
+
+blockquote {
+	color: rgb(170, 170, 170);
+	border-left: 0.25em solid #444;
+}
+
+hr {
+	border: 1px solid rgb(110, 110, 110);
+}
+
+img.color-adapting-image,
+figure.color-adapting-image img {
+	filter: invert(85%) hue-rotate(180deg);
+	/* hue rotate trick from: https://medium.com/@mwichary/dark-theme-in-a-day-3518dde2955a */
+}
+
+.header {
+	background-color: rgb(31, 51, 31); /* still want a background color before the image loads */
+}
+
+.links, .links li {
+	border-color: #383838;
+}
+/*
+.main {
+	background-color: rgb(14, 14, 14);
+	box-shadow: none;
+}
+*/
+.main {
+        background-color: rgb(26, 28, 28);
+        box-shadow: none;
+}
+
+
+.footer {
+	color: rgb(160, 160, 160);
+}
+
+.title-header-date {
+	color: rgb(150, 150, 150);
+}
+
+.title-list-date {
+	color: rgb(150, 150, 150);
+}
+
+.table-of-contents {
+	border-color: #505050;
+	background-color: #1A1A1A;
+}
+
+.notice {
+	border-width: 2px;
+	border-style: solid;
+	border-top: 0;
+}
+
+.notice .notice-title .notice-title-icon {
+	filter: invert(80%);
+}
+
+.notice.note {
+	background-color: #001320;
+	border-color: #00487B;
+}
+
+.notice.note .notice-title {
+	background-color: #00487B;
+}
+
+.notice.tip {
+	background-color: #132000;
+	border-color: #105600;
+}
+
+.notice.tip .notice-title {
+	background-color: #105600;
+}
+
+.notice.warning {
+	background-color: #200000;
+	border-color: #700000;
+}
+
+.notice.warning .notice-title {
+	background-color: #700000;
+}
+
+@media only screen and (max-width: 400pt) {
+	.links {
+		background-color: rgb(23, 23, 23);
+	}
+}