custom css style, thanks trimill

1 files changed, 666 insertions, 137 deletions

diff --git a/cgit.css b/cgit.css
index 1b848cf..3a9010f 100644..100755
--- a/cgit.css
+++ b/cgit.css
@@ -1,15 +1,185 @@
+/* Light theme
+:root {
+	--c-fg0: #000;
+	--c-fg1: #777;
+	--c-fg2: #ccc;
+	--c-bg0: #f7f7f7;
+	--c-bg1: #eee;
+	--c-bg2: #ccc;
+	--c-border1: #ccc;
+	--c-border2: #777;
+
+	--c-link: #00f;
+
+	--c-bg-row-odd: #fff;
+	--c-bg-row-even: #f7f7f7;
+	--c-bg-row-hover: #eee;
+
+	--c-age-mins: #090;
+	--c-age-hours: #070;
+	--c-age-days: #151;
+	--c-age-weeks: #555;
+	--c-age-months: #777;
+	--c-age-years: #aaa;
+
+	--c-diffstat-add: #5c5;
+	--c-diffstat-del: #c55;
+
+	--c-diff-hunk: #00a;
+	--c-diff-add: #091;
+	--c-diff-del: #a01;
+
+	--c-diffbg-add: #cfc;
+	--c-diffbg-add-dark: #aca;
+	--c-diffbg-del: #fcc;
+	--c-diffbg-del-dark: #caa;
+	--c-diffbg: #ffc;
+	--c-diffbg-dark: #cca;
+	--c-diffbg-hunk: #ccf;
+
+	--c-deco-bg: #f88;
+	--c-deco-border: #700;
+	--c-deco-branch-bg: #8f8;
+	--c-deco-branch-border: #070;
+	--c-deco-tag-bg: #ff8;
+	--c-deco-tag-border: #770;
+	--c-deco-anno-bg: #fc8;
+	--c-deco-anno-border: #770;
+	--c-deco-remote-bg: #ccf;
+	--c-deco-remote-border: #007;
+
+	--c-col1: #a00;
+	--c-col2: #0a0;
+	--c-col3: #aa0;
+	--c-col4: #00a;
+	--c-col5: #a0a;
+	--c-col6: #0aa;
+
+	--c-error: #a00;
+
+	--h-col-fg: var(--c-fg0);
+	--h-col-bg: var(--c-bg0);
+	--h-col-gray: #4d4754;
+	--h-col-red: #a63a3a;
+	--h-col-green: #759438;
+	--h-col-yellow: #de7e54;
+	--h-col-blue: #3d67a2;
+	--h-col-purple: #7b5687;
+	--h-col-cyan: #578c7c;
+}
+*/
+
+:root {
+	--c-fg0: #eee;
+	--c-fg1: #bbb;
+	--c-fg2: #777;
+	--c-bg0: #14171d;
+	--c-bg1: #333;
+	--c-bg2: #666;
+	--c-border1: #666;
+	--c-border2: #444;
+
+	--c-link: #88f;
+
+	--c-bg-row-odd: #14171d;
+	--c-bg-row-even: #1e2127;
+	--c-bg-row-hover: #282b32;
+
+	--c-age-mins: #8e8;
+	--c-age-hours: #4c4;
+	--c-age-days: #282;
+	--c-age-weeks: #aaa;
+	--c-age-months: #888;
+	--c-age-years: #555;
+
+	--c-diffstat-add: #4a4;
+	--c-diffstat-del: #a44;
+
+	--c-diff-hunk: #6ae;
+	--c-diff-add: #5e6;
+	--c-diff-del: #f56;
+
+	--c-diffbg-add: #464;
+	--c-diffbg-add-dark: #232;
+	--c-diffbg-del: #644;
+	--c-diffbg-del-dark: #322;
+	--c-diffbg: #444;
+	--c-diffbg-dark: #222;
+	--c-diffbg-hunk: #335;
+
+	--c-deco-bg: #b55;
+	--c-deco-border: #600;
+	--c-deco-branch-bg: #5b5;
+	--c-deco-branch-border: #060;
+	--c-deco-tag-bg: #ba3;
+	--c-deco-tag-border: #650;
+	--c-deco-anno-bg: #b85;
+	--c-deco-anno-border: #630;
+	--c-deco-remote-bg: #55b;
+	--c-deco-remote-border: #006;
+
+	--c-col1: #a22;
+	--c-col2: #2a2;
+	--c-col3: #aa2;
+	--c-col4: #22a;
+	--c-col5: #a2a;
+	--c-col6: #2aa;
+
+	--c-error: #d66;
+
+	--h-col-fg: var(--c-fg0);
+	--h-col-bg: var(--c-bg0);
+	--h-col-gray: #ada0a8;
+	--h-col-red: #cc5c5c;
+	--h-col-green: #97bd5e;
+	--h-col-yellow: #f0c767;
+	--h-col-blue: #789ebf;
+	--h-col-purple: #a97fb3;
+	--h-col-cyan: #82bfb3;
+}
+
+/*
+ * Additions
+ */
+
+body {
+	background: var(--c-bg0);
+	tab-size: 4;
+}
+
+div#cgit select, div#cgit input {
+	color: var(--c-fg0);
+	background: var(--c-bg1);
+	border: 1px solid var(--c-border2);
+	border-radius: 0.25em;
+	padding: 0.2em;
+}
+
+div#cgit input[type=text], div#cgit input[type=search] {
+	background: var(--c-bg0);
+}
+
+div#cgit hr {
+	border: solid 1.5px var(--c-border1);
+	margin: 2em -2em 2em -2em;
+}
+
+/*
+ * cgit styles
+ */
+
 div#cgit {
 	padding: 0em;
 	margin: 0em;
 	font-family: sans-serif;
 	font-size: 10pt;
