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

chore: update menu background color (#2170)

Browse Source
This commit is contained in:
JimmFly
2023-04-28 02:06:17 +08:00
committed by GitHub
parent dcf7e83eec
commit f3cbe54625
14 changed files with 31 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web/src/components/affine/operation-menu-items/Export.tsx
View File

@@ -20,7 +20,7 @@ export const Export = ({
return (
<Menu
width={248}
placement="left-start"
// placement="left-start"
trigger="click"
content={
<>

2
apps/web/src/components/affine/operation-menu-items/MoveTo.tsx
View File

@@ -49,7 +49,7 @@ export const MoveTo = ({
<PinboardMenu
anchorEl={anchorEl}
open={open}
placement="left-start"
// placement="left-start"
metas={metas}
currentMeta={currentMeta}
blockSuiteWorkspace={blockSuiteWorkspace}

4
apps/web/src/components/affine/pinboard/pinboard-render/OperationButton.tsx
View File

@@ -88,7 +88,7 @@ export const OperationButton = ({
width={256}
anchorEl={anchorEl}
open={operationMenuOpen}
placement="bottom-start"
// placement="bottom-start"
zIndex={menuIndex}
>
<MenuItem
@@ -143,7 +143,7 @@ export const OperationButton = ({
<PinboardMenu
anchorEl={anchorEl}
open={pinboardMenuOpen}
placement="bottom-start"
// placement="bottom-start"
zIndex={menuIndex}
metas={metas}
currentMeta={currentMeta}

2
apps/web/src/components/affine/workspace-setting-detail/panel/collaboration/index.tsx
View File

@@ -120,7 +120,7 @@ const AffineRemoteCollaborationPanel: React.FC<
</MenuItem>
</>
}
placement="bottom-end"
// placement="bottom-end"
disablePortal={true}
trigger="click"
>

10
apps/web/src/components/blocksuite/block-suite-page-list/page-list/OperationCell.tsx
View File

@@ -69,7 +69,13 @@ export const OperationCell: React.FC<OperationCellProps> = ({
favorite ? t('Removed from Favorites') : t('Added to Favorites')
);
}}
icon={favorite ? <FavoritedIcon /> : <FavoriteIcon />}
icon={
favorite ? (
<FavoritedIcon style={{ color: 'var(--affine-primary-color)' }} />
) : (
<FavoriteIcon />
)
}
>
{favorite ? t('Remove from favorites') : t('Add to Favorites')}
</MenuItem>
@@ -98,7 +104,7 @@ export const OperationCell: React.FC<OperationCellProps> = ({
<FlexWrapper alignItems="center" justifyContent="center">
<Menu
content={OperationMenu}
placement="bottom-end"
// placement="bottom-end"
disablePortal={true}
trigger="click"
>

2
apps/web/src/components/blocksuite/workspace-header/header-right-items/EditorOptionMenu.tsx
View File

@@ -93,7 +93,7 @@ export const EditorOptionMenu = () => {
<Menu
width={276}
content={EditMenu}
placement="bottom-end"
// placement="bottom-end"
disablePortal={true}
trigger="click"
>

2
apps/web/src/components/blocksuite/workspace-header/header-right-items/UserAvatar.tsx
View File

@@ -16,7 +16,7 @@ export const UserAvatar = () => {
<Menu
width={276}
content={EditMenu}
placement="bottom-end"
// placement="bottom-end"
disablePortal={true}
trigger="click"
>

2
apps/web/src/components/pure/help-island/index.tsx
View File

@@ -108,7 +108,7 @@ export const HelpIsland = ({
</MuiFade>
</Tooltip>
<MuiFade in={spread}>
<StyledTriggerWrapper>
<StyledTriggerWrapper spread>
<CloseIcon />
</StyledTriggerWrapper>
</MuiFade>

14
apps/web/src/components/pure/help-island/style.ts
View File

@@ -7,17 +7,14 @@ export const StyledIsland = styled('div')<{
transition: 'box-shadow 0.2s',
width: '44px',
position: 'relative',
boxShadow: spread
? '4px 4px 7px rgba(58, 76, 92, 0.04), -4px -4px 13px rgba(58, 76, 92, 0.02), 6px 6px 36px rgba(58, 76, 92, 0.06)'
: 'unset',
boxShadow: spread ? 'var(--affine-menu-shadow)' : 'unset',
padding: '0 4px 44px',
borderRadius: '10px',
background: spread
? 'var(--affine-background-overlay-panel-color)'
: 'transparent',
: 'var(--affine-background-primary-color)',
':hover': {
boxShadow:
'4px 4px 7px rgba(58, 76, 92, 0.04), -4px -4px 13px rgba(58, 76, 92, 0.02), 6px 6px 36px rgba(58, 76, 92, 0.06)',
background: spread ? null : 'var(--affine-white)',
},
'::after': {
content: '""',
@@ -58,7 +55,9 @@ export const StyledAnimateWrapper = styled('div')(() => ({
overflow: 'hidden',
}));
export const StyledTriggerWrapper = styled('div')(({ theme }) => {
export const StyledTriggerWrapper = styled('div')<{
spread?: boolean;
}>(({ theme, spread }) => {
return {
width: '36px',
height: '36px',
@@ -70,6 +69,7 @@ export const StyledTriggerWrapper = styled('div')(({ theme }) => {
...positionAbsolute({ left: '4px', bottom: '4px' }),
':hover': {
color: 'var(--affine-primary-color)',
backgroundColor: spread ? 'var(--affine-hover-color)' : null,
},
};
});

2
apps/web/src/components/pure/shortcuts-modal/style.ts
View File

@@ -6,7 +6,7 @@ export const StyledShortcutsModal = styled('div')(({ theme }) => ({
paddingBottom: '28px',
backgroundColor: 'var(--affine-white)',
boxShadow: 'var(--affine-popover-shadow)',
borderRadius: `var(--affine-popover-radius) 0 var(--affine-popover-radius) var(--affine-popover-radius)`,
borderRadius: `var(--affine-popover-radius)`,
overflow: 'auto',
boxRadius: '10px',
position: 'fixed',

2
packages/component/src/components/share-menu/ShareMenu.tsx
View File

@@ -123,7 +123,7 @@ export const ShareMenu: FC<ShareMenuProps> = props => {
<Menu
content={Share}
visible={open}
placement="bottom-end"
// placement="bottom-end"
trigger={['click']}
width={439}
disablePortal={true}

6
packages/component/src/ui/button/utils.ts
View File

@@ -8,14 +8,14 @@ export const SIZE_CONFIG = {
[SIZE_SMALL]: {
iconSize: 16,
fontSize: 16,
borderRadius: 6,
borderRadius: 4,
height: 26,
padding: 24,
},
[SIZE_MIDDLE]: {
iconSize: 20,
fontSize: 16,
borderRadius: 6,
borderRadius: 4,
height: 32,
padding: 24,
},
@@ -24,7 +24,7 @@ export const SIZE_CONFIG = {
fontSize: 16,
height: 38,
padding: 24,
borderRadius: 6,
borderRadius: 4,
},
} as const;

4
packages/component/src/ui/menu/styles.ts
View File

@@ -74,11 +74,7 @@ export const StyledMenuItem = styled('button')<{
':hover': disabled
? {}
: {
color: 'var(--affine-primary-color)',
backgroundColor: 'var(--affine-hover-color)',
svg: {
color: 'var(--affine-primary-color)',
},
},
};
});

6
packages/theme/src/index.ts
View File

@@ -48,7 +48,7 @@ export const baseTheme = {
zIndexPopover: '100',
paragraphSpace: '8px',
popoverRadius: '10px',
popoverRadius: '12px',
zoom: '1',
scale: 'calc(1 / var(--affine-zoom))',
@@ -73,7 +73,7 @@ export const lightTheme = {
backgroundSecondaryColor: 'rgb(251, 250, 252)',
backgroundTertiaryColor: 'rgb(233, 233, 236)',
backgroundCodeBlock: 'rgb(250, 251, 253)',
backgroundModalColor: 'rgba(0, 0, 0, 0.6)',
backgroundModalColor: 'rgba(0, 0, 0, 0.4)',
textPrimaryColor: 'rgb(66, 65, 73)',
textSecondaryColor: 'rgb(142, 141, 145)',
textDisableColor: 'rgb(169, 169, 173)',
@@ -197,7 +197,7 @@ export const darkTheme = {
backgroundSuccessColor: 'rgba(8, 21, 18, 1)',
backgroundPrimaryColor: 'rgb(20, 20, 20)',
backgroundSecondaryColor: 'rgb(32, 32, 32)',
backgroundModalColor: 'rgba(0, 0, 0, 0.8)',
backgroundModalColor: 'rgba(0, 0, 0, 0.5)',
backgroundOverlayPanelColor: 'rgb(30, 30, 30)',
tagBlue: 'rgba(8, 67, 136, 1)',
tagGreen: 'rgba(44, 108, 63, 1)',