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) => { +