-	color: #333;
-	background: white;
+	color: var(--c-fg0);
+	background: var(--c-bg0);
 	padding: 4px;
 }
 
 div#cgit a {
-	color: blue;
+	color: var(--c-link);
 	text-decoration: none;
 }
 
@@ -38,7 +208,7 @@ div#cgit table#header td.main {
 }
 
 div#cgit table#header td.main a {
-	color: #000;
+	color: var(--c-fg0);
 }
 
 div#cgit table#header td.form {
@@ -56,13 +226,13 @@ div#cgit table#header td.form select {
 }
 
 div#cgit table#header td.sub {
-	color: #777;
-	border-top: solid 1px #ccc;
+	color: var(--c-fg1);
+	border-top: solid 1px var(--c-border1);
 	padding-left: 10px;
 }
 
 div#cgit table.tabs {
-	border-bottom: solid 3px #ccc;
+	border-bottom: solid 3px var(--c-border1);
 	border-collapse: collapse;
 	margin-top: 2em;
 	margin-bottom: 0px;
@@ -76,13 +246,13 @@ div#cgit table.tabs td {
 
 div#cgit table.tabs td a {
 	padding: 2px 0.75em;
-	color: #777;
+	color: var(--c-fg1);
 	font-size: 110%;
 }
 
 div#cgit table.tabs td a.active {
-	color: #000;
-	background-color: #ccc;
+	color: var(--c-fg0);
+	background-color: var(--c-bg2);
 }
 
 div#cgit table.tabs a[href^="http://"]:after, div#cgit table.tabs a[href^="https://"]:after {
@@ -109,14 +279,14 @@ div#cgit table.tabs td.form select {
 div#cgit div.path {
 	margin: 0px;
 	padding: 5px 2em 2px 2em;
-	color: #000;
-	background-color: #eee;
+	color: var(--c-fg0);
+	background-color: var(--c-bg1);
 }
 
 div#cgit div.content {
 	margin: 0px;
 	padding: 2em;
-	border-bottom: solid 3px #ccc;
+	border-bottom: solid 3px var(--c-border1);
 }
 
 
@@ -127,47 +297,43 @@ div#cgit table.list {
 }
 
 div#cgit table.list tr {
-	background: white;
+	background: var(--c-bg0);
 }
 
 div#cgit table.list tr.logheader {
-	background: #eee;
+	background: var(--c-bg1);
 }
 
 div#cgit table.list tr:nth-child(even) {
-	background: #f7f7f7;
+	background: var(--c-bg-row-even);
 }
 
 div#cgit table.list tr:nth-child(odd) {
-	background: white;
+	background: var(--c-bg-row-odd);
 }
 
 div#cgit table.list tr:hover {
-	background: #eee;
+	background: var(--c-bg-row-hover);
 }
 
 div#cgit table.list tr.nohover {
-	background: white;
+	background: var(--c-bg0);
 }
 
 div#cgit table.list tr.nohover:hover {
-	background: white;
+	background: var(--c-bg0);
 }
 
 div#cgit table.list tr.nohover-highlight:hover:nth-child(even) {
-	background: #f7f7f7;
+	background: var(--c-bg-row-even);
 }
 
 div#cgit table.list tr.nohover-highlight:hover:nth-child(odd) {
-	background: white;
+	background: var(--c-bg-row-odd);
 }
 
 div#cgit table.list th {
 	font-weight: bold;
-	/* color: #888;
-	border-top: dashed 1px #888;
-	border-bottom: dashed 1px #888;
-	*/
 	padding: 0.1em 0.5em 0.05em 0.5em;
 	vertical-align: baseline;
 }
@@ -183,27 +349,27 @@ div#cgit table.list td.commitgraph {
 }
 
 div#cgit table.list td.commitgraph .column1 {
-	color: #a00;
+	color: var(--c-col1);
 }
 
 div#cgit table.list td.commitgraph .column2 {
-	color: #0a0;
+	color: var(--c-col2);
 }
 
 div#cgit table.list td.commitgraph .column3 {
-	color: #aa0;
+	color: var(--c-col3);
 }
 
 div#cgit table.list td.commitgraph .column4 {
-	color: #00a;
+	color: var(--c-col4);
 }
 
 div#cgit table.list td.commitgraph .column5 {
-	color: #a0a;
+	color: var(--c-col5);
 }
 
 div#cgit table.list td.commitgraph .column6 {
-	color: #0aa;
+	color: var(--c-col6);
 }
 
 div#cgit table.list td.logsubject {
@@ -218,16 +384,16 @@ div#cgit table.list td.logmsg {
 }
 
 div#cgit table.list td a {
-	color: black;
+	color: var(--c-fg0);
 }
 
 div#cgit table.list td a.ls-dir {
 	font-weight: bold;
