Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Merge branch 'feature/mobile-apps-on-reactjs' of https://github.com/ONLYOFFICE/web-apps into feature/mobile-apps-on-reactjs

Browse source
This commit is contained in:
SergeyEzhin 2021-03-19 15:14:20 +03:00
parent 25dd91828a f33112be3a
commit 02e1106a13
13 changed files with 291 additions and 200 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
apps/common/mobile/resources/less/icons.less
View file

@ -7,6 +7,16 @@ i.icon {
height: 24px;
.encoded-svg-uncolored-mask('<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" /><path d="M5 0H14V5H5V0Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" /></svg>');
}
&.icon-copy {
width: 24px;
height: 24px;
.encoded-svg-uncolored-mask('<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M1 1H15V7H16V0H0V17H8V16H1V1Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M23 8H9V23H23V8ZM8 7V24H24V7H8Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13 5H3V4H13V5Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 9H3V8H8V9Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 13H3V12H8V13Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H11V11H21V12Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H11V15H21V16Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H11V19H21V20Z"/></svg>');
}
&.icon-cut {
width: 24px;
height: 24px;
.encoded-svg-uncolored-mask('<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#cut)"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.22427 22.2702C4.51527 23.1269 6.52738 22.7183 7.6592 21.0127C8.79101 19.3071 8.38572 17.2943 7.09472 16.4376C5.80372 15.5809 3.79161 15.9896 2.65979 17.6952C1.52798 19.4008 1.93328 21.4136 3.22427 22.2702ZM2.67135 23.1035C4.51208 24.325 7.11827 23.6364 8.49243 21.5656C9.8666 19.4948 9.48837 16.8259 7.64764 15.6044C5.80691 14.3829 3.20072 15.0714 1.82656 17.1422C0.452398 19.2131 0.830625 21.882 2.67135 23.1035Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.9158 22.2702C19.6248 23.1269 17.6127 22.7183 16.4809 21.0127C15.349 19.3071 15.7543 17.2943 17.0453 16.4376C18.3363 15.5809 20.3484 15.9896 21.4803 17.6952C22.6121 19.4008 22.2068 21.4136 20.9158 22.2702ZM21.4687 23.1035C19.628 24.325 17.0218 23.6364 15.6476 21.5656C14.2735 19.4948 14.6517 16.8259 16.4924 15.6044C18.3331 14.3829 20.9393 15.0714 22.3135 17.1422C23.6877 19.2131 23.3094 21.882 21.4687 23.1035Z"/><path d="M16.4924 15.6044L13.9037 12.4737L19.9552 0.675715C20.0693 0.446914 19.9552 0.172352 19.727 0.0808313C19.4416 -0.0106892 19.0993 0.0808312 18.9851 0.263872L12.0233 11.4212L5.17562 0.263872C5.06149 0.035071 4.71911 -0.0564496 4.43379 0.035071C4.14847 0.126592 4.03434 0.401153 4.14847 0.629955L10.2001 12.4279L7.64761 15.6044L9.2292 18L12.0233 13.4804L14.9108 18L16.4924 15.6044Z"/></g><defs><clipPath id="cut"><rect width="24" height="24"/></clipPath></defs></svg>');
}
&.icon-prev:after, &.icon-next:after {
content: none;
}

4
apps/documenteditor/mobile/locale/en.json
View file

