toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2024-12-19 06:21:45 +03:00
Code Issues Packages Projects Releases Wiki Activity

chore: update collasp page styles

Browse Source
This commit is contained in:
lawvs 2022-08-09 21:25:22 +08:00
parent e44b86c94c
commit c2abb78612
1 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
apps/ligo-virgo/src/pages/workspace/docs/collapsible-page-tree.tsx
View File

@ -1,34 +1,32 @@
import React, { useCallback, useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import {
MuiBox as Box,
MuiButton as Button,
MuiCollapse as Collapse,
MuiIconButton as IconButton,
styled,
} from '@toeverything/components/ui';
import { import {
AddIcon,
ArrowDropDownIcon, ArrowDropDownIcon,
ArrowRightIcon, ArrowRightIcon,
} from '@toeverything/components/icons'; } from '@toeverything/components/icons';
import { services } from '@toeverything/datasource/db-service';
import { import {
usePageTree,
useCalendarHeatmap, useCalendarHeatmap,
usePageTree,
} from '@toeverything/components/layout'; } from '@toeverything/components/layout';
import { AddIcon } from '@toeverything/components/icons'; import {
MuiBox as Box,
MuiCollapse as Collapse,
styled,
} from '@toeverything/components/ui';
import { services } from '@toeverything/datasource/db-service';
import React, { useCallback, useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
const StyledContainer = styled('div')({ const StyledBtn = styled('div')({
height: '32px', height: '32px',
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
});
const StyledBtn = styled('div')({
color: '#98ACBD', color: '#98ACBD',
textTransform: 'none', textTransform: 'none',
fontSize: '12px', fontSize: '12px',
fontWeight: '600', fontWeight: '600',
cursor: 'pointer',
userSelect: 'none',
flex: 1,
}); });
export type CollapsiblePageTreeProps = { export type CollapsiblePageTreeProps = {
@ -81,16 +79,14 @@ export function CollapsiblePageTree(props: CollapsiblePageTreeProps) {
onMouseEnter={() => setNewPageBtnVisible(true)} onMouseEnter={() => setNewPageBtnVisible(true)}
onMouseLeave={() => setNewPageBtnVisible(false)} onMouseLeave={() => setNewPageBtnVisible(false)}
> >
<StyledContainer> <StyledBtn onClick={() => setOpen(prev => !prev)}>
{open ? ( {open ? (
<ArrowDropDownIcon sx={{ color: '#566B7D' }} /> <ArrowDropDownIcon sx={{ color: '#566B7D' }} />
) : ( ) : (
<ArrowRightIcon sx={{ color: '#566B7D' }} /> <ArrowRightIcon sx={{ color: '#566B7D' }} />
)} )}
<StyledBtn onClick={() => setOpen(prev => !prev)}> {title}
{title} </StyledBtn>
</StyledBtn>
</StyledContainer>
{newPageBtnVisible && ( {newPageBtnVisible && (
<AddIcon <AddIcon