-	color: #00f;
+	color: var(--c-link);
 }
 
 div#cgit table.list td a:hover {
-	color: #00f;
+	color: var(--c-link);
 }
 
 div#cgit img {
@@ -261,21 +427,21 @@ div#cgit div#summary {
 div#cgit table#downloads {
 	float: right;
 	border-collapse: collapse;
-	border: solid 1px #777;
+	border: solid 1px var(--c-border2);
 	margin-left: 0.5em;
 	margin-bottom: 0.5em;
 }
 
 div#cgit table#downloads th {
-	background-color: #ccc;
+	background-color: var(--c-bg2);
 }
 
 div#cgit div#blob {
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 }
 
 div#cgit div.error {
-	color: red;
+	color: var(--c-error);
 	font-weight: bold;
 	margin: 1em 2em;
 }
@@ -297,21 +463,21 @@ div#cgit td.ls-mode {
 
 div#cgit table.blob {
 	margin-top: 0.5em;
-	border-top: solid 1px black;
+	border-top: solid 1px var(--c-border2);
 }
 
 div#cgit table.blob td.hashes,
 div#cgit table.blob td.lines {
 	margin: 0; padding: 0 0 0 0.5em;
 	vertical-align: top;
-	color: black;
+	color: var(--c-fg0);
 }
 
 div#cgit table.blob td.linenumbers {
 	margin: 0; padding: 0 0.5em 0 0.5em;
 	vertical-align: top;
 	text-align: right;
-	border-right: 1px solid gray;
+	border-right: 1px solid var(--c-border2);
 }
 
 div#cgit table.blob pre {
@@ -320,14 +486,14 @@ div#cgit table.blob pre {
 
 div#cgit table.blob td.linenumbers a,
 div#cgit table.ssdiff td.lineno a {
-	color: gray;
+	color: var(--c-fg1);
 	text-align: right;
 	text-decoration: none;
 }
 
 div#cgit table.blob td.linenumbers a:hover,
 div#cgit table.ssdiff td.lineno a:hover {
-	color: black;
+	color: var(--c-fg0);
 }
 
 div#cgit table.blame td.hashes,
@@ -346,11 +512,11 @@ div#cgit table.blame td.linenumbers div.alt {
 }
 
 div#cgit table.blame div.alt:nth-child(even) {
-	background: #eee;
+	background: var(--c-bg-row-even);
 }
 
 div#cgit table.blame div.alt:nth-child(odd) {
-	background: white;
+	background: var(--c-bg-row-odd);
 }
 
 div#cgit table.blame td.lines > div {
@@ -369,20 +535,20 @@ div#cgit table.blame .oid {
 
 div#cgit table.bin-blob {
 	margin-top: 0.5em;
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 }
 
 div#cgit table.bin-blob th {
 	font-family: monospace;
 	white-space: pre;
-	border: solid 1px #777;
+	border: solid 1px var(--c-border2);
 	padding: 0.5em 1em;
 }
 
 div#cgit table.bin-blob td {
 	font-family: monospace;
 	white-space: pre;
-	border-left: solid 1px #777;
+	border-left: solid 1px var(--c-border2);
 	padding: 0em 1em;
 }
 
@@ -402,8 +568,8 @@ div#cgit div.cgit-panel {
 
 div#cgit div.cgit-panel table {
 	border-collapse: collapse;
-	border: solid 1px #aaa;
-	background-color: #eee;
+	border: solid 1px var(--c-border2);
+	background-color: var(--c-bg1);
 }
 
 div#cgit div.cgit-panel th {
@@ -454,8 +620,7 @@ div#cgit div.notes-header {
 div#cgit div.notes {
 	white-space: pre;
 	font-family: monospace;
-	border: solid 1px #ee9;
-	background-color: #ffd;
+	border: solid 1px var(--c-border1);
 	padding: 0.3em 2em 0.3em 1em;
 	float: left;
 }
@@ -471,8 +636,8 @@ div#cgit div.diffstat-header {
 
 div#cgit table.diffstat {
 	border-collapse: collapse;
-	border: solid 1px #aaa;
-	background-color: #eee;
+	border: solid 1px var(--c-border2);
+	background-color: var(--c-bg1);
 }
 
 div#cgit table.diffstat th {
@@ -495,19 +660,19 @@ div#cgit table.diffstat td.mode {
 
 div#cgit table.diffstat td span.modechange {
 	padding-left: 1em;
-	color: red;
+	color: var(--c-diff-del);
 }
 
 div#cgit table.diffstat td.add a {
-	color: green;
+	color: var(--c-diff-add);
 }
 
 div#cgit table.diffstat td.del a {
-	color: red;
+	color: var(--c-diff-del);
 }
 
 div#cgit table.diffstat td.upd a {
-	color: blue;
+	color: var(--c-link);
 }
 
 div#cgit table.diffstat td.graph {
@@ -526,15 +691,15 @@ div#cgit table.diffstat td.graph td {
 }
 
 div#cgit table.diffstat td.graph td.add {
-	background-color: #5c5;
+	background-color: var(--c-diffstat-add);
 }
 
 div#cgit table.diffstat td.graph td.rem {
-	background-color: #c55;
+	background-color: var(--c-diffstat-del);
 }
 
 div#cgit div.diffstat-summary {
