next-mdx-remote v4 (#737)

components/NoteMeta/NoteMeta.module.css

@@ -0,0 +1,78 @@
+.meta {
+  display: flex;
+  flex-wrap: wrap;
+  font-size: 0.825em;
+  line-height: 2.3;
+  letter-spacing: 0.04em;
+  color: var(--medium);
+}
+
+.meta a {
+  color: inherit;
+  background: none;
+  padding-bottom: 0;
+}
+
+.meta > div {
+  display: inline-flex;
+  margin-right: 1.6em;
+  white-space: nowrap;
+}
+
+.meta > div:last-of-type {
+  /* fix potential layout shift when number of hits loads */
+  min-width: 7em;
+  margin-right: 0;
+}
+
+.icon {
+  margin-right: 0.6em;
+}
+
+.date a,
+.edit a {
+  display: inline-flex;
+}
+
+.tags {
+  white-space: normal;
+  display: inline-flex;
+  flex-wrap: wrap;
+}
+
+.tags .tag {
+  text-transform: lowercase;
+  white-space: nowrap;
+  margin-right: 0.75em;
+}
+
+.tags .tag::before {
+  content: "#"; /* cosmetically hashtagify tags */
+  padding-right: 0.125em;
+  color: var(--light);
+}
+
+.tags .tag:last-of-type {
+  margin-right: 0;
+}
+
+.title {
+  margin: 0.3em 0 0.5em -0.03em;
+  font-size: 2.1em;
+  line-height: 1.3;
+  font-weight: 700;
+}
+
+.title a {
+  background: none;
+  padding-bottom: 0;
+  color: inherit;
+}
+
+.title code {
+  font-size: 1em;
+  background: none !important;
+  border: 0 !important;
+  margin: 0 0.075em !important;
+  padding: 0 !important;
+}