diff --git a/apps/common/mobile/resources/less/common-material.less b/apps/common/mobile/resources/less/common-material.less
index 65c4f182d..b762db944 100644
--- a/apps/common/mobile/resources/less/common-material.less
+++ b/apps/common/mobile/resources/less/common-material.less
@@ -35,6 +35,12 @@
--f7-touch-ripple-color: transparent;
}
+ .segmented {
+ .button {
+ --f7-touch-ripple-color: var(--f7-list-link-pressed-bg-color);
+ }
+ }
+
--f7-input-focused-border-color: @themeColor;
--f7-label-focused-text-color: @themeColor;
diff --git a/apps/documenteditor/mobile/src/view/Toolbar.jsx b/apps/documenteditor/mobile/src/view/Toolbar.jsx
index 6a801fdd1..513b5418c 100644
--- a/apps/documenteditor/mobile/src/view/Toolbar.jsx
+++ b/apps/documenteditor/mobile/src/view/Toolbar.jsx
@@ -35,7 +35,7 @@ const ToolbarView = props => {
})}
{ Device.phone ? null : }
{props.displayCollaboration && window.matchMedia("(min-width: 360px)").matches ? props.openOptions('coauth')}> : null}
- props.openOptions('settings')}>
+ props.openOptions('settings')}>
)
diff --git a/apps/documenteditor/mobile/src/view/edit/EditParagraph.jsx b/apps/documenteditor/mobile/src/view/edit/EditParagraph.jsx
index 0f1118b02..9331f1c00 100644
--- a/apps/documenteditor/mobile/src/view/edit/EditParagraph.jsx
+++ b/apps/documenteditor/mobile/src/view/edit/EditParagraph.jsx
@@ -196,7 +196,8 @@ const EditParagraph = props => {
const paragraph = props.storeFocusObjects.paragraphObject;
const curBackColor = storeParagraphSettings.backColor ? storeParagraphSettings.backColor : storeParagraphSettings.getBackgroundColor(paragraph);
const background = curBackColor !== 'transparent' ? `#${(typeof curBackColor === "object" ? curBackColor.color : curBackColor)}` : curBackColor;
-
+ const activeStyle = Device.android ? 'link no-active-state' : 'no-active-state';
+
return (
@@ -222,7 +223,7 @@ const EditParagraph = props => {
}}>
{_t.textParagraphStyles}
-
+
{paragraphStyles.map((style, index) => (
{
const spriteThumbs = storeTextSettings.spriteThumbs;
const arrayRecentFonts = storeTextSettings.arrayRecentFonts;
+ useEffect(() => {
+ setRecent(getImageUri(arrayRecentFonts));
+
+ return () => {
+ }
+ }, []);
+
const addRecentStorage = () => {
let arr = [];
arrayRecentFonts.forEach(item => arr.push(item));
+ setRecent(getImageUri(arrayRecentFonts));
LocalStorage.setItem('dde-settings-recent-fonts', JSON.stringify(arr));
}
-
+
+ const [stateRecent, setRecent] = useState([]);
const [vlFonts, setVlFonts] = useState({
vlData: {
items: [],
}
});
+ const getImageUri = fonts => {
+ return fonts.map(font => {
+ thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
+ thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
+
+ return thumbCanvas.toDataURL();
+ });
+ };
+
const renderExternal = (vl, vlData) => {
setVlFonts((prevState) => {
let fonts = [...prevState.vlData.items];
fonts.splice(vlData.fromIndex, vlData.toIndex, ...vlData.items);
+
+ let images = getImageUri(fonts);
+
return {vlData: {
items: fonts,
+ images,
}}
});
};
- const getImageUri = (font) => {
- thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
- thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
-
- return thumbCanvas.toDataURL();
- }
-
return (
@@ -88,7 +103,7 @@ const PageFonts = props => {
storeTextSettings.changeFontFamily(item.name);
props.changeFontFamily(item.name);
}}>
-
+
))}
@@ -105,7 +120,7 @@ const PageFonts = props => {
storeTextSettings.addFontToRecent(item);
addRecentStorage();
}}>
-
+
))}
diff --git a/apps/presentationeditor/mobile/src/view/Toolbar.jsx b/apps/presentationeditor/mobile/src/view/Toolbar.jsx
index d5cc8e502..cd479b3a3 100644
--- a/apps/presentationeditor/mobile/src/view/Toolbar.jsx
+++ b/apps/presentationeditor/mobile/src/view/Toolbar.jsx
@@ -36,7 +36,7 @@ const ToolbarView = props => {
})}
{ Device.phone ? null : }
{props.displayCollaboration && window.matchMedia("(min-width: 375px)").matches ? props.openOptions('coauth')}> : null}
- props.openOptions('settings')}>
+ props.openOptions('settings')}>
)
diff --git a/apps/presentationeditor/mobile/src/view/edit/EditText.jsx b/apps/presentationeditor/mobile/src/view/edit/EditText.jsx
index d6c4084d9..8aff80308 100644
--- a/apps/presentationeditor/mobile/src/view/edit/EditText.jsx
+++ b/apps/presentationeditor/mobile/src/view/edit/EditText.jsx
@@ -1,4 +1,4 @@
-import React, {Fragment, useState} from 'react';
+import React, {Fragment, useState, useEffect} from 'react';
import {observer, inject} from "mobx-react";
import {f7, Swiper, View, SwiperSlide, List, ListItem, Icon, Row, Button, Page, Navbar, Segmented, BlockTitle, NavRight, Link} from 'framework7-react';
import { useTranslation } from 'react-i18next';
@@ -196,35 +196,50 @@ const PageFonts = props => {
const spriteThumbs = storeTextSettings.spriteThumbs;
const arrayRecentFonts = storeTextSettings.arrayRecentFonts;
+ useEffect(() => {
+ setRecent(getImageUri(arrayRecentFonts));
+
+ return () => {
+ }
+ }, []);
+
const addRecentStorage = () => {
let arr = [];
arrayRecentFonts.forEach(item => arr.push(item));
+ setRecent(getImageUri(arrayRecentFonts));
LocalStorage.setItem('ppe-settings-recent-fonts', JSON.stringify(arr));
}
+ const [stateRecent, setRecent] = useState([]);
const [vlFonts, setVlFonts] = useState({
vlData: {
items: [],
}
});
+ const getImageUri = fonts => {
+ return fonts.map(font => {
+ thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
+ thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
+
+ return thumbCanvas.toDataURL();
+ });
+ };
+
const renderExternal = (vl, vlData) => {
setVlFonts((prevState) => {
let fonts = [...prevState.vlData.items];
fonts.splice(vlData.fromIndex, vlData.toIndex, ...vlData.items);
+
+ let images = getImageUri(fonts);
+
return {vlData: {
items: fonts,
+ images,
}};
});
};
- const getImageUri = (font) => {
- thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
- thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
-
- return thumbCanvas.toDataURL();
- }
-
const paragraph = props.storeFocusObjects.paragraphObject;
if (!paragraph && Device.phone) {
$$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
@@ -265,7 +280,7 @@ const PageFonts = props => {
{
props.changeFontFamily(item.name);
}}>
-
+
))}
@@ -281,7 +296,7 @@ const PageFonts = props => {
storeTextSettings.addFontToRecent(item);
addRecentStorage();
}}>
-
+
))}
diff --git a/apps/spreadsheeteditor/mobile/src/view/Toolbar.jsx b/apps/spreadsheeteditor/mobile/src/view/Toolbar.jsx
index 3ffaa264b..2c7b38da4 100644
--- a/apps/spreadsheeteditor/mobile/src/view/Toolbar.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/Toolbar.jsx
@@ -30,7 +30,7 @@ const ToolbarView = props => {
})}
{ Device.phone ? null : }
{props.displayCollaboration && window.matchMedia("(min-width: 360px)").matches ? props.openOptions('coauth')}> : null}
- props.openOptions('settings')}>
+ props.openOptions('settings')}>
)
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx
index 377b8f88b..d271bb892 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx
@@ -1,4 +1,4 @@
-import React, {Fragment, useState} from 'react';
+import React, {Fragment, useState, useEffect} from 'react';
import {observer, inject} from "mobx-react";
import {f7, List, ListItem, Icon, Row, Button, Page, Navbar, Segmented, BlockTitle, NavRight, Link, Toggle} from 'framework7-react';
import { useTranslation } from 'react-i18next';
@@ -138,35 +138,50 @@ const PageFontsCell = props => {
const spriteCols = storeTextSettings.spriteCols;
const spriteThumbs = storeTextSettings.spriteThumbs;
+ useEffect(() => {
+ setRecent(getImageUri(arrayRecentFonts));
+
+ return () => {
+ }
+ }, []);
+
const addRecentStorage = () => {
let arr = [];
arrayRecentFonts.forEach(item => arr.push(item));
+ setRecent(getImageUri(arrayRecentFonts));
LocalStorage.setItem('sse-settings-recent-fonts', JSON.stringify(arr));
}
+ const [stateRecent, setRecent] = useState([]);
const [vlFonts, setVlFonts] = useState({
vlData: {
items: [],
}
});
+ const getImageUri = fonts => {
+ return fonts.map(font => {
+ thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
+ thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
+
+ return thumbCanvas.toDataURL();
+ });
+ };
+
const renderExternal = (vl, vlData) => {
setVlFonts((prevState) => {
let fonts = [...prevState.vlData.items];
fonts.splice(vlData.fromIndex, vlData.toIndex, ...vlData.items);
+
+ let images = getImageUri(fonts);
+
return {vlData: {
items: fonts,
+ images,
}};
});
};
- const getImageUri = (font) => {
- thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
- thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
-
- return thumbCanvas.toDataURL();
- }
-
const storeFocusObjects = props.storeFocusObjects;
if ((storeFocusObjects.focusOn !== 'cell') && Device.phone) {
$$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
@@ -205,7 +220,7 @@ const PageFontsCell = props => {
{
props.onFontClick(item.name);
}}>
-
+
))}
@@ -221,7 +236,7 @@ const PageFontsCell = props => {
storeTextSettings.addFontToRecent(item);
addRecentStorage();
}}>
-
+
))}
diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx
index 7d043fb58..a44c736ab 100644
--- a/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx
+++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditText.jsx
@@ -1,4 +1,4 @@
-import React, {Fragment, useState} from 'react';
+import React, {Fragment, useState, useEffect} from 'react';
import {observer, inject} from "mobx-react";
import {f7, List, ListItem, Icon, Row, Button, Page, Navbar, NavRight, Segmented, BlockTitle, Link} from 'framework7-react';
import { useTranslation } from 'react-i18next';
@@ -109,35 +109,50 @@ const PageFonts = props => {
const spriteThumbs = storeTextSettings.spriteThumbs;
const arrayRecentFonts = storeTextSettings.arrayRecentFonts;
+ useEffect(() => {
+ setRecent(getImageUri(arrayRecentFonts));
+
+ return () => {
+ }
+ }, []);
+
const addRecentStorage = () => {
let arr = [];
arrayRecentFonts.forEach(item => arr.push(item));
+ setRecent(getImageUri(arrayRecentFonts));
LocalStorage.setItem('sse-settings-recent-fonts', JSON.stringify(arr));
}
+ const [stateRecent, setRecent] = useState([]);
const [vlFonts, setVlFonts] = useState({
vlData: {
items: [],
}
});
+ const getImageUri = fonts => {
+ return fonts.map(font => {
+ thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
+ thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
+
+ return thumbCanvas.toDataURL();
+ });
+ };
+
const renderExternal = (vl, vlData) => {
setVlFonts((prevState) => {
let fonts = [...prevState.vlData.items];
fonts.splice(vlData.fromIndex, vlData.toIndex, ...vlData.items);
+
+ let images = getImageUri(fonts);
+
return {vlData: {
items: fonts,
+ images,
}};
});
};
- const getImageUri = (font) => {
- thumbContext.clearRect(0, 0, thumbs[thumbIdx].width, thumbs[thumbIdx].height);
- thumbContext.drawImage(spriteThumbs, 0, -thumbs[thumbIdx].height * Math.floor(font.imgidx / spriteCols));
-
- return thumbCanvas.toDataURL();
- }
-
return (
@@ -170,7 +185,7 @@ const PageFonts = props => {
{
props.changeFontFamily(item.name);
}}>
-
+
))}
@@ -186,7 +201,7 @@ const PageFonts = props => {
storeTextSettings.addFontToRecent(item);
addRecentStorage();
}}>
-
+
))}