-	color: #888;
+	color: var(--c-fg1);
 	padding-top: 0.5em;
 }
 
@@ -550,19 +715,19 @@ div#cgit table.diff td {
 div#cgit table.diff td div.head {
 	font-weight: bold;
 	margin-top: 1em;
-	color: black;
+	color: var(--c-fg0);
 }
 
 div#cgit table.diff td div.hunk {
-	color: #009;
+	color: var(--c-diff-hunk);
 }
 
 div#cgit table.diff td div.add {
-	color: green;
+	color: var(--c-diff-add);
 }
 
 div#cgit table.diff td div.del {
-	color: red;
+	color: var(--c-diff-del);
 }
 
 div#cgit .oid {
@@ -580,7 +745,7 @@ div#cgit .right {
 
 div#cgit table.list td.reposection {
 	font-style: italic;
-	color: #888;
+	color: var(--c-fg1);
 }
 
 div#cgit a.button {
@@ -596,10 +761,6 @@ div#cgit a.secondary {
 	font-size: 90%;
 }
 
-div#cgit td.toplevel-repo {
-
-}
-
 div#cgit table.list td.sublevel-repo {
 	padding-left: 1.5em;
 }
@@ -617,7 +778,7 @@ div#cgit ul.pager li {
 }
 
 div#cgit ul.pager a {
-	color: #777;
+	color: var(--c-fg1);
 }
 
 div#cgit ul.pager .current {
@@ -626,46 +787,46 @@ div#cgit ul.pager .current {
 
 div#cgit span.age-mins {
 	font-weight: bold;
-	color: #080;
+	color: var(--c-age-mins);
 }
 
 div#cgit span.age-hours {
-	color: #080;
+	color: var(--c-age-hours);
 }
 
 div#cgit span.age-days {
-	color: #040;
+	color: var(--c-age-days);
 }
 
 div#cgit span.age-weeks {
-	color: #444;
+	color: var(--c-age-weeks);
 }
 
 div#cgit span.age-months {
-	color: #888;
+	color: var(--c-age-months);
 }
 
 div#cgit span.age-years {
-	color: #bbb;
+	color: var(--c-age-years);
 }
 
 div#cgit span.insertions {
-	color: #080;
+	color: var(--c-diff-add);
 }
 
 div#cgit span.deletions {
-	color: #800;
+	color: var(--c-diff-del);
 }
 
 div#cgit div.footer {
 	margin-top: 0.5em;
 	text-align: center;
 	font-size: 80%;
-	color: #ccc;
+	color: var(--c-fg2);
 }
 
 div#cgit div.footer a {
-	color: #ccc;
+	color: var(--c-fg2);
 	text-decoration: none;
 }
 
@@ -674,43 +835,43 @@ div#cgit div.footer a:hover {
 }
 
 div#cgit a.branch-deco {
-	color: #000;
+	color: var(--c-fg0);
 	margin: 0px 0.5em;
 	padding: 0px 0.25em;
-	background-color: #88ff88;
-	border: solid 1px #007700;
+	background-color: var(--c-deco-branch-bg);
+	border: solid 1px var(--c-deco-branch-border);
 }
 
 div#cgit a.tag-deco {
-	color: #000;
+	color: var(--c-fg0);
 	margin: 0px 0.5em;
 	padding: 0px 0.25em;
-	background-color: #ffff88;
-	border: solid 1px #777700;
+	background-color: var(--c-deco-tag-bg);
+	border: solid 1px var(--c-deco-tag-border);
 }
 
 div#cgit a.tag-annotated-deco {
-	color: #000;
+	color: var(--c-fg0);
 	margin: 0px 0.5em;
 	padding: 0px 0.25em;
-	background-color: #ffcc88;
-	border: solid 1px #777700;
+	background-color: var(--c-deco-anno-bg);
+	border: solid 1px var(--c-deco-anno-border);
 }
 
 div#cgit a.remote-deco {
-	color: #000;
+	color: var(--c-fg0);
 	margin: 0px 0.5em;
 	padding: 0px 0.25em;
-	background-color: #ccccff;
-	border: solid 1px #000077;
+	background-color: var(--c-deco-remote-bg);
+	border: solid 1px var(--c-deco-remote-border);
 }
 
 div#cgit a.deco {
-	color: #000;
+	color: var(--c-fg0);
 	margin: 0px 0.5em;
 	padding: 0px 0.25em;
-	background-color: #ff8888;
-	border: solid 1px #770000;
+	background-color: var(--c-deco-bg);
+	border: solid 1px var(--c-deco-border);
 }
 
 div#cgit div.commit-subject a.branch-deco,
@@ -723,21 +884,21 @@ div#cgit div.commit-subject a.deco {
 }
 
 div#cgit table.stats {
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 	border-collapse: collapse;
 }
 
 div#cgit table.stats th {
 	text-align: left;
 	padding: 1px 0.5em;
-	background-color: #eee;
-	border: solid 1px black;
+	background-color: var(--c-bg1);
+	border: solid 1px var(--c-border2);
 }
 
 div#cgit table.stats td {
 	text-align: right;
 	padding: 1px 0.5em;
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 }
 
 div#cgit table.stats td.total {
@@ -746,9 +907,9 @@ div#cgit table.stats td.total {
 }
 
 div#cgit table.stats td.sum {
