add margin

src/frontend/styles/components/writing.pcss

@@ -16,5 +16,9 @@
   &__left {
     margin: auto 0;
     color: var(--color-text-second);
+
+    & span {
+      margin-right: 10px;
+    }
   }
 }

src/routes/middlewares/pages.js

@@ -1,17 +1,30 @@
 const Pages = require('../../controllers/pages');
-const pagesOrder = require('../../controllers/pagesOrder');
+const PagesOrder = require('../../controllers/pagesOrder');
 const asyncMiddleware = require('../../utils/asyncMiddleware');
 
+const RootPage = '0';
 /**
  * Process one-level pages list to parent-children list
  * @param {Page[]} pages - list of all available pages
  * @return {Page[]}
  */
 async function createMenuTree(pages) {
-  return Promise.all(pages.filter(page => page._parent === '0').map(async page => {
+
+  const children = await PagesOrder.get(RootPage);
+  const firstLevelPages = [];
+
+  children.order.forEach(pageId => {
+    pages.forEach(page => {
+      if (page._id === pageId) {
+        firstLevelPages.push(page);
+      }
+    });
+  });
+
+  return Promise.all(firstLevelPages.map(async page => {
     const childrenOrdered = [];
     try {
-      const children = await pagesOrder.get(page._id);
+      const children = await PagesOrder.get(page._id);
       children.order.forEach(pageId => {
         pages.forEach(_page => {
           if (_page._id === pageId) {

src/views/pages/form.twig

@@ -14,29 +14,33 @@
     </module-settings>
     <header class="writing-header">
       <span class="writing-header__left">
+        <span>
         New Page at the
         {% set currentPageId = 0 %}
         {% if page is not empty %}
           {% set currentPageId = page._id %}
         {% endif %}
-        <select name="parent">
+          <select name="parent">
           <option value="0">Root</option>
-          {% for _page in pagesAvailable %}
-            {% if _page._id != currentPageId %}
-              <option value="{{ _page._id }}" {{ page is not empty and page._parent == _page._id ? 'selected' : ''}}>
+            {% for _page in pagesAvailable %}
+              {% if _page._id != currentPageId %}
+                <option value="{{ _page._id }}" {{ page is not empty and page._parent == _page._id ? 'selected' : ''}}>
                 {{ _page.title }}
               </option>
-            {% endif %}
-          {% endfor %}
+              {% endif %}
+            {% endfor %}
         </select>
+        </span>
 
         {% if parentsChildrenOrdered is not empty %}
-          Put Above
-          <select name="above">
-            {% for _page in parentsChildrenOrdered %}
-              <option value="{{ _page._id }}">{{ _page.title }}</option>
-            {% endfor %}
-          </select>
+          <span>
+            Put Above
+            <select name="above">
+              {% for _page in parentsChildrenOrdered %}
+                <option value="{{ _page._id }}">{{ _page.title }}</option>
+              {% endfor %}
+            </select>
+          </span>
         {% endif %}
       </span>
       <span class="writing-header__save" name="js-submit">