[PE mobile] Corrected navbars in EditShape

This commit is contained in:
SergeyEzhin 2021-05-27 14:46:53 +03:00
parent 5c51353d23
commit dcfc625408

View file

@ -124,6 +124,13 @@ const PageStyle = props => {
<Link key={"pe-link-shape-border"} tabLink={"#edit-shape-border"}>{_t.textBorder}</Link> <Link key={"pe-link-shape-border"} tabLink={"#edit-shape-border"}>{_t.textBorder}</Link>
<Link key={"pe-link-shape-effects"} tabLink={"#edit-shape-effects"}>{_t.textEffects}</Link> <Link key={"pe-link-shape-effects"} tabLink={"#edit-shape-effects"}>{_t.textEffects}</Link>
</div> </div>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar> </Navbar>
<Tabs animated> <Tabs animated>
<Tab key={"pe-tab-shape-fill"} id={"edit-shape-fill"} className="page-content no-padding-top" tabActive={true}> <Tab key={"pe-tab-shape-fill"} id={"edit-shape-fill"} className="page-content no-padding-top" tabActive={true}>
@ -176,7 +183,7 @@ const PageStyle = props => {
const PageCustomFillColor = props => { const PageCustomFillColor = props => {
const { t } = useTranslation(); const { t } = useTranslation();
const _t = t('Edit', {returnObjects: true}); const _t = t('View.Edit', {returnObjects: true});
let fillColor = props.storeShapeSettings.fillColor; let fillColor = props.storeShapeSettings.fillColor;
if (typeof fillColor === 'object') { if (typeof fillColor === 'object') {
@ -192,7 +199,15 @@ const PageCustomFillColor = props => {
return( return(
<Page> <Page>
<Navbar title={_t.textCustomColor} backLink={_t.textBack} /> <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
<CustomColorPicker currentColor={fillColor} onAddNewColor={onAddNewColor}/> <CustomColorPicker currentColor={fillColor} onAddNewColor={onAddNewColor}/>
</Page> </Page>
) )
@ -232,7 +247,15 @@ const PageStyleNoFill = props => {
return ( return (
<Page> <Page>
<Navbar backLink={_t.textBack} title={_t.textBorder}></Navbar> <Navbar backLink={_t.textBack} title={_t.textBorder}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
<List> <List>
<ListItem> <ListItem>
<div slot="root-start" className='inner-range-title'>{_t.textSize}</div> <div slot="root-start" className='inner-range-title'>{_t.textSize}</div>
@ -275,7 +298,15 @@ const PageReplace = props => {
return ( return (
<Page className="shapes dataview"> <Page className="shapes dataview">
<Navbar title={_t.textReplace} backLink={_t.textBack} /> <Navbar title={_t.textReplace} backLink={_t.textBack}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
{shapes.map((row, indexRow) => { {shapes.map((row, indexRow) => {
return ( return (
<ul className="row" key={'shape-row-' + indexRow}> <ul className="row" key={'shape-row-' + indexRow}>
@ -307,7 +338,15 @@ const PageReorder = props => {
return ( return (
<Page> <Page>
<Navbar title={_t.textReorder} backLink={_t.textBack} /> <Navbar title={_t.textReorder} backLink={_t.textBack}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
<List> <List>
<ListItem title={_t.textBringToForeground} link='#' onClick={() => {props.onReorder('all-up')}} className='no-indicator'> <ListItem title={_t.textBringToForeground} link='#' onClick={() => {props.onReorder('all-up')}} className='no-indicator'>
<Icon slot="media" icon="icon-move-foreground"></Icon> <Icon slot="media" icon="icon-move-foreground"></Icon>
@ -338,7 +377,15 @@ const PageAlign = props => {
return ( return (
<Page> <Page>
<Navbar title={_t.textAlign} backLink={_t.textBack} /> <Navbar title={_t.textAlign} backLink={_t.textBack}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
<List> <List>
<ListItem title={_t.textAlignLeft} link='#' onClick={() => {props.onAlign('align-left')}} className='no-indicator'> <ListItem title={_t.textAlignLeft} link='#' onClick={() => {props.onAlign('align-left')}} className='no-indicator'>
<Icon slot="media" icon="icon-align-left"></Icon> <Icon slot="media" icon="icon-align-left"></Icon>
@ -394,7 +441,15 @@ const PageBorderColor = props => {
}; };
return ( return (
<Page> <Page>
<Navbar title={_t.textColor} backLink={_t.textBack} /> <Navbar title={_t.textColor} backLink={_t.textBack}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
<ThemeColorPalette changeColor={changeColor} curColor={borderColor} customColors={customColors}/> <ThemeColorPalette changeColor={changeColor} curColor={borderColor} customColors={customColors}/>
<List> <List>
<ListItem title={_t.textAddCustomColor} link={'/edit-shape-custom-border-color/'} routeProps={{ <ListItem title={_t.textAddCustomColor} link={'/edit-shape-custom-border-color/'} routeProps={{
@ -420,7 +475,15 @@ const PageCustomBorderColor = props => {
}; };
return ( return (
<Page> <Page>
<Navbar title={_t.textCustomColor} backLink={_t.textBack} /> <Navbar title={_t.textCustomColor} backLink={_t.textBack}>
{Device.phone &&
<NavRight>
<Link sheetClose='#edit-sheet'>
<Icon icon='icon-expand-down'/>
</Link>
</NavRight>
}
</Navbar>
<CustomColorPicker currentColor={borderColor} onAddNewColor={onAddNewColor}/> <CustomColorPicker currentColor={borderColor} onAddNewColor={onAddNewColor}/>
</Page> </Page>
) )