mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-08-02 18:09:58 +08:00
zzj3720
7b6e00d84a
close: BS-3446 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Refactor** - Migrated all styling from vanilla-extract to Emotion for improved CSS-in-JS consistency across database, table, and data view components. - Updated import paths for style modules to reflect the new Emotion-based file naming. - Removed unused or redundant style exports and updated selector syntax where necessary. - **Chores** - Updated dependencies: removed vanilla-extract and added Emotion in relevant package files. - **Style** - No visual changes to existing components; all style definitions remain consistent with previous designs. - **New Features** - Introduced new reusable CSS classes for data view and table components using Emotion. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
58 lines
1.2 KiB
TypeScript
58 lines
1.2 KiB
TypeScript
import { css } from '@emotion/css';
|
|
import { baseTheme } from '@toeverything/theme';
|
|
|
|
export const progressCellStyle = css({
|
|
display: 'block',
|
|
width: '100%',
|
|
padding: '0 4px',
|
|
userSelect: 'none',
|
|
});
|
|
|
|
export const progressContainerStyle = css({
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
height: 'var(--data-view-cell-text-line-height)',
|
|
gap: '4px',
|
|
});
|
|
|
|
export const progressBarStyle = css({
|
|
position: 'relative',
|
|
width: '100%',
|
|
});
|
|
|
|
export const progressBgStyle = css({
|
|
overflow: 'hidden',
|
|
width: '100%',
|
|
height: '10px',
|
|
borderRadius: '22px',
|
|
});
|
|
|
|
export const progressFgStyle = css({
|
|
height: '100%',
|
|
});
|
|
|
|
export const progressDragHandleStyle = css({
|
|
position: 'absolute',
|
|
top: '0',
|
|
left: '0',
|
|
transform: 'translate(0px, -1px)',
|
|
width: '6px',
|
|
height: '12px',
|
|
borderRadius: '2px',
|
|
opacity: '1',
|
|
cursor: 'ew-resize',
|
|
background: 'var(--affine-primary-color)',
|
|
transition: 'opacity 0.2s ease-in-out',
|
|
});
|
|
|
|
export const progressNumberStyle = css({
|
|
display: 'flex',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
height: '18px',
|
|
width: '25px',
|
|
color: 'var(--affine-text-secondary-color)',
|
|
fontSize: '14px',
|
|
fontFamily: baseTheme.fontSansFamily,
|
|
});
|