preliminary work for old theme re-implementation

_src/assets/css/default/default.css

@@ -0,0 +1,145 @@
+@import url("./variables.css");
+@import url("./nav.css");
+@import url("./mobile.css");
+:root {
+	--view: 18rem;
+}
+
+body {
+	font-family: "Rubik", sans-serif;
+	font-size: 100%;
+	margin: 0;
+	padding: 0;
+	& a, button {
+		&:is(:hover, :focus) {
+			outline: 0;
+		}
+	}
+}
+
+main {
+	padding: var(--pad-xl);
+	padding-left: calc(var(--view) + var(--pad-xl));
+	overflow: hidden;
+}
+
+article {
+	border-style: solid;
+	border-width: 2px;
+	border-radius: var(--round);
+	height: max-content;
+	padding: var(--pad-xl);
+	& a {
+		font-weight: 500;
+	}
+	& a:has(figure) {
+		border-radius: var(--round);
+		& figure {
+			border-color: inherit;
+		}
+	}
+
+	& s {
+		text-decoration-style: line-through;
+		text-decoration-thickness: 0.1em;
+	}
+
+	& ul {
+		& li {
+			margin: 0;
+			& p {
+				margin: 0;
+			}
+		}
+	}
+
+	& u {
+		text-decoration-style: double;
+		text-decoration-thickness: 2px;
+	}
+
+	& em {
+		font-weight: 200;
+	}
+
+	& p {
+		word-wrap: break-word;
+		padding: var(--pad-sm);
+	}
+
+	& code:not(pre *) {
+		padding: 0 var(--pad-sm);
+	}
+
+	& pre {
+		display: flex;
+		width: auto;
+		overflow: scroll;
+		padding: var(--pad-m);
+		white-space: pre-wrap;
+		word-break: break-word;
+		border-style: solid;
+		border-width: 2px;
+	}
+
+	& pre,
+	code:not(pre *) {
+		transition: background-color var(--trans), border-color var(--trans);
+		border-radius: var(--round);
+		font-weight: bold;
+	}
+
+	& h3 {
+		font-size: 1.6rem;
+		margin: 0;
+
+		& a {
+			display: inline-block;
+			transition: color var(--trans), background-color var(--trans);
+			border-radius: inherit;
+			height: max-content;
+			padding: 0 0.4rem;
+		}
+	}
+	& figure {
+		margin: 0;
+		border-style: solid;
+		border-width: 2px;
+		padding: var(--pad-m);
+		border-radius: var(--round);
+		display: flex;
+		flex-direction: column;
+		& img {
+			border-radius: inherit;
+		}
+	}
+	& section {
+		& a:has(figure) {
+			text-decoration: none;
+			height: max-content;
+		}
+		& figure img {
+			border-radius: var(--round);
+		}
+		& figcaption {
+			font-weight: normal;
+			font-style: italic;
+			padding-top: var(--pad-sm);
+		}
+	}
+}
+
+:is(main article, main section):not(:last-child) {
+	margin-bottom: var(--pad-xl);
+}
+img[src*="/assets/img/flag/"] {
+	height: 32px;
+	border-radius: 0.2rem;
+	border-style: solid;
+	border-width: 2px;
+	border-color: #fff;
+}
+a:has(img[src*="/assets/img/button"]):is(:hover, :focus) img {
+	transform: translateY(-4px);
+	transition: var(--trans);
+}