-	color: #c00;
+	color: var(--c-fg0);
 	font-weight: bold;
-/*	background-color: #eee; */
+/*	background-color: var(--c-bg1); */
 }
 
 div#cgit table.stats td.left {
@@ -757,14 +918,14 @@ div#cgit table.stats td.left {
 
 div#cgit table.vgraph {
 	border-collapse: separate;
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 	height: 200px;
 }
 
 div#cgit table.vgraph th {
-	background-color: #eee;
+	background-color: var(--c-bg1);
 	font-weight: bold;
-	border: solid 1px white;
+	border: solid 1px var(--c-border1);
 	padding: 1px 0.5em;
 }
 
@@ -774,18 +935,18 @@ div#cgit table.vgraph td {
 }
 
 div#cgit table.vgraph div.bar {
-	background-color: #eee;
+	background-color: var(--c-bg1);
 }
 
 div#cgit table.hgraph {
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 	width: 800px;
 }
 
 div#cgit table.hgraph th {
-	background-color: #eee;
+	background-color: var(--c-bg1);
 	font-weight: bold;
-	border: solid 1px black;
+	border: solid 1px var(--c-border2);
 	padding: 1px 0.5em;
 }
 
@@ -795,7 +956,7 @@ div#cgit table.hgraph td {
 }
 
 div#cgit table.hgraph div.bar {
-	background-color: #eee;
+	background-color: var(--c-bg1);
 	height: 1em;
 }
 
@@ -808,83 +969,83 @@ div#cgit table.ssdiff td {
 	font-family: monospace;
 	white-space: pre;
 	padding: 1px 4px 1px 4px;
-	border-left: solid 1px #aaa;
-	border-right: solid 1px #aaa;
+	border-left: solid 1px var(--c-border2);
+	border-right: solid 1px var(--c-border2);
 }
 
 div#cgit table.ssdiff td.add {
-	color: black;
-	background: #cfc;
+	color: var(--c-fg0);
+	background: var(--c-diffbg-add);
 	min-width: 50%;
 }
 
 div#cgit table.ssdiff td.add_dark {
-	color: black;
-	background: #aca;
+	color: var(--c-fg0);
+	background: var(--c-diffbg-add-dark);
 	min-width: 50%;
 }
 
 div#cgit table.ssdiff span.add {
-	background: #cfc;
+	background: var(--c-diffbg-add);
 	font-weight: bold;
 }
 
 div#cgit table.ssdiff td.del {
-	color: black;
-	background: #fcc;
+	color: var(--c-fg0);
+	background: var(--c-diffbg-del);
 	min-width: 50%;
 }
 
 div#cgit table.ssdiff td.del_dark {
-	color: black;
-	background: #caa;
+	color: var(--c-fg0);
+	background: var(--c-diffbg-del-dark);
 	min-width: 50%;
 }
 
 div#cgit table.ssdiff span.del {
-	background: #fcc;
+	background: var(--c-diffbg-del);
 	font-weight: bold;
 }
 
 div#cgit table.ssdiff td.changed {
-	color: black;
-	background: #ffc;
+	color: var(--c-fg0);
+	background: var(--c-diffbg);
 	min-width: 50%;
 }
 
 div#cgit table.ssdiff td.changed_dark {
-	color: black;
-	background: #cca;
+	color: var(--c-fg0);
+	background: var(--c-diffbg-dark);
 	min-width: 50%;
 }
 
 div#cgit table.ssdiff td.lineno {
-	color: black;
-	background: #eee;
+	color: var(--c-fg0);
+	background: var(--c-bg1);
 	text-align: right;
 	width: 3em;
 	min-width: 3em;
 }
 
 div#cgit table.ssdiff td.hunk {
-	color: black;
-	background: #ccf;
-	border-top: solid 1px #aaa;
-	border-bottom: solid 1px #aaa;
+	color: var(--c-fg0);
+	background: var(--c-diffbg-hunk);
+	border-top: solid 1px var(--c-border2);
+	border-bottom: solid 1px var(--c-border2);
 }
 
 div#cgit table.ssdiff td.head {
-	border-top: solid 1px #aaa;
-	border-bottom: solid 1px #aaa;
+	border-top: solid 1px var(--c-border2);
+	border-bottom: solid 1px var(--c-border2);
 }
 
 div#cgit table.ssdiff td.head div.head {
 	font-weight: bold;
-	color: black;
+	color: var(--c-fg0);
 }
 
 div#cgit table.ssdiff td.foot {
-	border-top: solid 1px #aaa;
+	border-top: solid 1px var(--c-border2);
 	border-left: none;
 	border-right: none;
 	border-bottom: none;
@@ -897,3 +1058,371 @@ div#cgit table.ssdiff td.space {
 div#cgit table.ssdiff td.space div {
 	min-height: 3em;
 }
