diff --git a/src/public/javascripts/services/mobile.js b/src/public/javascripts/services/mobile.js
new file mode 100644
index 000000000..daec6ceec
--- /dev/null
+++ b/src/public/javascripts/services/mobile.js
@@ -0,0 +1,3 @@
+import treeService from "./tree.js";
+
+treeService.showTree();
\ No newline at end of file
diff --git a/src/public/stylesheets/mobile.css b/src/public/stylesheets/mobile.css
new file mode 100644
index 000000000..d53e59430
--- /dev/null
+++ b/src/public/stylesheets/mobile.css
@@ -0,0 +1,49 @@
+html, body {
+ height:100vh;
+ width:100vw;
+ margin: 0;
+ padding: 0;
+}
+
+#tree {
+ font-size: larger;
+ width: 100vw;
+ height: 100vh;
+ overflow: auto;
+}
+
+.fancytree-custom-icon {
+ font-size: 2em;
+}
+
+.fancytree-title {
+ font-size: 1.5em;
+ margin-left: 0.6em !important;
+}
+
+.fancytree-node {
+ padding: 5px;
+}
+
+.fancytree-node .fancytree-expander {
+ background: none;
+ width: auto;
+ height: auto;
+}
+
+.fancytree-node .fancytree-expander:before {
+ font-family: 'jam-icons' !important;
+ speak:none;font-style:normal;
+ font-weight:normal;
+ font-variant:normal;
+ text-transform:none;
+ line-height:1;
+ font-size: 2em;
+ padding-left: 5px;
+ padding-right: 5px;
+ content: "\e9bc";
+}
+
+.fancytree-node.fancytree-expanded .fancytree-expander:before {
+ content: "\e9ba";
+}
\ No newline at end of file
diff --git a/src/routes/mobile.js b/src/routes/mobile.js
new file mode 100644
index 000000000..078572bf8
--- /dev/null
+++ b/src/routes/mobile.js
@@ -0,0 +1,37 @@
+"use strict";
+
+const sourceIdService = require('../services/source_id');
+const sql = require('../services/sql');
+const attributeService = require('../services/attributes');
+const config = require('../services/config');
+const optionService = require('../services/options');
+
+async function index(req, res) {
+ const options = await optionService.getOptionsMap();
+
+ res.render('mobile', {
+ theme: options.theme,
+ sourceId: await sourceIdService.generateSourceId(),
+ maxSyncIdAtLoad: await sql.getValue("SELECT MAX(id) FROM sync"),
+ instanceName: config.General ? config.General.instanceName : null,
+ appCss: await getAppCss()
+ });
+}
+
+async function getAppCss() {
+ let css = '';
+ const notes = attributeService.getNotesWithLabel('appCss');
+
+ for (const note of await notes) {
+ css += `/* ${note.noteId} */
+${note.content}
+
+`;
+ }
+
+ return css;
+}
+
+module.exports = {
+ index
+};
diff --git a/src/routes/routes.js b/src/routes/routes.js
index 0bed2b54a..ad4eb4a55 100644
--- a/src/routes/routes.js
+++ b/src/routes/routes.js
@@ -1,6 +1,7 @@
-const indexRoute = require('./index');
-const loginRoute = require('./login');
const setupRoute = require('./setup');
+const loginRoute = require('./login');
+const indexRoute = require('./index');
+const mobileRoute = require('./mobile');
const multer = require('multer')();
// API routes
@@ -96,6 +97,8 @@ const uploadMiddleware = multer.single('upload');
function register(app) {
route(GET, '/', [auth.checkAuth], indexRoute.index);
+ route(GET, '/mobile', [auth.checkAuth], mobileRoute.index);
+
route(GET, '/login', [auth.checkAppInitialized], loginRoute.loginPage);
route(POST, '/login', [], loginRoute.login);
route(POST, '/logout', [auth.checkAuth], loginRoute.logout);
diff --git a/src/views/login.ejs b/src/views/login.ejs
index 9378b3dea..354e0d17d 100644
--- a/src/views/login.ejs
+++ b/src/views/login.ejs
@@ -45,6 +45,6 @@
-
+