Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-13 04:48:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: upgrate to new theme (#2027)

Browse Source 
Co-authored-by: Himself65 <himself65@outlook.com>
This commit is contained in:
Flrande
2023-04-20 16:31:19 +08:00
committed by GitHub
parent 63f7b2556e
commit 372377dd6b
61 changed files with 624 additions and 1037 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/component/src/components/share-menu/disable-public-link/style.ts
View File

@@ -5,7 +5,7 @@ export const StyledModalWrapper = styled('div')(({ theme }) => {
position: 'relative',
padding: '0px',
width: '560px',
background: theme.colors.popoverBackground,
background: 'var(--affine-white)',
borderRadius: '12px',
// height: '312px',
};
@@ -16,7 +16,7 @@ export const StyledModalHeader = styled('div')(({ theme }) => {
margin: '44px 0px 12px 0px',
width: '560px',
fontWeight: '600',
fontSize: theme.font.h6,
fontSize: 'var(--affine-font-h6)',
textAlign: 'center',
};
});
@@ -27,7 +27,7 @@ export const StyledTextContent = styled('div')(({ theme }) => {
width: '560px',
padding: '0px 84px',
fontWeight: '400',
fontSize: theme.font.base,
fontSize: 'var(--affine-font-base)',
textAlign: 'center',
};
});
@@ -42,7 +42,7 @@ export const StyledButtonContent = styled('div')(() => {
});
export const StyledButton = styled(TextButton)(({ theme }) => {
return {
color: theme.colors.primaryColor,
color: 'var(--affine-primary-color)',
height: '32px',
background: '#F3F0FF',
border: 'none',

36
packages/component/src/components/share-menu/styles.ts
View File

@@ -8,12 +8,14 @@ export const StyledShareButton = styled(TextButton, {
marginLeft: '4px',
marginRight: '16px',
border: `1px solid ${
isShared ? theme.colors.primaryColor : theme.colors.iconColor
isShared ? 'var(--affine-primary-color)' : 'var(--affine-icon-color)'
}`,
color: isShared ? theme.colors.primaryColor : theme.colors.iconColor,
color: isShared
? 'var(--affine-primary-color)'
: 'var(--affine-icon-color)',
borderRadius: '8px',
':hover': {
border: `1px solid ${theme.colors.primaryColor}`,
border: `1px solid ${'var(--affine-primary-color)'}`,
},
span: {
...displayFlex('center', 'center'),
@@ -35,11 +37,11 @@ export const TabItem = styled('li')<{ isActive?: boolean }>(
...displayFlex('center', 'center'),
flex: '1',
height: '30px',
color: theme.colors.textColor,
color: 'var(--affine-text-primary-color)',
opacity: isActive ? 1 : 0.2,
fontWeight: '500',
fontSize: theme.font.base,
lineHeight: theme.font.lineHeight,
fontSize: 'var(--affine-font-base)',
lineHeight: 'var(--affine-line-height)',
cursor: 'pointer',
transition: 'all 0.15s ease',
padding: '0 10px',
@@ -47,15 +49,15 @@ export const TabItem = styled('li')<{ isActive?: boolean }>(
borderRadius: '4px',
position: 'relative',
':hover': {
background: theme.colors.hoverBackground,
background: 'var(--affine-hover-color)',
opacity: 1,
color: isActive
? theme.colors.textColor
: theme.colors.secondaryTextColor,
? 'var(--affine-text-primary-color)'
: 'var(--affine-text-secondary-color)',
svg: {
fill: isActive
? theme.colors.textColor
: theme.colors.secondaryTextColor,
? 'var(--affine-text-primary-color)'
: 'var(--affine-text-secondary-color)',
},
},
svg: {
@@ -69,7 +71,7 @@ export const TabItem = styled('li')<{ isActive?: boolean }>(
left: '0',
width: '100%',
height: '2px',
background: theme.colors.textColor,
background: 'var(--affine-text-primary-color)',
opacity: 0.2,
},
};
@@ -79,7 +81,7 @@ export const TabItem = styled('li')<{ isActive?: boolean }>(
export const StyledIndicator = styled('div')(({ theme }) => {
return {
height: '2px',
background: theme.colors.textColor,
background: 'var(--affine-text-primary-color)',
position: 'absolute',
left: '0',
transition: 'left .3s, width .3s',
@@ -89,8 +91,8 @@ export const StyledInput = styled('input')(({ theme }) => {
return {
padding: '4px 8px',
height: '28px',
color: theme.colors.placeHolderColor,
border: `1px solid ${theme.colors.placeHolderColor}`,
color: 'var(--affine-placeholder-color)',
border: `1px solid ${'var(--affine-placeholder-color)'}`,
cursor: 'default',
overflow: 'hidden',
userSelect: 'text',
@@ -101,7 +103,7 @@ export const StyledInput = styled('input')(({ theme }) => {
});
export const StyledButton = styled(TextButton)(({ theme }) => {
return {
color: theme.colors.primaryColor,
color: 'var(--affine-primary-color)',
height: '32px',
background: '#F3F0FF',
border: 'none',
@@ -122,7 +124,7 @@ export const StyledDisableButton = styled(Button)(() => {
export const StyledLinkSpan = styled('span')(({ theme }) => {
return {
marginLeft: '4px',
color: theme.colors.primaryColor,
color: 'var(--affine-primary-color)',
fontWeight: '500',
cursor: 'pointer',
};