+
+/*
+ * Markdown styles
+ */
+
+.markdown-body {
+	font-size: 14px;
+	line-height: 1.6;
+	overflow: hidden;
+}
+.markdown-body>*:first-child {
+	margin-top: 0 !important;
+}
+.markdown-body>*:last-child {
+	margin-bottom: 0 !important;
+}
+.markdown-body a.absent {
+	color: var(--c-error);
+}
+.markdown-body a.anchor {
+	display: block;
+	padding-left: 30px;
+	margin-left: -30px;
+	cursor: pointer;
+	position: absolute;
+	top: 0;
+	left: 0;
+	bottom: 0;
+}
+.markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 {
+	margin: 20px 0 10px;
+	padding: 0;
+	font-weight: bold;
+	-webkit-font-smoothing: antialiased;
+	cursor: text;
+	position: relative;
+}
+.markdown-body h1 .mini-icon-link, .markdown-body h2 .mini-icon-link, .markdown-body h3 .mini-icon-link, .markdown-body h4 .mini-icon-link, .markdown-body h5 .mini-icon-link, .markdown-body h6 .mini-icon-link {
+	display: none;
+	color: var(--c-fg0);
+}
+.markdown-body h1:hover a.anchor, .markdown-body h2:hover a.anchor, .markdown-body h3:hover a.anchor, .markdown-body h4:hover a.anchor, .markdown-body h5:hover a.anchor, .markdown-body h6:hover a.anchor {
+	text-decoration: none;
+	line-height: 1;
+	padding-left: 0;
+	margin-left: -22px;
+	top: 15%;
+}
+.markdown-body h1:hover a.anchor .mini-icon-link, .markdown-body h2:hover a.anchor .mini-icon-link, .markdown-body h3:hover a.anchor .mini-icon-link, .markdown-body h4:hover a.anchor .mini-icon-link, .markdown-body h5:hover a.anchor .mini-icon-link, .markdown-body h6:hover a.anchor .mini-icon-link {
+	display: inline-block;
+}
+div#cgit .markdown-body h1 a.toclink, div#cgit .markdown-body h2 a.toclink, div#cgit .markdown-body h3 a.toclink, div#cgit .markdown-body h4 a.toclink, div#cgit .markdown-body h5 a.toclink, div#cgit .markdown-body h6 a.toclink {
+	color: var(--c-fg0);
+}
+.markdown-body h1 tt, .markdown-body h1 code, .markdown-body h2 tt, .markdown-body h2 code, .markdown-body h3 tt, .markdown-body h3 code, .markdown-body h4 tt, .markdown-body h4 code, .markdown-body h5 tt, .markdown-body h5 code, .markdown-body h6 tt, .markdown-body h6 code {
+	font-size: inherit;
+}
+.markdown-body h1 {
+	font-size: 28px;
+	color: var(--c-fg0);
+}
+.markdown-body h2 {
+	font-size: 24px;
+	border-bottom: 1px solid var(--c-border1);
+	color: var(--c-fg0);
+}
+.markdown-body h3 {
+	font-size: 18px;
+}
+.markdown-body h4 {
+	font-size: 16px;
+}
+.markdown-body h5 {
+	font-size: 14px;
+}
+.markdown-body h6 {
+	color: var(--c-fg1);
+	font-size: 14px;
+}
+.markdown-body p, .markdown-body blockquote, .markdown-body ul, .markdown-body ol, .markdown-body dl, .markdown-body table, .markdown-body pre {
+	margin: 15px 0;
+}
+.markdown-body hr {
+	border: 2px solid var(--c-border1);
+}
+.markdown-body>h2:first-child, .markdown-body>h1:first-child, .markdown-body>h1:first-child+h2, .markdown-body>h3:first-child, .markdown-body>h4:first-child, .markdown-body>h5:first-child, .markdown-body>h6:first-child {
+	margin-top: 0;
+	padding-top: 0;
+}
+.markdown-body a:first-child h1, .markdown-body a:first-child h2, .markdown-body a:first-child h3, .markdown-body a:first-child h4, .markdown-body a:first-child h5, .markdown-body a:first-child h6 {
+	margin-top: 0;
+	padding-top: 0;
+}
+.markdown-body h1+p, .markdown-body h2+p, .markdown-body h3+p, .markdown-body h4+p, .markdown-body h5+p, .markdown-body h6+p {
+	margin-top: 0;
+}
+.markdown-body li p.first {
+	display: inline-block;
+}
+.markdown-body ul, .markdown-body ol {
+	padding-left: 30px;
+}
+.markdown-body ul.no-list, .markdown-body ol.no-list {
+	list-style-type: none;
+	padding: 0;
+}
+.markdown-body ul li>:first-child, .markdown-body ul li ul:first-of-type, .markdown-body ul li ol:first-of-type, .markdown-body ol li>:first-child, .markdown-body ol li ul:first-of-type, .markdown-body ol li ol:first-of-type {
+	margin-top: 0px;
+}
+.markdown-body ul li p:last-of-type, .markdown-body ol li p:last-of-type {
+	margin-bottom: 0;
+}
+.markdown-body ul ul, .markdown-body ul ol, .markdown-body ol ol, .markdown-body ol ul {
+	margin-bottom: 0;
+}
+.markdown-body dl {
+	padding: 0;
+}
+.markdown-body dl dt {
+	font-size: 14px;
+	font-weight: bold;
+	font-style: italic;
+	padding: 0;
+	margin: 15px 0 5px;
+}
+.markdown-body dl dt:first-child {
+	padding: 0;
+}
+.markdown-body dl dt>:first-child {
+	margin-top: 0px;
+}
+.markdown-body dl dt>:last-child {
+	margin-bottom: 0px;
+}
+.markdown-body dl dd {
+	margin: 0 0 15px;
+	padding: 0 15px;
+}
+.markdown-body dl dd>:first-child {
+	margin-top: 0px;
+}
+.markdown-body dl dd>:last-child {
+	margin-bottom: 0px;
+}
+.markdown-body blockquote {
+	border-left: 4px solid var(--c-border2);
+	padding: 0 15px;
+	color: var(--c-fg1);
+}
+.markdown-body blockquote>:first-child {
+	margin-top: 0px;
+}
+.markdown-body blockquote>:last-child {
+	margin-bottom: 0px;
+}
+.markdown-body table th {
+	font-weight: bold;
+}
+.markdown-body table th, .markdown-body table td {
+	border: 1px solid var(--c-border1);
+	padding: 6px 13px;
+}
+.markdown-body table tr {
+	border-top: 1px solid var(--c-border1);
+	background-color: var(--c-bg0);
+}
+.markdown-body table tr:nth-child(2n) {
+	background-color: var(--c-bg-row-even);
+}
+.markdown-body table tr:nth-child(2n+1) {
+	background-color: var(--c-bg-row-odd);
+}
+.markdown-body img {
+	max-width: 100%;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+.markdown-body span.frame {
+	display: block;
+	overflow: hidden;
+}
+.markdown-body span.frame>span {
+	border: 1px solid var(--c-border1);
+	display: block;
+	float: left;
+	overflow: hidden;
+	margin: 13px 0 0;
+	padding: 7px;
+	width: auto;
+}
+.markdown-body span.frame span img {
+	display: block;
+	float: left;
+}
+.markdown-body span.frame span span {
+	clear: both;
+	color: var(--c-fg1);
+	display: block;
+	padding: 5px 0 0;
+}
+.markdown-body span.align-center {
+	display: block;
+	overflow: hidden;
+	clear: both;
+}
+.markdown-body span.align-center>span {
+	display: block;
+	overflow: hidden;
+	margin: 13px auto 0;
+	text-align: center;
+}
+.markdown-body span.align-center span img {
+	margin: 0 auto;
+	text-align: center;
+}
+.markdown-body span.align-right {
+	display: block;
+	overflow: hidden;
+	clear: both;
+}
+.markdown-body span.align-right>span {
+	display: block;
+	overflow: hidden;
+	margin: 13px 0 0;
+	text-align: right;
+}
+.markdown-body span.align-right span img {
+	margin: 0;
+	text-align: right;
+}
+.markdown-body span.float-left {
+	display: block;
+	margin-right: 13px;
+	overflow: hidden;
+	float: left;
+}
+.markdown-body span.float-left span {
+	margin: 13px 0 0;
+}
+.markdown-body span.float-right {
+	display: block;
+	margin-left: 13px;
+	overflow: hidden;
+	float: right;
+}
+.markdown-body span.float-right>span {
+	display: block;
+	overflow: hidden;
+	margin: 13px auto 0;
+	text-align: right;
+}
+.markdown-body code, .markdown-body tt {
+	margin: 0 2px;
+	padding: 0px 5px;
+	border: 1px solid var(--c-border2);
+	background-color: var(--c-bg1);
+	border-radius: 3px;
+}
+.markdown-body code {
+	white-space: nowrap;
+}
+.markdown-body pre>code {
+	margin: 0;
+	padding: 0;
+	white-space: pre;
+	border: none;
+	background: transparent;
+}
+.markdown-body .highlight pre, .markdown-body pre {
+	background-color: var(--c-bg1);
+	border: 1px solid var(--c-border2);
+	font-size: 13px;
+	line-height: 19px;
+	overflow: auto;
+	padding: 6px 10px;
+	border-radius: 3px;
+}
+.markdown-body pre code, .markdown-body pre tt {
+	margin: 0;
+	padding: 0;
+	background-color: transparent;
+	border: none;
+}
+
+/*
+ * pygments style
+ */
+
+.highlight { color: var(--h-col-fg); background: var(--h-col-bg); }
+.highlight .c { color: var(--h-col-gray); } /* Comment */
+.highlight .err { color: var(--h-col-red); } /* Error */
+.highlight .esc { color: var(--h-col-fg); } /* Escape */
+.highlight .g { color: var(--h-col-fg); } /* Generic */
+.highlight .k { color: var(--h-col-red); } /* Keyword */
+.highlight .l { color: var(--h-col-green); } /* Literal */
+.highlight .n { color: var(--h-col-fg); } /* Name */
+.highlight .o { color: var(--h-col-fg); } /* Operator */
+.highlight .x { color: var(--h-col-fg); } /* Other */
+.highlight .p { color: var(--h-col-fg); } /* Punctuation */
+.highlight .ch { color: var(--h-col-red); font-style: italic } /* Comment.Hashbang */
+.highlight .cm { color: var(--h-col-gray); } /* Comment.Multiline */
+.highlight .cp { color: var(--h-col-purple) } /* Comment.Preproc */
+.highlight .cpf { color: var(--h-col-green); } /* Comment.PreprocFile */
+.highlight .c1 { color: var(--h-col-gray); } /* Comment.Single */
+.highlight .cs { color: var(--h-col-gray); font-style: italic } /* Comment.Special */
+.highlight .gd { color: var(--h-col-red); } /* Generic.Deleted */
+.highlight .ge { color: var(--h-col-fg); font-style: italic } /* Generic.Emph */
+.highlight .ges { color: var(--h-col-fg); } /* Generic.EmphStrong */
+.highlight .gr { color: var(--h-col-red); } /* Generic.Error */
+.highlight .gh { color: var(--h-col-fg); } /* Generic.Heading */
+.highlight .gi { color: var(--h-col-green); } /* Generic.Inserted */
+.highlight .go { color: var(--h-col-gray); } /* Generic.Output */
+.highlight .gp { color: var(--h-col-fg); } /* Generic.Prompt */
+.highlight .gs { color: var(--h-col-fg); font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: var(--h-col-fg); } /* Generic.Subheading */
+.highlight .gt { color: var(--h-col-red); } /* Generic.Traceback */
+.highlight .kc { color: var(--h-col-yellow); } /* Keyword.Constant */
+.highlight .kd { color: var(--h-col-red); } /* Keyword.Declaration */
+.highlight .kn { color: var(--h-col-red); } /* Keyword.Namespace */
+.highlight .kp { color: var(--h-col-red); } /* Keyword.Pseudo */
+.highlight .kr { color: var(--h-col-red); } /* Keyword.Reserved */
+.highlight .kt { color: var(--h-col-yellow); } /* Keyword.Type */
+.highlight .ld { color: var(--h-col-green); } /* Literal.Date */
+.highlight .m { color: var(--h-col-yellow); } /* Literal.Number */
+.highlight .s { color: var(--h-col-green); } /* Literal.String */
+.highlight .na { color: var(--h-col-cyan); } /* Name.Attribute */
+.highlight .nb { color: var(--h-col-cyan); } /* Name.Builtin */
+.highlight .nc { color: var(--h-col-yellow); } /* Name.Class */
+.highlight .no { color: var(--h-col-cyan); } /* Name.Constant */
+.highlight .nd { color: var(--h-col-cyan); } /* Name.Decorator */
+.highlight .ni { color: var(--h-col-cyan); } /* Name.Entity */
+.highlight .ne { color: var(--h-col-cyan); } /* Name.Exception */
+.highlight .nf { color: var(--h-col-blue); } /* Name.Function */
+.highlight .nl { color: var(--h-col-fg); } /* Name.Label */
+.highlight .nn { color: var(--h-col-fg); } /* Name.Namespace */
+.highlight .nx { color: var(--h-col-fg); } /* Name.Other */
+.highlight .py { color: var(--h-col-cyan); } /* Name.Property */
+.highlight .nt { color: var(--h-col-blue); } /* Name.Tag */
+.highlight .nv { color: var(--h-col-fg); } /* Name.Variable */
+.highlight .ow { color: var(--h-col-red); } /* Operator.Word */
+.highlight .pm { color: var(--h-col-fg); } /* Punctuation.Marker */
+.highlight .w { color: var(--h-col-fg); } /* Text.Whitespace */
+.highlight .mb { color: var(--h-col-yellow); } /* Literal.Number.Bin */
+.highlight .mf { color: var(--h-col-yellow); } /* Literal.Number.Float */
+.highlight .mh { color: var(--h-col-yellow); } /* Literal.Number.Hex */
+.highlight .mi { color: var(--h-col-yellow); } /* Literal.Number.Integer */
+.highlight .mo { color: var(--h-col-yellow); } /* Literal.Number.Oct */
+.highlight .sa { color: var(--h-col-yellow); } /* Literal.String.Affix */
+.highlight .sb { color: var(--h-col-green); } /* Literal.String.Backtick */
+.highlight .sc { color: var(--h-col-green); } /* Literal.String.Char */
+.highlight .dl { color: var(--h-col-green); } /* Literal.String.Delimiter */
+.highlight .sd { color: var(--h-col-gray); } /* Literal.String.Doc */
+.highlight .s2 { color: var(--h-col-green); } /* Literal.String.Double */
+.highlight .se { color: var(--h-col-cyan); } /* Literal.String.Escape */
+.highlight .sh { color: var(--h-col-green); } /* Literal.String.Heredoc */
+.highlight .si { color: var(--h-col-cyan); } /* Literal.String.Interpol */
+.highlight .sx { color: var(--h-col-cyan); } /* Literal.String.Other */
+.highlight .sr { color: var(--h-col-cyan); } /* Literal.String.Regex */
+.highlight .s1 { color: var(--h-col-green); } /* Literal.String.Single */
+.highlight .ss { color: var(--h-col-purple); } /* Literal.String.Symbol */
+.highlight .bp { color: var(--h-col-blue); } /* Name.Builtin.Pseudo */
+.highlight .fm { color: var(--h-col-cyan); } /* Name.Function.Magic */
+.highlight .vc { color: var(--h-col-fg); } /* Name.Variable.Class */
+.highlight .vg { color: var(--h-col-fg); } /* Name.Variable.Global */
+.highlight .vi { color: var(--h-col-fg); } /* Name.Variable.Instance */
+.highlight .vm { color: var(--h-col-fg); } /* Name.Variable.Magic */
+.highlight .il { color: var(--h-col-purple); } /* Literal.Number.Integer.Long */
+