refactor: CardSidebar layout breakpoint md → lg for wider description area

This commit is contained in:
Ilia Mashkov
2026-05-18 13:11:53 +03:00
parent 979e2071d1
commit 458ee0e449
3 changed files with 6 additions and 6 deletions
+2 -2
View File
@@ -97,10 +97,10 @@ describe('CardSidebar', () => {
expect(sidebar).toHaveClass('brutal-border-sidebar');
});
it('sidebar column has fixed width on md', () => {
it('sidebar column has fixed width on lg', () => {
render(<CardSidebar sidebar={<span>Sidebar</span>}>Main</CardSidebar>);
const sidebar = screen.getByText('Sidebar').parentElement;
expect(sidebar).toHaveClass('md:w-64');
expect(sidebar).toHaveClass('lg:w-64');
});
it('main column fills remaining space', () => {
+3 -3
View File
@@ -108,9 +108,9 @@ interface CardSidebarProps {
*/
export function CardSidebar({ sidebar, children, className }: CardSidebarProps) {
return (
<div className={cn('flex flex-col md:flex-row', className)}>
<div className="shrink-0 md:w-64 brutal-border-sidebar pb-6 md:pb-0 md:pr-8 mb-6 md:mb-0">{sidebar}</div>
<div className="flex-1 min-w-0 md:pl-8">{children}</div>
<div className={cn('flex flex-col lg:flex-row', className)}>
<div className="shrink-0 lg:w-64 brutal-border-sidebar pb-6 lg:pb-0 lg:pr-8 mb-6 lg:mb-0">{sidebar}</div>
<div className="flex-1 min-w-0 lg:pl-8">{children}</div>
</div>
);
}