Display README.md of current folder via Marked + DOMPurify

- Vendor marked v15.0.12 and DOMPurify 3.4.14 into assets/vendor/
- Fetch README.md from the current directory when listed, render
  markdown, sanitize with DOMPurify, and show in a themed panel
- Style the rendered markdown with existing design tokens

1 files changed, 128 insertions, 0 deletions

diff --git a/assets/index.css b/assets/index.css
index 7457d0f..6862df0 100644
--- a/assets/index.css
+++ b/assets/index.css
@@ -183,6 +183,134 @@ svg {
   animation: fade-in 200ms ease-out;
 }
 
+.readme {
+  margin: 1em 0;
+  padding: 1em 1.5em;
+  background-color: var(--bg-tertiary);
+  border: 1px solid var(--border-primary);
+  border-radius: 10px;
+  box-shadow: var(--shadow-pop);
+  font-size: 0.95em;
+  line-height: 1.6;
+  overflow-wrap: break-word;
+  animation: fade-in 200ms ease-out;
+}
+
+.readme> :first-child {
+  margin-top: 0;
+}
+
+.readme> :last-child {
+  margin-bottom: 0;
+}
+
+.readme h1,
+.readme h2,
+.readme h3,
+.readme h4,
+.readme h5,
+.readme h6 {
+  margin: 1.2em 0 0.5em;
+  line-height: 1.3;
+  font-weight: 600;
+  color: var(--text-primary);
+}
+
+.readme h1 {
+  font-size: 1.5em;
+}
+
+.readme h2 {
+  font-size: 1.25em;
+}
+
+.readme h3 {
+  font-size: 1.1em;
+}
+
+.readme h4,
+.readme h5,
+.readme h6 {
+  font-size: 1em;
+}
+
+.readme a {
+  color: var(--text-accent);
+  text-decoration: none;
+  text-underline-offset: 2px;
+}
+
+.readme a:hover {
+  text-decoration: underline;
+}
+
+.readme ul,
+.readme ol {
+  padding-left: 1.6em;
+  margin: 0.5em 0;
+}
+
+.readme li {
+  margin: 0.25em 0;
+}
+
+.readme li> :first-child {
+  margin-top: 0;
+}
+
+.readme code {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-size: 0.9em;
+  background-color: var(--bg-hover);
+  border-radius: 4px;
+  padding: 0.15em 0.35em;
+}
+
+.readme pre {
+  background-color: var(--bg-secondary);
+  border: 1px solid var(--border-primary);
+  border-radius: 8px;
+  padding: 0.8em 1em;
+  overflow-x: auto;
+  margin: 0.8em 0;
+}
+
+.readme pre code {
+  background-color: transparent;
+  padding: 0;
+}
+
+.readme blockquote {
+  margin: 0.8em 0;
+  padding: 0.1em 1em;
+  border-left: 3px solid var(--border-primary);
+  color: var(--text-secondary);
+}
+
+.readme table {
+  border-collapse: collapse;
+  margin: 0.8em 0;
+  display: block;
+  overflow-x: auto;
+}
+
+.readme th,
+.readme td {
+  border: 1px solid var(--border-primary);
+  padding: 0.4em 0.8em;
+  text-align: left;
+}
+
+.readme img {
+  max-width: 100%;
+}
+
+.readme hr {
+  border: none;
+  border-top: 1px solid var(--border-primary);
+  margin: 1.2em 0;
+}
+
 .uploaders-table th {
   text-align: left;
   font-weight: unset;