diff --git a/apps/documenteditor/mobile/src/components/edit/Edit.jsx b/apps/documenteditor/mobile/src/components/edit/Edit.jsx
new file mode 100644
index 000000000..2e5afbfe2
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/edit/Edit.jsx
@@ -0,0 +1,57 @@
+import React, {Component} from 'react';
+import {
+ Page,
+ Navbar,
+ NavRight,
+ NavLeft,
+ Link,
+ Popup,
+ Tabs,
+ Tab
+} from 'framework7-react';
+import EditText from "./EditText";
+import EditParagraph from "./EditParagraph";
+
+export default class EditContainer extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ popupOpened: false,
+ };
+ }
+ render() {
+ const editors = ['text', 'paragraph'];//, 'table', 'header', 'shape', 'image', 'chart', 'hyperlink'];
+ const tabLinks = editors.map((item, index) =>
+ {item}
+ );
+ const tabs = editors.map((item, index) =>
+
+ {item === 'text' && }
+ {item === 'paragraph' && }
+ {/*{item === 'table' && }
+ {item === 'header' && }
+ {item === 'shape' && }
+ {item === 'image' && }
+ {item === 'chart' && }
+ {item === 'hyperlink' && }*/}
+
+ );
+ return (
+ this.setState({popupOpened : false})}>
+
+
+
+ {tabLinks}
+
+
+ Close
+
+
+
+ {tabs}
+
+
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/components/edit/EditParagraph.jsx b/apps/documenteditor/mobile/src/components/edit/EditParagraph.jsx
new file mode 100644
index 000000000..dcc166b12
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/edit/EditParagraph.jsx
@@ -0,0 +1,33 @@
+import React, {Component, Fragment} from 'react';
+import {
+ List,
+ ListItem,
+ BlockTitle
+} from 'framework7-react';
+
+export default class EditText extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ const textBackground = "Background";
+ const textAdvancedSettings = "Advanced settings";
+ const textParagraphStyles = "Paragraph styles";
+
+ return (
+
+
+
+
+
+
+
+
+
+ {textParagraphStyles}
+
+
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/components/edit/EditText.jsx b/apps/documenteditor/mobile/src/components/edit/EditText.jsx
new file mode 100644
index 000000000..91691a9d7
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/edit/EditText.jsx
@@ -0,0 +1,96 @@
+import React, {Component, Fragment} from 'react';
+import {
+ List,
+ ListItem,
+ Icon,
+ Row,
+ Col,
+ Button
+} from 'framework7-react';
+
+export default class EditText extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ const textFontColor = "Font Color";
+ const textHighlightColor = "Highlight Color";
+ const textAdditionalFormatting = "Additional Formatting";
+ const textBullets = "Bullets";
+ const textNumbers = "Numbers";
+ const textLineSpacing = "Line Spacing";
+
+ const fontName = 'Arial';
+ const fontSize = '11pt';
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/components/settings/Settings.jsx b/apps/documenteditor/mobile/src/components/settings/Settings.jsx
new file mode 100644
index 000000000..c1dc812e0
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/settings/Settings.jsx
@@ -0,0 +1,73 @@
+import React, {Component} from 'react';
+import {
+ View,
+ Page,
+ Navbar,
+ NavRight,
+ Link,
+ Popup,
+ Icon,
+ ListItem,
+ List
+} from 'framework7-react';
+
+export default class Settings extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ popupOpened: false,
+ };
+ }
+ render() {
+ const textSettings = "Settings";
+ const textDone = "Done";
+ const textFindAndReplace = "Find and Replace";
+ const textDocumentSettings = "Document Settings";
+ const textApplicationSettings = "Application Settings";
+ const textDownload = "Download";
+ const textPrint = "Print";
+ const textDocumentInfo = "Document Info";
+ const textHelp = "Help";
+ const textAbout = "About";
+
+ return (
+ this.setState({popupOpened : false})}>
+
+
+
+
+ {textDone}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/components/settings/document-settings/DocumentFormats.jsx b/apps/documenteditor/mobile/src/components/settings/document-settings/DocumentFormats.jsx
new file mode 100644
index 000000000..bfab9c16d
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/settings/document-settings/DocumentFormats.jsx
@@ -0,0 +1,22 @@
+import React, {Component} from 'react';
+import {
+ Page,
+ Navbar
+} from 'framework7-react';
+
+export default class DocumentFormats extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ const textDocumentFormats = "Document Formats";
+ const textBack = "Back";
+
+ return (
+
+
+ {textDocumentFormats}
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/components/settings/document-settings/DocumentSettings.jsx b/apps/documenteditor/mobile/src/components/settings/document-settings/DocumentSettings.jsx
new file mode 100644
index 000000000..8c86ccc35
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/settings/document-settings/DocumentSettings.jsx
@@ -0,0 +1,42 @@
+import React, {Component} from 'react';
+import {
+ Page,
+ Navbar,
+ List,
+ ListItem,
+ BlockTitle
+} from 'framework7-react';
+
+export default class DocumentSettings extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ const textDocumentSettings = "Document Settings";
+ const textBack = "Back";
+ const textOrientation = "Orientation";
+ const textPortrait = "Portrait";
+ const textLandscape = "Landscape";
+ const textFormat = "Format";
+ const textMargins = "Margins";
+
+ const format = "A4";
+ const formatSize = "21 cm x 29.7 cm";
+
+ return (
+
+
+ {textOrientation}
+
+
+
+
+ {textFormat}
+
+
+
+
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/components/settings/document-settings/Margins.jsx b/apps/documenteditor/mobile/src/components/settings/document-settings/Margins.jsx
new file mode 100644
index 000000000..3b585ab50
--- /dev/null
+++ b/apps/documenteditor/mobile/src/components/settings/document-settings/Margins.jsx
@@ -0,0 +1,22 @@
+import React, {Component} from 'react';
+import {
+ Page,
+ Navbar
+} from 'framework7-react';
+
+export default class Margins extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ const textMargins = "Margins";
+ const textBack = "Back";
+
+ return (
+
+
+ {textMargins}
+
+ )
+ }
+};
\ No newline at end of file
diff --git a/apps/documenteditor/mobile/src/js/routes.js b/apps/documenteditor/mobile/src/js/routes.js
index 5e1281f4e..5725f5d4a 100644
--- a/apps/documenteditor/mobile/src/js/routes.js
+++ b/apps/documenteditor/mobile/src/js/routes.js
@@ -1,5 +1,8 @@
import HomePage from '../pages/home.jsx';
+import DocumentSettings from "../components/settings/document-settings/DocumentSettings.jsx";
+import Margins from "../components/settings/document-settings/Margins.jsx";
+import DocumentFormats from "../components/settings/document-settings/DocumentFormats.jsx";
import LeftPage1 from '../pages/left-page-1.jsx';
import LeftPage2 from '../pages/left-page-2.jsx';
@@ -11,6 +14,18 @@ var routes = [
path: '/',
component: HomePage,
},
+ {
+ path: '/document-settings/',
+ component: DocumentSettings,
+ },
+ {
+ path: '/margins/',
+ component: Margins,
+ },
+ {
+ path: '/document-formats/',
+ component: DocumentFormats,
+ },
{
path: '/left-page-1/',
component: LeftPage1,
diff --git a/apps/documenteditor/mobile/src/pages/home.jsx b/apps/documenteditor/mobile/src/pages/home.jsx
index cf9eb85a5..07bdf0513 100644
--- a/apps/documenteditor/mobile/src/pages/home.jsx
+++ b/apps/documenteditor/mobile/src/pages/home.jsx
@@ -1,7 +1,7 @@
-import React from 'react';
+import React, { Component } from 'react';
import {
Page,
- View,
+ View,
Navbar,
NavLeft,
NavTitle,
@@ -15,24 +15,39 @@ import {
ListItem,
Row,
Col,
- Button
+ Button,
+ Icon, Popup
} from 'framework7-react';
-export default () => (
-
- {/* Top Navbar */}
-
-
-
-
- Desktop Editor
-
-
-
- Desktop Editor
-
- {/* Page content */}
-
-
-
-);
\ No newline at end of file
+import EditPopup from '../components/edit/Edit.jsx';
+import SettingsPopup from '../components/settings/Settings.jsx';
+
+export default class Home extends Component {
+ constructor(props) {
+ super(props);
+ }
+ render() {
+ console.log(this.$f7router)
+ return (
+
+ {/* Top Navbar */}
+
+
+
+ Undo
+ Redu
+
+
+ Edit
+ Settings
+
+
+ {/* Page content */}
+
+
+
+
+
+ )
+ }
+};
\ No newline at end of file