stagit

style.css (2307B)

:root {
	/* gruvbox dark */
	--dark-ansi00: #282828;
	--dark-ansi00-hard: #1d2021;
	--dark-ansi00-soft: #32302f;
	--dark-ansi01: #cc241d;
	--dark-ansi02: #98971a;
	--dark-ansi03: #d79921;
	--dark-ansi04: #458588;
	--dark-ansi05: #b16286;
	--dark-ansi06: #689d6a;
	--dark-ansi07: #a89984;
	--dark-ansi08: #928374;
	--dark-ansi09: #fb4934;
	--dark-ansi10: #b8bb26;
	--dark-ansi11: #fabd2f;
	--dark-ansi12: #83a598;
	--dark-ansi13: #d3869b;
	--dark-ansi14: #8ec07c;
	--dark-ansi15: #ebdbb2;

	/* gruvbox light */
	--light-ansi-00: #fbf1c7;
	--light-ansi-00-hard: #f9f5d7;
	--light-ansi-00-soft: #f2e5bc;
	--light-ansi-01: #cc241d;
	--light-ansi-02: #98971a;
	--light-ansi-03: #d79921;
	--light-ansi-04: #458588;
	--light-ansi-05: #b16286;
	--light-ansi-06: #689d6a;
	--light-ansi-07: #7c6f64;
	--light-ansi-08: #928374;
	--light-ansi-09: #9d0006;
	--light-ansi-10: #79740e;
	--light-ansi-11: #b57614;
	--light-ansi-12: #076678;
	--light-ansi-13: #8f3f71;
	--light-ansi-14: #427b58;
	--light-ansi-15: #3c3836;
}

html, body {
	background-color: var(--dark-ansi00-soft);
	color: var(--dark-ansi15);
	margin: 0;
	padding: 0;
	font-family: sans;
	overflow-wrap: break-word;
}

header h1 {
	display: inline;
	margin: 0 1em;
}

header {
	background-color: var(--dark-ansi00);
	padding: 1ch 2em;
}

footer {
	margin: 2ch 2em;
}

main {
	display: table;
	margin: 0 auto;
	max-width: 100vw;
}

a {
	color: var(--dark-ansi13);
	text-decoration: none;
	outline-color: invert;
	outline-color: var(--dark-ansi13);
}

h1,h2,h3,h4,h5,h6 { font-family: serif; }
pre {
	white-space: pre-wrap;
	font-family: monospace;
}

nav, .line, tr:nth-child(even) {
	background-color: var(--dark-ansi00);
}

nav {
	font-size: larger;
	font-weight: bold;
	padding: 0.25rem;
}

/*
* table {
* 	max-width: 100%;
* }
*/

table thead td {
	font-weight: bold;
}

table td {
	padding: 0 0.4em;
}

td.num {
	text-align: right;
}

td.date {
	min-width: 8em;
}

td.index-name { max-width: 20em; }

td.log-summary,
td.index-description {
	max-width: 50em;
	break-word: break-all;
}

td:nth-child(1) {
	text-align: right;
}

tr td {
	padding: 0.5em 1em;
}

pre a.h {
	color: var(--dark-ansi05);
}

.A,
span.i,
pre a.i {
	color: var(--dark-ansi02);
}

.D,
span.d,
pre a.d {
	color: var(--dark-ansi01);
}

li.line:target {
	color: var(--dark-ansi03);
}