feat: default-popup element size

This commit is contained in:
Michal Szczepanski 2023-09-22 06:16:10 +02:00
parent 7749bf5dd8
commit 031f85f071
7 changed files with 18 additions and 21 deletions

@ -18,7 +18,7 @@ import React, { FunctionComponent } from 'react';
export const SaveElementIcon: FunctionComponent = () => {
return (
<svg xmlns="http://www.w3.org/2000/svg" fill="#777777" height="24" viewBox="0 0 24 24" width="24">
<svg xmlns="http://www.w3.org/2000/svg" fill="#777777" height="16" viewBox="0 0 24 24" width="16">
<g>
<path
d="M20,4H4C2.9,4,2.01,4.9,2.01,6L2,18c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V6C22,4.9,21.1,4,20,4z

@ -82,7 +82,7 @@ export const MainViewComponent: FunctionComponent = () => {
previousView={previousView}
changeMainTabCallback={changeMainTab}
/>
<div style={{ wordBreak: 'break-word', overflow: 'auto', marginBottom: 110 }}>{currentComponent}</div>
<div style={{ wordBreak: 'break-word', overflow: 'hidden', marginBottom: 110 }}>{currentComponent}</div>
</div>
<MainFooterButton openBugReport={() => setCurrentView(MainViewEnum.BUG_REPORT)} />
</div>

@ -65,7 +65,7 @@ export const NoteListElementComponent: FunctionComponent<Props> = (props) => {
>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
<div style={{ color: '#777777' }}>
<NoteOutlinedIcon />
<NoteOutlinedIcon sx={{ fontSize: '16px' }} />
</div>
<IconButton size="small" onClick={handlePopover}>
{expandIcon}

@ -37,6 +37,7 @@ interface Props {
editNoteCallback: (obj: ObjDto<ObjPageNoteDto>) => void;
idList: number[];
href?: string;
basis: boolean;
}
interface FetchObjectsResult {
@ -146,15 +147,10 @@ export const ObjListComponent: FunctionComponent<Props> = (props) => {
}
}
}
const handleScroll = () => {
LogManager.log('scroll');
};
// TODO add scroll handler
return (
<div style={{ width: '100%' }}>
<div style={{ width: '100%' }} onScroll={handleScroll}>
{components}
</div>
<div style={{ width: '100%', display: 'flex', flexDirection: 'column' }}>
<div style={{ overflow: 'auto', maxHeight: '200px' }}>{components}</div>
</div>
);
};

@ -55,16 +55,13 @@ export const ObjViewComponent: FunctionComponent<Props> = (props) => {
setOriginIds(origin);
};
return (
<div style={{ overflow: 'hidden' }}>
<Typography fontWeight="bold" fontSize="14px">
On this page
</Typography>
<ObjListComponent idList={hrefIds} editNoteCallback={props.editNoteCallback} />
<Typography fontWeight="bold" fontSize="14px">
On {PopupActiveTabStore.url?.origin}
</Typography>
<div style={{ maxHeight: '420px', display: 'flex', flexDirection: 'column' }}>
<div style={{ fontWeight: 'bold', fontSize: '14px' }}>On this page</div>
<ObjListComponent idList={hrefIds} basis={true} editNoteCallback={props.editNoteCallback} />
<div style={{ fontWeight: 'bold', fontSize: '14px' }}>On {PopupActiveTabStore.url?.origin}</div>
<ObjListComponent
idList={originIds}
basis={false}
href={PopupActiveTabStore.url?.href}
editNoteCallback={props.editNoteCallback}
/>

@ -90,7 +90,7 @@ export const PinListElement: FunctionComponent<Props> = (props) => {
>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
<div style={{ color: '#777777' }}>
<PushPinIcon />
<PushPinIcon sx={{ fontSize: '16px' }} />
</div>
<IconButton size="small" onClick={handlePopover}>
{expandIcon}

@ -85,7 +85,11 @@ export const SnapshotListElement: FunctionComponent<SnapshotListElementProps> =
>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
<div style={{ color: '#777777' }}>
{props.obj.type === ObjTypeDto.PageElementSnapshot ? <SaveElementIcon /> : <WebOutlined />}
{props.obj.type === ObjTypeDto.PageElementSnapshot ? (
<SaveElementIcon />
) : (
<WebOutlined sx={{ fontSize: '16px' }} />
)}
</div>
<IconButton size="small" onClick={handlePopover}>
{expandIcon}