summaryrefslogtreecommitdiffhomepage
path: root/src/app.css
diff options
context:
space:
mode:
Diffstat (limited to 'src/app.css')
-rw-r--r--src/app.css106
1 files changed, 106 insertions, 0 deletions
diff --git a/src/app.css b/src/app.css
index 5db1f25..2c30b5f 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,4 +1,6 @@
@import "tailwindcss";
+/* Syntax-highlight theme for fenced code blocks in rendered Markdown. */
+@import "highlight.js/styles/atom-one-dark.min.css";
/* DaisyUI v5 — enable the plugin AND bundle the dracula theme (set as default,
applied via <html data-theme="dracula">). Themes not listed here are NOT
@@ -7,6 +9,110 @@
themes: dracula --default;
}
+/* Rendered-Markdown (assistant messages) typography — scoped to .markdown-body
+ so it never leaks into the rest of the app. */
+.markdown-body {
+ & p {
+ margin-block: 0.5em;
+ &:first-child {
+ margin-block-start: 0;
+ }
+ &:last-child {
+ margin-block-end: 0;
+ }
+ }
+ & h1,
+ & h2,
+ & h3,
+ & h4,
+ & h5,
+ & h6 {
+ font-weight: 600;
+ line-height: 1.25;
+ margin-block: 0.75em 0.25em;
+ &:first-child {
+ margin-block-start: 0;
+ }
+ }
+ & h1 {
+ font-size: 1.4em;
+ }
+ & h2 {
+ font-size: 1.2em;
+ }
+ & h3 {
+ font-size: 1.1em;
+ }
+ & ul,
+ & ol {
+ padding-inline-start: 1.5em;
+ margin-block: 0.5em;
+ }
+ & ul {
+ list-style-type: disc;
+ }
+ & ol {
+ list-style-type: decimal;
+ }
+ & li {
+ margin-block: 0.15em;
+ }
+ & pre {
+ overflow-x: auto;
+ border-radius: var(--radius-box);
+ margin-block: 0.5em;
+ }
+ & pre code {
+ display: block;
+ padding: 0.75em 1em;
+ font-size: 0.8125em;
+ line-height: 1.5;
+ }
+ & :not(pre) > code {
+ font-size: 0.875em;
+ padding: 0.15em 0.4em;
+ border-radius: var(--radius-selector);
+ background-color: oklch(var(--color-base-content) / 0.1);
+ }
+ & blockquote {
+ border-inline-start: 3px solid oklch(var(--color-base-content) / 0.2);
+ padding-inline-start: 0.75em;
+ margin-block: 0.5em;
+ opacity: 0.8;
+ }
+ & a {
+ color: oklch(var(--color-primary));
+ text-decoration: underline;
+ &:hover {
+ opacity: 0.8;
+ }
+ }
+ & strong {
+ font-weight: 600;
+ }
+ & table {
+ width: 100%;
+ border-collapse: collapse;
+ margin-block: 0.5em;
+ font-size: 0.875em;
+ }
+ & th,
+ & td {
+ border: 1px solid oklch(var(--color-base-content) / 0.15);
+ padding: 0.4em 0.75em;
+ text-align: start;
+ }
+ & th {
+ font-weight: 600;
+ background-color: oklch(var(--color-base-200));
+ }
+ & hr {
+ border: none;
+ border-top: 1px solid oklch(var(--color-base-content) / 0.2);
+ margin-block: 0.75em;
+ }
+}
+
/* App shell fills the viewport and never scrolls/overflows at the page level —
the inner regions (tab strip, chat transcript) own their own scrolling. */
html,