[PE mobile] Refactoring

This commit is contained in:
JuliaSvinareva 2021-01-23 18:44:40 +03:00
parent 7a867312a4
commit 955a6c7456
4 changed files with 10 additions and 33 deletions

View file

@ -23,14 +23,6 @@
}
}
.row {
padding: 0 10px;
li {
list-style: none;
}
}
.disabled, [disabled] {
opacity: .55;
pointer-events: none;
@ -424,19 +416,3 @@
}
}
}
.bullets, .numbers {
li {
position: relative;
z-index: 1;
}
li.active::after {
content: '';
position: absolute;
width: 22px;
height: 22px;
right: -5px;
bottom: -5px;
.encoded-svg-background('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 22 22" fill="#aa5252"><g><circle fill="#fff" cx="11" cy="11" r="11"/><path d="M11,21A10,10,0,1,1,21,11,10,10,0,0,1,11,21h0ZM17.4,7.32L17.06,7a0.48,0.48,0,0,0-.67,0l-7,6.84L6.95,11.24a0.51,0.51,0,0,0-.59.08L6,11.66a0.58,0.58,0,0,0,0,.65l3.19,3.35a0.38,0.38,0,0,0,.39,0L17.4,8a0.48,0.48,0,0,0,0-.67h0Z"/></g></svg>');
}
}

View file

@ -5,6 +5,7 @@
@import '../../../../common/mobile/resources/less/common.less';
@import '../../../../common/mobile/resources/less/common-ios.less';
@import '../../../../common/mobile/resources/less/common-material.less';
@import '../../../../common/mobile/resources/less/dataview.less';
@import '../../../../common/mobile/resources/less/about.less';
@import './app-material.less';
@import './app-ios.less';

View file

@ -111,16 +111,16 @@ const PageStyle = props => {
<Page>
<Navbar backLink={_t.textBack}>
<div className='tab-buttons tabbar'>
<Link key={"de-link-shape-fill"} tabLink={"#edit-shape-fill"} tabLinkActive={true}>{_t.textFill}</Link>
<Link key={"de-link-shape-border"} tabLink={"#edit-shape-border"}>{_t.textBorder}</Link>
<Link key={"de-link-shape-effects"} tabLink={"#edit-shape-effects"}>{_t.textEffects}</Link>
<Link key={"pe-link-shape-fill"} tabLink={"#edit-shape-fill"} tabLinkActive={true}>{_t.textFill}</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>
</div>
</Navbar>
<Tabs animated>
<Tab key={"de-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}>
<PaletteFill onFillColor={props.onFillColor}/>
</Tab>
<Tab key={"de-tab-shape-border"} id={"edit-shape-border"} className="page-content no-padding-top">
<Tab key={"pe-tab-shape-border"} id={"edit-shape-border"} className="page-content no-padding-top">
<List>
<ListItem>
<div slot="root-start" className='inner-range-title'>{_t.textSize}</div>
@ -144,7 +144,7 @@ const PageStyle = props => {
</ListItem>
</List>
</Tab>
<Tab key={"de-tab-shape-effects"} id={"edit-shape-effects"} className="page-content no-padding-top">
<Tab key={"pe-tab-shape-effects"} id={"edit-shape-effects"} className="page-content no-padding-top">
<List>
<ListItem>
<div slot="root-start" className='inner-range-title'>{_t.textOpacity}</div>
@ -248,7 +248,7 @@ const PageReplace = props => {
shapes.splice(0, 1); // Remove line shapes
return (
<Page className="shapes">
<Page className="shapes dataview">
<Navbar title={_t.textReplace} backLink={_t.textBack} />
{shapes.map((row, indexRow) => {
return (

View file

@ -366,7 +366,7 @@ const PageBullets = props => {
const typeBullets = storeTextSettings.typeBullets;
return (
<Page className='bullets'>
<Page className='bullets dataview'>
<Navbar title={_t.textBullets} backLink={_t.textBack} />
{bulletArrays.map((bullets, index) => (
<ul className="row" style={{listStyle: 'none'}} key={'bullets-' + index}>
@ -408,7 +408,7 @@ const PageNumbers = props => {
const typeNumbers = storeTextSettings.typeNumbers;
return (
<Page className='numbers'>
<Page className='numbers dataview'>
<Navbar title={_t.textNumbers} backLink={_t.textBack} />
{numberArrays.map((numbers, index) => (
<ul className="row" style={{listStyle: 'none'}} key={'numbers-' + index}>