@ -145,7 +145,9 @@
"menuCancel": "Cancel",
"textCopyCutPasteActions": "Copy, Cut and Paste Actions",
"errorCopyCutPaste": "Copy, cut and paste actions using the context menu will be performed within the current file only.",
"textDoNotShowAgain": "Don't show again"
"textDoNotShowAgain": "Don't show again",
"textColumns": "Columns",
"textRows": "Rows"
},
"Settings": {
"textCancel": "Cancel",

104
apps/documenteditor/mobile/src/controller/ContextMenu.jsx
View file

@ -89,6 +89,38 @@ class ContextMenu extends ContextMenuController {
this.props.openOptions('coauth', 'cm-review-change');
}, 400);
break;
case 'merge':
api.MergeCells();
break;
case 'split':
this.showSplitModal();
break;
case 'delete':
api.asc_Remove();
break;
case 'deletetable':
api.remTable();
break;
case 'edit':
setTimeout(() => {
this.props.openOptions('edit');
}, 0);
break;
case 'addlink':
setTimeout(() => {
this.props.openOptions('add', 'link');
}, 400)
break;
case 'openlink':
const stack = Common.EditorApi.get().getSelectedElements();
let value;
stack.forEach((item) => {
if (item.get_ObjectType() == Asc.c_oAscTypeSelectElement.Hyperlink) {
value = item.get_ObjectValue().get_Value();
}
});
value && this.openLink(value);
break;
}
console.log("click context menu item: " + action);
@ -117,6 +149,66 @@ class ContextMenu extends ContextMenuController {
}).open();
}
showSplitModal() {
const { t } = this.props;
const _t = t("ContextMenu", { returnObjects: true });
let picker;
const dialog = f7.dialog.create({
title: _t.menuSplit,
text: '',
content:
'<div class="content-block">' +
'<div class="row">' +
'<div class="col-50">' + _t.textColumns + '</div>' +
'<div class="col-50">' + _t.textRows + '</div>' +
'</div>' +
'<div id="picker-split-size"></div>' +
'</div>',
buttons: [
{
text: _t.menuCancel
},
{
text: 'OK',
bold: true,
onClick: function () {
const size = picker.value;
Common.EditorApi.get().SplitCell(parseInt(size[0]), parseInt(size[1]));
}
}
]
}).open();
dialog.on('opened', () => {
picker = f7.picker.create({
containerEl: document.getElementById('picker-split-size'),
cols: [
{
textAlign: 'center',
width: '100%',
values: [1,2,3,4,5,6,7,8,9,10]
},
{
textAlign: 'center',
width: '100%',
values: [1,2,3,4,5,6,7,8,9,10]
}
],
toolbar: false,
rotateEffect: true,
value: [3, 3]
});
});
}
openLink(url) {
if (Common.EditorApi.get().asc_getUrlType(url) > 0) {
const newDocumentPage = window.open(url, '_blank');
if (newDocumentPage) {
newDocumentPage.focus();
}
}
}
onDocumentReady() {
super.onDocumentReady();
@ -255,12 +347,12 @@ class ContextMenu extends ContextMenuController {
});
}
// if ( !_.isEmpty(api.can_AddHyperlink()) && !lockedHeader) {
// arrItems.push({
// caption: _t.menuAddLink,
// event: 'addlink'
// });
// }
if ( !!api.can_AddHyperlink() && !lockedHeader) {
itemsText.push({
caption: _t.menuAddLink,
event: 'addlink'
});
}
if ( canReview ) {
if (this.inRevisionChange) {

67
apps/documenteditor/mobile/src/controller/add/AddLink.jsx Normal file
View file

@ -0,0 +1,67 @@
import React, {Component} from 'react';
import { f7 } from 'framework7-react';
import {Device} from '../../../../../common/mobile/utils/device';
import { withTranslation} from 'react-i18next';
import {PageAddLink} from '../../view/add/AddLink';
class AddLinkController extends Component {
constructor (props) {
super(props);
this.onInsertLink = this.onInsertLink.bind(this);
}
closeModal () {
if ( Device.phone ) {
f7.sheet.close('.add-popup', true);
} else {
f7.popover.close('#add-popover');
}
}
getDisplayLinkText () {
const api = Common.EditorApi.get();
return api.can_AddHyperlink();
}
onInsertLink (url, display, tip) {
const api = Common.EditorApi.get();
const { t } = this.props;
const _t = t("Add", { returnObjects: true });
const urltype = api.asc_getUrlType(url.trim());
const isEmail = (urltype == 2);
if (urltype < 1) {
f7.dialog.alert(_t.txtNotUrl, _t.notcriticalErrorTitle);
return;
}
let _url = url.replace(/^\s+|\s+$/g,'');
if (! /(((^https?)|(^ftp)):\/\/)|(^mailto:)/i.test(_url) )
_url = (isEmail ? 'mailto:' : 'http://' ) + _url;
_url = _url.replace(new RegExp("%20",'g')," ");
const props = new Asc.CHyperlinkProperty();
props.put_Value(_url);
props.put_Text(!display ? _url : display);
props.put_ToolTip(tip);
api.add_Hyperlink(props);
this.closeModal();
}
render () {
return (
<PageAddLink closeModal={this.closeModal} onInsertLink={this.onInsertLink} getDisplayLinkText={this.getDisplayLinkText} noNavbar={this.props.noNavbar}/>
)
}
}
const AddLinkWithTranslation = withTranslation()(AddLinkController);
export {AddLinkWithTranslation as AddLinkController};

39
apps/documenteditor/mobile/src/controller/add/AddOther.jsx
View file

@ -66,7 +66,6 @@ const _Rometo10 = (str) => {
class AddOtherController extends Component {
constructor (props) {
super(props);
this.onInsertLink = this.onInsertLink.bind(this);
this.onInsertPageNumber = this.onInsertPageNumber.bind(this);
this.onPageBreak = this.onPageBreak.bind(this);
this.onColumnBreak = this.onColumnBreak.bind(this);
@ -86,42 +85,6 @@ class AddOtherController extends Component {
}
}
getDisplayLinkText () {
const api = Common.EditorApi.get();
return api.can_AddHyperlink();
}
onInsertLink (url, display, tip) {
const api = Common.EditorApi.get();
const { t } = this.props;
const _t = t("Add", { returnObjects: true });
const urltype = api.asc_getUrlType(url.trim());
const isEmail = (urltype == 2);
if (urltype < 1) {
f7.dialog.alert(_t.txtNotUrl, _t.notcriticalErrorTitle);
return;
}
let _url = url.replace(/^\s+|\s+$/g,'');
if (! /(((^https?)|(^ftp)):\/\/)|(^mailto:)/i.test(_url) )
_url = (isEmail ? 'mailto:' : 'http://' ) + _url;
_url = _url.replace(new RegExp("%20",'g')," ");
const props = new Asc.CHyperlinkProperty();
props.put_Value(_url);
props.put_Text(!display ? _url : display);
props.put_ToolTip(tip);
api.add_Hyperlink(props);
this.closeModal();
}
onInsertPageNumber (type) {
const api = Common.EditorApi.get();
@ -280,8 +243,6 @@ class AddOtherController extends Component {
render () {
return (
<AddOther closeModal={this.closeModal}
onInsertLink={this.onInsertLink}
getDisplayLinkText={this.getDisplayLinkText}
onInsertPageNumber={this.onInsertPageNumber}
onPageBreak={this.onPageBreak}
onColumnBreak={this.onColumnBreak}

12
apps/documenteditor/mobile/src/page/main.jsx
View file

@ -18,25 +18,29 @@ export default class MainPage extends Component {
this.state = {
editOptionsVisible: false,
addOptionsVisible: false,
addShowOptions: null,
settingsVisible: false,
collaborationVisible: false
};
}
handleClickToOpenOptions = (opts, page) => {
handleClickToOpenOptions = (opts, showOpts) => {
ContextMenu.closeContextMenu();
this.setState(state => {
if ( opts == 'edit' )
return {editOptionsVisible: true};
else if ( opts == 'add' )
return {addOptionsVisible: true};
return {
addOptionsVisible: true,
addShowOptions: showOpts
};
else if ( opts == 'settings' )
return {settingsVisible: true};
else if ( opts == 'coauth' )
return {
collaborationVisible: true,
collaborationPage: page
collaborationPage: showOpts
};
});
};
@ -90,7 +94,7 @@ export default class MainPage extends Component {
}
{
!this.state.addOptionsVisible ? null :
<AddOptions onclosed={this.handleOptionsViewClosed.bind(this, 'add')} />
<AddOptions onclosed={this.handleOptionsViewClosed.bind(this, 'add')} showOptions={this.state.addShowOptions} />
}
{
!this.state.settingsVisible ? null :

92
apps/documenteditor/mobile/src/view/add/Add.jsx
View file

@ -1,5 +1,5 @@
import React, {Component, useEffect} from 'react';
import {View,Page,Navbar,NavRight,Link,Popup,Popover,Icon,Tabs,Tab} from 'framework7-react';
import React, {Component, useEffect, Fragment} from 'react';
import {View,Page,Navbar,NavRight, NavTitle, Link,Popup,Popover,Icon,Tabs,Tab} from 'framework7-react';
import { useTranslation } from 'react-i18next';
import {f7} from 'framework7-react';
import { observer, inject } from "mobx-react";
@ -8,10 +8,11 @@ import {Device} from '../../../../../common/mobile/utils/device';
import {AddTableController} from "../../controller/add/AddTable";
import AddShapeController from "../../controller/add/AddShape";
import {AddImageController} from "../../controller/add/AddImage";
import {AddLinkController} from "../../controller/add/AddLink";
import {AddOtherController} from "../../controller/add/AddOther";
import {PageImageLinkSettings} from "../add/AddImage";
import {PageAddLink, PageAddNumber, PageAddBreak, PageAddSectionBreak, PageAddFootnote} from "../add/AddOther";
import {PageAddNumber, PageAddBreak, PageAddSectionBreak, PageAddFootnote} from "../add/AddOther";
const routes = [
// Image
@ -22,7 +23,7 @@ const routes = [
// Other
{
path: '/add-link/',
component: PageAddLink,
component: AddLinkController,
},
{
path: '/add-page-number/',
@ -44,15 +45,20 @@ const routes = [
const AddLayoutNavbar = ({ tabs, inPopover }) => {
const isAndroid = Device.android;
const { t } = useTranslation();
const _t = t('Add', {returnObjects: true});
return (
<Navbar>
<div className='tab-buttons tabbar'>
{tabs.map((item, index) =>
<Link key={"de-link-" + item.id} tabLink={"#" + item.id} tabLinkActive={index === 0}>
<Icon slot="media" icon={item.icon}></Icon>
</Link>)}
{isAndroid && <span className='tab-link-highlight' style={{width: 100 / tabs.lenght + '%'}}></span>}
</div>
{tabs.length > 1 ?
<div className='tab-buttons tabbar'>
{tabs.map((item, index) =>
<Link key={"de-link-" + item.id} tabLink={"#" + item.id} tabLinkActive={index === 0}>
<Icon slot="media" icon={item.icon}></Icon>
</Link>)}
{isAndroid && <span className='tab-link-highlight' style={{width: 100 / tabs.lenght + '%'}}></span>}
</div> :
<NavTitle>{ tabs[0].caption }</NavTitle>
}
{ !inPopover && <NavRight><Link icon='icon-expand-down' popupClose=".add-popup"></Link></NavRight> }
</Navbar>
)
@ -73,31 +79,41 @@ const AddLayoutContent = ({ tabs }) => {
const AddTabs = props => {
const { t } = useTranslation();
const _t = t('Add', {returnObjects: true});
const showPanels = props.showPanels;
const tabs = [];
tabs.push({
caption: _t.textTable,
id: 'add-table',
icon: 'icon-add-table',
component: <AddTableController />
});
tabs.push({
caption: _t.textShape,
id: 'add-shape',
icon: 'icon-add-shape',
component: <AddShapeController />
});
tabs.push({
caption: _t.textImage,
id: 'add-image',
icon: 'icon-add-image',
component: <AddImageController />
});
tabs.push({
caption: _t.textOther,
id: 'add-other',
icon: 'icon-add-other',
component: <AddOtherController />
});
if (!showPanels) {
tabs.push({
caption: _t.textTable,
id: 'add-table',
icon: 'icon-add-table',
component: <AddTableController/>
});
tabs.push({
caption: _t.textShape,
id: 'add-shape',
icon: 'icon-add-shape',
component: <AddShapeController/>
});
tabs.push({
caption: _t.textImage,
id: 'add-image',
icon: 'icon-add-image',
component: <AddImageController/>
});
tabs.push({
caption: _t.textOther,
id: 'add-other',
icon: 'icon-add-other',
component: <AddOtherController/>
});
}
if (showPanels && showPanels === 'link') {
tabs.push({
caption: _t.textAddLink,
id: 'add-link',
component: <AddLinkController noNavbar={true}/>
});
}
return (
<View style={props.style} stackPages={true} routes={routes}>
<Page pageContent={false}>
@ -122,10 +138,10 @@ class AddView extends Component {
return (
show_popover ?
<Popover id="add-popover" className="popover__titled" onPopoverClosed={() => this.props.onclosed()}>
<AddTabs inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} />
<AddTabs inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} showPanels={this.props.showPanels} />
</Popover> :
<Popup className="add-popup" onPopupClosed={() => this.props.onclosed()}>
<AddTabs onOptionClick={this.onoptionclick} />
<AddTabs onOptionClick={this.onoptionclick} showPanels={this.props.showPanels} />
</Popup>
)
}
@ -145,7 +161,7 @@ const Add = props => {
if ( props.onclosed )
props.onclosed();
};
return <AddView usePopover={!Device.phone} onclosed={onviewclosed} />
return <AddView usePopover={!Device.phone} onclosed={onviewclosed} showPanels={props.showOptions} />
};
export default Add;

51
apps/documenteditor/mobile/src/view/add/AddLink.jsx Normal file
View file

@ -0,0 +1,51 @@
import React, {useState} from 'react';
import {List, Page, Navbar, Icon, ListButton, ListInput} from 'framework7-react';
import { useTranslation } from 'react-i18next';
import {Device} from "../../../../../common/mobile/utils/device";
const PageLink = props => {
const { t } = useTranslation();
const _t = t('Add', {returnObjects: true});
let display = props.getDisplayLinkText();
display = typeof display === 'string' ? display : '';
const [stateLink, setLink] = useState('');
const [stateDisplay, setDisplay] = useState(display);
const [stateTip, setTip] = useState('');
return (
<Page>
{!props.noNavbar && <Navbar title={_t.textAddLink} backLink={_t.textBack}></Navbar>}
<List inlineLabels className='inputs-list'>
<ListInput
label={_t.textLink}
type="text"
placeholder={_t.textLink}
value={stateLink}
onChange={(event) => {setLink(event.target.value)}}
></ListInput>
<ListInput
label={_t.textDisplay}
type="text"
placeholder={_t.textDisplay}
value={stateDisplay}
onChange={(event) => {setDisplay(event.target.value)}}
></ListInput>
<ListInput
label={_t.textScreenTip}
type="text"
placeholder={_t.textScreenTip}
value={stateTip}
onChange={(event) => {setTip(event.target.value)}}
></ListInput>
</List>
<List>
<ListButton className={'button-fill button-raised' + (stateLink.length < 1 ? ' disabled' : '')} title={_t.textInsert} onClick={() => {
props.onInsertLink(stateLink, stateDisplay, stateTip)
}}></ListButton>
</List>
</Page>
)
};
export {PageLink as PageAddLink};

46
apps/documenteditor/mobile/src/view/add/AddOther.jsx
View file

@ -4,51 +4,6 @@ import {List, ListItem, Page, Navbar, Icon, ListButton, ListInput, BlockTitle, S
import { useTranslation } from 'react-i18next';
import {Device} from "../../../../../common/mobile/utils/device";
const PageLink = props => {
const { t } = useTranslation();
const _t = t('Add', {returnObjects: true});
let display = props.getDisplayLinkText();
display = typeof display === 'string' ? display : '';
const [stateLink, setLink] = useState('');
const [stateDisplay, setDisplay] = useState(display);
const [stateTip, setTip] = useState('');
return (
<Page>
<Navbar title={_t.textAddLink} backLink={_t.textBack}></Navbar>
<List inlineLabels className='inputs-list'>
<ListInput
label={_t.textLink}
type="text"
placeholder={_t.textLink}
value={stateLink}
onChange={(event) => {setLink(event.target.value)}}
></ListInput>
<ListInput
label={_t.textDisplay}
type="text"
placeholder={_t.textDisplay}
value={stateDisplay}
onChange={(event) => {setDisplay(event.target.value)}}
></ListInput>
<ListInput
label={_t.textScreenTip}
type="text"
placeholder={_t.textScreenTip}
value={stateTip}
onChange={(event) => {setTip(event.target.value)}}
></ListInput>
</List>
<List>
<ListButton className={'button-fill button-raised' + (stateLink.length < 1 ? ' disabled' : '')} title={_t.textInsert} onClick={() => {
props.onInsertLink(stateLink, stateDisplay, stateTip)
}}></ListButton>
</List>
</Page>
)
};
const PageNumber = props => {
const { t } = useTranslation();
const _t = t('Add', {returnObjects: true});
@ -240,7 +195,6 @@ const AddOther = props => {
const AddOtherContainer = inject("storeComments")(observer(AddOther));
export {AddOtherContainer as AddOther,
PageLink as PageAddLink,
PageNumber as PageAddNumber,
PageBreak as PageAddBreak,
PageSectionBreak as PageAddSectionBreak,

18
apps/presentationeditor/mobile/src/less/icons-ios.less
View file

@ -476,24 +476,6 @@
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 14H16C18.2091 14 20 15.7909 20 18C20 20.2091 18.2091 22 16 22H7C4.79086 22 3 20.2091 3 18C3 15.7909 4.79086 14 7 14ZM16 13C18.7614 13 21 15.2386 21 18C21 20.7614 18.7614 23 16 23H7C4.23858 23 2 20.7614 2 18C2 15.2386 4.23858 13 7 13H16Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 20C14.8954 20 14 19.1046 14 18C14 16.8954 14.8954 16 16 16C17.1046 16 18 16.8954 18 18C18 19.1046 17.1046 20 16 20ZM16 21C14.3431 21 13 19.6569 13 18C13 16.3431 14.3431 15 16 15C17.6569 15 19 16.3431 19 18C19 19.6569 17.6569 21 16 21Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 3H7C4.79086 3 3 4.79086 3 7C3 9.20914 4.79086 11 7 11H16C18.2091 11 20 9.20914 20 7C20 4.79086 18.2091 3 16 3ZM7 2C4.23858 2 2 4.23858 2 7C2 9.76142 4.23858 12 7 12H16C18.7614 12 21 9.76142 21 7C21 4.23858 18.7614 2 16 2H7Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7 9C8.10457 9 9 8.10457 9 7C9 5.89543 8.10457 5 7 5C5.89543 5 5 5.89543 5 7C5 8.10457 5.89543 9 7 9ZM7 10C8.65685 10 10 8.65685 10 7C10 5.34315 8.65685 4 7 4C5.34315 4 4 5.34315 4 7C4 8.65685 5.34315 10 7 10Z" fill="@{themeColor}"/></svg>');
}
&.icon-cut {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#cut)"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.22427 22.2702C4.51527 23.1269 6.52738 22.7183 7.6592 21.0127C8.79101 19.3071 8.38572 17.2943 7.09472 16.4376C5.80372 15.5809 3.79161 15.9896 2.65979 17.6952C1.52798 19.4008 1.93328 21.4136 3.22427 22.2702ZM2.67135 23.1035C4.51208 24.325 7.11827 23.6364 8.49243 21.5656C9.8666 19.4948 9.48837 16.8259 7.64764 15.6044C5.80691 14.3829 3.20072 15.0714 1.82656 17.1422C0.452398 19.2131 0.830625 21.882 2.67135 23.1035Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.9158 22.2702C19.6248 23.1269 17.6127 22.7183 16.4809 21.0127C15.349 19.3071 15.7543 17.2943 17.0453 16.4376C18.3363 15.5809 20.3484 15.9896 21.4803 17.6952C22.6121 19.4008 22.2068 21.4136 20.9158 22.2702ZM21.4687 23.1035C19.628 24.325 17.0218 23.6364 15.6476 21.5656C14.2735 19.4948 14.6517 16.8259 16.4924 15.6044C18.3331 14.3829 20.9393 15.0714 22.3135 17.1422C23.6877 19.2131 23.3094 21.882 21.4687 23.1035Z" fill="white"/><path d="M16.4924 15.6044L13.9037 12.4737L19.9552 0.675715C20.0693 0.446914 19.9552 0.172352 19.727 0.0808313C19.4416 -0.0106892 19.0993 0.0808312 18.9851 0.263872L12.0233 11.4212L5.17562 0.263872C5.06149 0.035071 4.71911 -0.0564496 4.43379 0.035071C4.14847 0.126592 4.03434 0.401153 4.14847 0.629955L10.2001 12.4279L7.64761 15.6044L9.2292 18L12.0233 13.4804L14.9108 18L16.4924 15.6044Z" fill="white"/></g><defs><clipPath id="cut"><rect width="24" height="24" fill="white"/></clipPath></defs></svg>');
}
&.icon-copy {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1H15V7H16V0H0V17H8V16H1V1Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M23 8H9V23H23V8ZM8 7V24H24V7H8Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13 5H3V4H13V5Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 9H3V8H8V9Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 13H3V12H8V13Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H11V11H21V12Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H11V15H21V16Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H11V19H21V20Z" fill="white"/></svg>');
}
&.icon-paste {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" fill="white"/><path d="M5 0H14V5H5V0Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" fill="white"/></svg>');
}
//comments
&.icon-menu-comment {
width: 30px;

18
apps/presentationeditor/mobile/src/less/icons-material.less
View file

@ -434,24 +434,6 @@
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 14H16C18.2091 14 20 15.7909 20 18C20 20.2091 18.2091 22 16 22H7C4.79086 22 3 20.2091 3 18C3 15.7909 4.79086 14 7 14ZM16 13C18.7614 13 21 15.2386 21 18C21 20.7614 18.7614 23 16 23H7C4.23858 23 2 20.7614 2 18C2 15.2386 4.23858 13 7 13H16Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 20C14.8954 20 14 19.1046 14 18C14 16.8954 14.8954 16 16 16C17.1046 16 18 16.8954 18 18C18 19.1046 17.1046 20 16 20ZM16 21C14.3431 21 13 19.6569 13 18C13 16.3431 14.3431 15 16 15C17.6569 15 19 16.3431 19 18C19 19.6569 17.6569 21 16 21Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M16 3H7C4.79086 3 3 4.79086 3 7C3 9.20914 4.79086 11 7 11H16C18.2091 11 20 9.20914 20 7C20 4.79086 18.2091 3 16 3ZM7 2C4.23858 2 2 4.23858 2 7C2 9.76142 4.23858 12 7 12H16C18.7614 12 21 9.76142 21 7C21 4.23858 18.7614 2 16 2H7Z" fill="@{themeColor}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M7 9C8.10457 9 9 8.10457 9 7C9 5.89543 8.10457 5 7 5C5.89543 5 5 5.89543 5 7C5 8.10457 5.89543 9 7 9ZM7 10C8.65685 10 10 8.65685 10 7C10 5.34315 8.65685 4 7 4C5.34315 4 4 5.34315 4 7C4 8.65685 5.34315 10 7 10Z" fill="@{themeColor}"/></svg>');
}
&.icon-cut {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#cut)"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.22427 22.2702C4.51527 23.1269 6.52738 22.7183 7.6592 21.0127C8.79101 19.3071 8.38572 17.2943 7.09472 16.4376C5.80372 15.5809 3.79161 15.9896 2.65979 17.6952C1.52798 19.4008 1.93328 21.4136 3.22427 22.2702ZM2.67135 23.1035C4.51208 24.325 7.11827 23.6364 8.49243 21.5656C9.8666 19.4948 9.48837 16.8259 7.64764 15.6044C5.80691 14.3829 3.20072 15.0714 1.82656 17.1422C0.452398 19.2131 0.830625 21.882 2.67135 23.1035Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.9158 22.2702C19.6248 23.1269 17.6127 22.7183 16.4809 21.0127C15.349 19.3071 15.7543 17.2943 17.0453 16.4376C18.3363 15.5809 20.3484 15.9896 21.4803 17.6952C22.6121 19.4008 22.2068 21.4136 20.9158 22.2702ZM21.4687 23.1035C19.628 24.325 17.0218 23.6364 15.6476 21.5656C14.2735 19.4948 14.6517 16.8259 16.4924 15.6044C18.3331 14.3829 20.9393 15.0714 22.3135 17.1422C23.6877 19.2131 23.3094 21.882 21.4687 23.1035Z" fill="black"/><path d="M16.4924 15.6044L13.9037 12.4737L19.9552 0.675715C20.0693 0.446914 19.9552 0.172352 19.727 0.0808313C19.4416 -0.0106892 19.0993 0.0808312 18.9851 0.263872L12.0233 11.4212L5.17562 0.263872C5.06149 0.035071 4.71911 -0.0564496 4.43379 0.035071C4.14847 0.126592 4.03434 0.401153 4.14847 0.629955L10.2001 12.4279L7.64761 15.6044L9.2292 18L12.0233 13.4804L14.9108 18L16.4924 15.6044Z" fill="black"/></g><defs><clipPath id="cut"><rect width="24" height="24" fill="black"/></clipPath></defs></svg>');
}
&.icon-copy {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1H15V7H16V0H0V17H8V16H1V1Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M23 8H9V23H23V8ZM8 7V24H24V7H8Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13 5H3V4H13V5Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 9H3V8H8V9Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 13H3V12H8V13Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H11V11H21V12Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H11V15H21V16Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H11V19H21V20Z" fill="black"/></svg>');
}
&.icon-paste {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" fill="black"/><path d="M5 0H14V5H5V0Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" fill="black"/></svg>');
}
//Comments
&.icon-menu-comment {
width: 24px;

15
apps/spreadsheeteditor/mobile/src/less/icons-ios.less
View file

@ -370,21 +370,6 @@
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M1 2H22V21H1V2ZM12 3H21V8H12V3ZM12 9H21V14H12V9ZM11 14V9H2V14H11ZM2 15V20H11V15H2ZM12 15H21V20H12V15ZM11 3V8H2V3H11Z" fill="@{themeColor}"/></svg>');
}
&.icon-cut {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#cut)"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.22427 22.2702C4.51527 23.1269 6.52738 22.7183 7.6592 21.0127C8.79101 19.3071 8.38572 17.2943 7.09472 16.4376C5.80372 15.5809 3.79161 15.9896 2.65979 17.6952C1.52798 19.4008 1.93328 21.4136 3.22427 22.2702ZM2.67135 23.1035C4.51208 24.325 7.11827 23.6364 8.49243 21.5656C9.8666 19.4948 9.48837 16.8259 7.64764 15.6044C5.80691 14.3829 3.20072 15.0714 1.82656 17.1422C0.452398 19.2131 0.830625 21.882 2.67135 23.1035Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.9158 22.2702C19.6248 23.1269 17.6127 22.7183 16.4809 21.0127C15.349 19.3071 15.7543 17.2943 17.0453 16.4376C18.3363 15.5809 20.3484 15.9896 21.4803 17.6952C22.6121 19.4008 22.2068 21.4136 20.9158 22.2702ZM21.4687 23.1035C19.628 24.325 17.0218 23.6364 15.6476 21.5656C14.2735 19.4948 14.6517 16.8259 16.4924 15.6044C18.3331 14.3829 20.9393 15.0714 22.3135 17.1422C23.6877 19.2131 23.3094 21.882 21.4687 23.1035Z" fill="white"/><path d="M16.4924 15.6044L13.9037 12.4737L19.9552 0.675715C20.0693 0.446914 19.9552 0.172352 19.727 0.0808313C19.4416 -0.0106892 19.0993 0.0808312 18.9851 0.263872L12.0233 11.4212L5.17562 0.263872C5.06149 0.035071 4.71911 -0.0564496 4.43379 0.035071C4.14847 0.126592 4.03434 0.401153 4.14847 0.629955L10.2001 12.4279L7.64761 15.6044L9.2292 18L12.0233 13.4804L14.9108 18L16.4924 15.6044Z" fill="white"/></g><defs><clipPath id="cut"><rect width="24" height="24" fill="white"/></clipPath></defs></svg>');
}
&.icon-copy {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1H15V7H16V0H0V17H8V16H1V1Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M23 8H9V23H23V8ZM8 7V24H24V7H8Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13 5H3V4H13V5Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 9H3V8H8V9Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 13H3V12H8V13Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H11V11H21V12Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H11V15H21V16Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H11V19H21V20Z" fill="white"/></svg>');
}
&.icon-paste {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" fill="white"/><path d="M5 0H14V5H5V0Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" fill="white"/></svg>');
}
//Comments
&.icon-menu-comment {
width: 30px;

15
apps/spreadsheeteditor/mobile/src/less/icons-material.less
View file

@ -334,21 +334,6 @@
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.5 7C15.5 9.26153 14.9357 10.9518 14.201 12.0307C13.4584 13.121 12.6234 13.5 12 13.5C11.3766 13.5 10.5416 13.121 9.79901 12.0307C9.0643 10.9518 8.5 9.26153 8.5 7C8.5 4.92262 10.2222 3.5 12 3.5C13.7778 3.5 15.5 4.92262 15.5 7ZM14.8461 13.6216C14.006 14.5191 13.0044 15 12 15C10.9956 15 9.99399 14.5191 9.15395 13.6216C7.69714 14.1996 6.4782 14.7725 5.52945 15.3496C3.82884 16.3839 3.5 17.1203 3.5 17.5C3.5 18.0104 3.76355 18.6977 5.04703 19.3409C6.37522 20.0065 8.60909 20.4999 12 20.5C15.3909 20.5 17.6248 20.0065 18.953 19.3409C20.2364 18.6977 20.5 18.0104 20.5 17.5C20.5 17.1203 20.1712 16.3839 18.4705 15.3496C17.5218 14.7725 16.3029 14.1996 14.8461 13.6216ZM15.7544 12.37C16.5137 11.0279 17 9.20917 17 7C17 4 14.5088 2 12 2C9.49121 2 7 4 7 7C7 9.20917 7.48633 11.0279 8.24563 12.37C4.38973 13.9392 2 15.579 2 17.5C2 19.9852 5 21.9999 12 22C19 22 22 19.9852 22 17.5C22 15.579 19.6103 13.9392 15.7544 12.37Z" fill="@{themeColor}"/></svg>');
}
&.icon-cut {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#cut)"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.22427 22.2702C4.51527 23.1269 6.52738 22.7183 7.6592 21.0127C8.79101 19.3071 8.38572 17.2943 7.09472 16.4376C5.80372 15.5809 3.79161 15.9896 2.65979 17.6952C1.52798 19.4008 1.93328 21.4136 3.22427 22.2702ZM2.67135 23.1035C4.51208 24.325 7.11827 23.6364 8.49243 21.5656C9.8666 19.4948 9.48837 16.8259 7.64764 15.6044C5.80691 14.3829 3.20072 15.0714 1.82656 17.1422C0.452398 19.2131 0.830625 21.882 2.67135 23.1035Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M20.9158 22.2702C19.6248 23.1269 17.6127 22.7183 16.4809 21.0127C15.349 19.3071 15.7543 17.2943 17.0453 16.4376C18.3363 15.5809 20.3484 15.9896 21.4803 17.6952C22.6121 19.4008 22.2068 21.4136 20.9158 22.2702ZM21.4687 23.1035C19.628 24.325 17.0218 23.6364 15.6476 21.5656C14.2735 19.4948 14.6517 16.8259 16.4924 15.6044C18.3331 14.3829 20.9393 15.0714 22.3135 17.1422C23.6877 19.2131 23.3094 21.882 21.4687 23.1035Z" fill="black"/><path d="M16.4924 15.6044L13.9037 12.4737L19.9552 0.675715C20.0693 0.446914 19.9552 0.172352 19.727 0.0808313C19.4416 -0.0106892 19.0993 0.0808312 18.9851 0.263872L12.0233 11.4212L5.17562 0.263872C5.06149 0.035071 4.71911 -0.0564496 4.43379 0.035071C4.14847 0.126592 4.03434 0.401153 4.14847 0.629955L10.2001 12.4279L7.64761 15.6044L9.2292 18L12.0233 13.4804L14.9108 18L16.4924 15.6044Z" fill="black"/></g><defs><clipPath id="cut"><rect width="24" height="24" fill="black"/></clipPath></defs></svg>');
}
&.icon-copy {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1H15V7H16V0H0V17H8V16H1V1Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M23 8H9V23H23V8ZM8 7V24H24V7H8Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13 5H3V4H13V5Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 9H3V8H8V9Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M8 13H3V12H8V13Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H11V11H21V12Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H11V15H21V16Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H11V19H21V20Z" fill="black"/></svg>');
}
&.icon-paste {
width: 24px;
height: 24px;
.encoded-svg-background('<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5 2H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10 8H23V23H10V8Z" fill="black"/><path d="M5 0H14V5H5V0Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 12H12V11H21V12Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 16H12V15H21V16Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21 20H12V19H21V20Z" fill="black"/></svg>');
}
//Comments
&.icon-menu-comment {
width: 24px;