diff --git a/packages/session-ui/src/components/markdown.css b/packages/session-ui/src/components/markdown.css
index a7db67a64e9c..6d1fbff14b5f 100644
--- a/packages/session-ui/src/components/markdown.css
+++ b/packages/session-ui/src/components/markdown.css
@@ -35,8 +35,8 @@
font-size: 17px;
color: var(--v2-text-text-base);
font-weight: 600;
- margin-top: 0px;
- margin-bottom: 24px;
+ margin-top: 28px;
+ margin-bottom: 12px;
line-height: var(--line-height-large);
}
@@ -44,8 +44,8 @@
font-size: 15px;
color: var(--v2-text-text-base);
font-weight: 600;
- margin-top: 0px;
- margin-bottom: 24px;
+ margin-top: 24px;
+ margin-bottom: 10px;
line-height: var(--line-height-large);
}
@@ -53,8 +53,8 @@
font-size: 13px;
color: var(--v2-text-text-base);
font-weight: var(--font-weight-medium);
- margin-top: 0px;
- margin-bottom: 24px;
+ margin-top: 20px;
+ margin-bottom: 8px;
line-height: var(--line-height-large);
}
@@ -64,8 +64,8 @@
font-size: 13px;
color: var(--v2-text-text-muted);
font-weight: var(--font-weight-medium);
- margin-top: 0px;
- margin-bottom: 24px;
+ margin-top: 20px;
+ margin-bottom: 8px;
line-height: var(--line-height-large);
}
@@ -145,7 +145,7 @@
/* Blockquotes */
blockquote {
border-left: 0.5px solid var(--v2-border-border-base);
- margin: 1.5rem 0;
+ margin: 1rem 0;
padding-left: 0.5rem;
color: var(--v2-text-text-muted);
font-style: normal;
@@ -155,7 +155,7 @@
hr {
border: none;
height: 0;
- margin: 40px 0;
+ margin: 32px 0;
}
.shiki {
@@ -256,7 +256,7 @@
pre {
margin-top: 12px;
- margin-bottom: 32px;
+ margin-bottom: 24px;
overflow: auto;
scrollbar-width: none;
@@ -296,7 +296,7 @@
table {
width: 100%;
border-collapse: collapse;
- margin: 24px 0;
+ margin: 16px 0;
font-size: var(--font-size-base);
display: block;
overflow-x: auto;
diff --git a/packages/session-ui/src/components/timeline-playground.stories.tsx b/packages/session-ui/src/components/timeline-playground.stories.tsx
index 491ba2063cff..9a959e30d5c7 100644
--- a/packages/session-ui/src/components/timeline-playground.stories.tsx
+++ b/packages/session-ui/src/components/timeline-playground.stories.tsx
@@ -1221,7 +1221,9 @@ function Playground() {
message: { [session().id]: state.messages },
part: state.parts,
provider: {
- all: [{ id: "anthropic", models: { "claude-sonnet-4-20250514": { name: "Claude Sonnet" } } }],
+ all: new Map([["anthropic", { id: "anthropic", models: { "claude-sonnet-4-20250514": { name: "Claude Sonnet" } } }]]),
+ connected: ["anthropic"],
+ default: {},
},
}))
diff --git a/packages/storybook/.storybook/preview.tsx b/packages/storybook/.storybook/preview.tsx
index 76fb3abec9fc..7c13eb979d37 100644
--- a/packages/storybook/.storybook/preview.tsx
+++ b/packages/storybook/.storybook/preview.tsx
@@ -44,6 +44,17 @@ const Scheme = (props: { value?: unknown }) => {
return null
}
+const NewLayout = () => {
+ // Mirror app.tsx BodyDesignClass so stories render with v2 (new-layout) styles
+ // instead of the legacy `body:not([data-new-layout])` branch.
+ onMount(() => {
+ document.body.toggleAttribute("data-new-layout", true)
+ document.body.classList.add("font-(family-name:--font-family-text)", "text-[13px]", "font-[440]")
+ document.body.classList.remove("text-12-regular")
+ })
+ return null
+}
+
const frame = createJSXDecorator((Story, context) => {
const override = context.parameters?.themes?.themeOverride
const selected = context.globals?.theme
@@ -54,6 +65,7 @@ const frame = createJSXDecorator((Story, context) => {
+