fix(web-ui): add @tailwindcss/typography plugin to fix table rendering in docs

The Markdown component uses 'prose' classes (prose-lg prose-headings:)
but @tailwindcss/typography was not installed/registered. Tables and other
MD elements rendered unstyled. Fix: install @tailwindcss/typography@latest,
register via @plugin directive in globals.css, add custom dark-theme
table styles, and remove redundant tailwind.config.js.
This commit is contained in:
asepharyana
2026-08-20 22:32:07 +07:00
parent be9211ef21
commit 3938aeb38d
3 changed files with 40 additions and 0 deletions
+30
View File
@@ -1,4 +1,5 @@
@import "tailwindcss";
@plugin "@tailwindcss/typography";
/* Linear design system: dark-mode-first */
@custom-variant dark (&:where(.dark, .dark *));
@@ -42,3 +43,32 @@ body {
font-display: swap;
src: url("https://fonts.gstatic.com/s/inter/v19/UcCO3FwrK3iLTeHuS_nVMrNCGw.woff2") format("woff2");
}
/* Custom prose styles for dark theme — tables */
.prose table {
width: 100%;
border-collapse: collapse;
margin: 1.5rem 0;
font-size: 0.9rem;
}
.prose th,
.prose td {
border: 1px solid var(--color-border);
padding: 0.5rem 0.75rem;
text-align: left;
}
.prose th {
background: var(--color-elevated);
color: var(--color-text-primary);
font-weight: 600;
}
.prose td {
color: var(--color-text-secondary);
}
.prose tbody tr:nth-child(even) {
background: rgba(15, 16, 17, 0.5);
}