heaven/vojo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ai-chat): cast the history panel shadow only when open so it stops bleeding a dark sliver onto the right edge while closed

Browse source
This commit is contained in:
heaven 2026-06-02 22:04:50 +03:00
parent 7ae77da2d0
commit 3662afd81d
1 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/app/features/bots/BotConversations.css.ts
View file

@ -69,11 +69,17 @@ export const History = style({
flexDirection: 'column', flexDirection: 'column',
backgroundColor: color.Surface.Container, backgroundColor: color.Surface.Container,
borderLeft: `${config.borderWidth.B300} solid ${color.Surface.ContainerLine}`, borderLeft: `${config.borderWidth.B300} solid ${color.Surface.ContainerLine}`,
boxShadow: '-12px 0 40px rgba(0, 0, 0, 0.32)',
transform: 'translateX(100%)', transform: 'translateX(100%)',
transition: 'transform 220ms cubic-bezier(0.22, 1, 0.36, 1)', transition: 'transform 220ms cubic-bezier(0.22, 1, 0.36, 1)',
selectors: { selectors: {
'&[data-open]': { transform: 'translateX(0)' }, // Shadow ONLY when open. The base `translateX(100%)` parks the panel off the right edge, but its
// cast shadow (offset -12px, i.e. leftward, + 40px blur) reaches back INTO the body and Body's
// `overflow: hidden` can't clip it (the leak lands inside the box, not past its edge) — so a base
// shadow paints a dark sliver on the right edge even while the drawer is closed.
'&[data-open]': {
transform: 'translateX(0)',
boxShadow: '-12px 0 40px rgba(0, 0, 0, 0.32)',
},
}, },
'@media': { '@media': {
'(prefers-reduced-motion: reduce)': { transition: 'none' }, '(prefers-reduced-motion: reduce)': { transition: 'none' },