update Makefile and directory structure

style.css

@@ -0,0 +1,323 @@
+:root {
+	--foreground: #1a1a1a;
+	--background: #fdfdfd;
+	--border: #c9c9c9;
+	--html-background: #e3e3e3;
+	--blockquote-text: #606060;
+	--blockquote-border: #e6e6e6;
+	--button-border: #e3e3e3;
+	--button-background: #d0d0d0;
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--foreground: #fdfdfd;
+		--background: #1a1a1a;
+		--border: #4c4c4c;
+		--html-background: #303030;
+		--blockquote-text: #e6e6e6;
+		--blockquote-border: #606060;
+		--button-border: #4c4c4c;
+		--button-background: #404040;
+	}
+}
+
+html {
+	color: var(--foreground);
+	/*background: url("recursion.gif");*/
+	background: var(--html-background);
+	background-repeat: repeat-y;
+	background-size: cover;
+	font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
+}
+
+body {
+	background-color: var(--background);
+	border: solid 1px var(--border);
+	margin: 0 auto;
+	max-width: 48em;
+	padding-left: 50pt;
+	padding-right: 50pt;
+	padding-top: 50pt;
+	padding-bottom: 50pt;
+	hyphens: auto;
+	overflow-wrap: break-word;
+	text-rendering: optimizeLegibility;
+	font-kerning: normal;
+}
+
+#page-header {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: nowrap;
+	justify-content: space-between;
+	text-align: left;
+	border: 4pt ridge var(--border);
+	background: url("images/sand.png");
+	background-size: 25%;
+}
+
+#page-header li {
+	list-style: none;
+	display: inline-block;
+}
+
+#page-header a:active {
+	border: 2pt inset var(--button-border)
+}
+
+#page-header a {
+	margin: 4pt;
+	padding: 4pt;
+	border: 2pt outset var(--button-border);
+	background-color: var(--button-background)
+}
+
+#page-header ul,
+#articles ul {
+	padding-left: 0;
+}
+
+#articles li {
+	list-style: none;
+	display: block;
+}
+
+.articles-header {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: nowrap;
+	justify-content: space-between;
+}
+
+.articles-title {
+	margin: 8pt 0 4pt 0;
+	font-size: 14pt;
+	font-weight: bold;
+}
+
+.articles-author {
+	margin: 12pt 0 4pt 0;
+}
+
+.articles-summary {
+	margin: 0;
+}
+
+.articles-date {
+	margin: 0;
+	text-align: right;
+}
+
+#page-footer {
+	border: 4pt ridge var(--border);
+	background: url("images/sand.png");
+	background-size: 25%;
+	display: flex;
+	justify-content: center;
+}
+
+#page-footer p {
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+}
+
+/*
+#TOC {
+	padding: 24px;
+}
+
+section {
+	display: flex;
+	flex-direction: row;
+}
+
+article {
+	padding: 12px;
+	overflow: auto;
+}
+*/
+
+@media (max-width: 600px) {
+	body {
+		font-size: 0.9em;
+		padding: 12pt;
+	}
+
+	h1 {
+		font-size: 1.8em;
+	}
+}
+
+@media print {
+	html {
+		background-color: white;
+	}
+
+	body {
+		background-color: transparent;
+		color: black;
+		border: none;
+		font-size: 12pt;
+	}
+
+	p,
+	h2,
+	h3 {
+		orphans: 3;
+		widows: 3;
+	}
+
+	h2,
+	h3,
+	h4 {
+		page-break-after: avoid;
+	}
+
+	#page-header,
+	#page-footer {
+		display: none;
+	}
+}
+
+p {
+	margin: 1em 0;
+}
+
+a {
+	color: var(--foreground);
+}
+
+a:not(:hover) {
+	text-decoration: none;
+}
+
+a:visited {
+	color: var(--foreground);
+}
+
+img {
+	max-width: 100%;
+}
+
+svg {
+	height: auto;
+	max-width: 100%;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	margin-top: 1.4em;
+}
+
+h5,
+h6 {
+	font-size: 1em;
+	font-style: italic;
+}
+
+h6 {
+	font-weight: normal;
+}
+
+ol,
+ul {
+	padding-left: 1.7em;
+	margin-top: 1em;
+}
+
+li>ol,
+li>ul {
+	margin-top: 0;
+}
+
+blockquote {
+	margin: 1em 0 1em 1.7em;
+	padding-left: 1em;
+	border-left: 2pt solid var(--blockquote-border);
+	color: var(--blockquote-text);
+}
+
+code {
+	font-family: Menlo, Monaco, Consolas, 'Lucida Console', monospace;
+	font-size: 85%;
+	margin: 0;
+	hyphens: manual;
+}
+
+pre {
+	margin: 1em 0;
+	overflow: auto;
+}
+
+pre code {
+	padding: 0;
+	overflow: visible;
+	overflow-wrap: normal;
+}
+
+.sourceCode {
+	background-color: transparent;
+	overflow: visible;
+}
+
+hr {
+	background-color: var(--foreground);
+	border: none;
+	height: 1pt;
+	margin: 1em 0;
+}
+
+table {
+	margin: 1em 0;
+	border-collapse: collapse;
+	width: 100%;
+	overflow-x: auto;
+	display: block;
+	font-variant-numeric: lining-nums tabular-nums;
+}
+
+table caption {
+	margin-bottom: 0.75em;
+}
+
+tbody {
+	margin-top: 0.5em;
+	border-top: 1pt solid var(--foreground);
+	border-bottom: 1pt solid var(--foreground);
+}
+
+th {
+	border-top: 1pt solid var(--foreground);
+	padding: 0.25em 0.5em 0.25em 0.5em;
+}
+
+td {
+	padding: 0.125em 0.5em 0.25em 0.5em;
+}
+
+header {
+	margin-bottom: 4em;
+	text-align: center;
+}
+
+#TOC li {
+	list-style: none;
+}
+
+#TOC ul {
+	padding-left: 1.3em;
+}
+
+#TOC>ul {
+	padding-left: 0;
+}
+
+#TOC a:not(:hover) {
+	text-decoration: none;
+}