toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2025-01-04 23:32:31 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(core): hairline boarders for divider (#8021)

Browse Source
This commit is contained in:
pengx17 2024-08-30 02:31:28 +00:00
parent f544e69d02
commit 4ff6fbd052
No known key found for this signature in database
GPG Key ID: 23F23D9E8B3971ED
2 changed files with 9 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/frontend/component/src/ui/divider/divider.tsx
View File

@ -31,10 +31,7 @@ export const Divider = forwardRef<HTMLDivElement, DividerProps>(
styles.divider, styles.divider,
{ {
[styles.verticalDivider]: orientation === 'vertical', [styles.verticalDivider]: orientation === 'vertical',
[styles.thinner]: [styles.thinner]: size === 'thinner',
size === 'thinner' && orientation === 'horizontal',
[styles.verticalThinner]:
size === 'thinner' && orientation === 'vertical',
}, },
className className
)} )}

18
packages/frontend/component/src/ui/divider/style.css.ts
View File

@ -1,21 +1,19 @@
import { cssVar } from '@toeverything/theme'; import { cssVar } from '@toeverything/theme';
import { style } from '@vanilla-extract/css'; import { style } from '@vanilla-extract/css';
export const divider = style({ export const divider = style({
height: '1px', borderBottom: `1px solid ${cssVar('borderColor')}`,
backgroundColor: cssVar('borderColor'), height: 0,
borderRadius: '8px',
margin: '8px 0', margin: '8px 0',
width: '100%', width: '100%',
}); });
export const thinner = style({
height: '0.5px',
});
export const verticalDivider = style({ export const verticalDivider = style({
width: '1px', borderLeft: `1px solid ${cssVar('borderColor')}`,
borderRadius: '8px', width: 0,
height: '100%', height: '100%',
margin: '0 2px', margin: '0 2px',
}); });
export const verticalThinner = style({
width: '0.5px', export const thinner = style({
borderWidth: '0.5px',
}); });