Files
cinny/src/app/features/bookmarks/BookmarksPanel.css.ts
T

43 lines
1.0 KiB
TypeScript
Raw Normal View History

import { style } from '@vanilla-extract/css';
import { config, toRem } from 'folds';
// Mirrors MembersDrawer: a 266px side panel on desktop that becomes a
// full-screen fixed panel on narrow viewports — the app's canonical drawer.
export const BookmarksPanel = style({
width: toRem(266),
'@media': {
'(max-width: 750px)': {
position: 'fixed',
inset: 0,
width: '100%',
zIndex: 500,
},
},
});
export const BookmarksHeader = style({
flexShrink: 0,
padding: `0 ${config.space.S200} 0 ${config.space.S300}`,
borderBottomWidth: config.borderWidth.B300,
});
export const BookmarksToolbar = style({
flexShrink: 0,
padding: config.space.S200,
borderBottomWidth: config.borderWidth.B300,
});
export const BookmarksContent = style({
padding: config.space.S200,
});
export const BookmarkPreview = style({
width: '100%',
display: '-webkit-box',
WebkitLineClamp: 2,
WebkitBoxOrient: 'vertical',
overflow: 'hidden',
wordBreak: 'break-word',
textAlign: 'left',
});