Final tweaks hopefully, added back button to every page

.eslintrc

@@ -22,7 +22,7 @@
     "require-await": 0,
     "array-callback-return": 2,
     "block-scoped-var": 2,
-    "complexity": ["error", 30],
+    "complexity": ["error", 40],
     "eqeqeq": [2, "smart"],
     "no-else-return": ["error", { "allowElseIf": false }],
     "no-extra-bind": 2,

api/serve.mjs

@@ -37,7 +37,7 @@ export function serve(docRoot, pathname, options = {}) {
     if (filepath.indexOf('admin') >= 0
         && (filepath.indexOf('js') >= 0
             || filepath.indexOf('css') >= 0)) {
-      if (filepath.indexOf('.map') === -1) {
+      if (filepath.indexOf('.map') === -1 && filepath.indexOf('.scss') === -1) {
         await restrictAdmin(ctx)
         ctx.set('Cache-Control', 'no-store, no-cache, must-revalidate')
       } else if (config.get('NODE_ENV') !== 'development') {

api/serveindex.mjs

@@ -70,6 +70,11 @@ function mapPage(x) {
       medium_url: x.media.medium_url,
       small_url: x.media.small_url,
     }) || null,
+    parent: x.parent && ({
+      id: x.parent.id,
+      name: x.parent.name,
+      path: x.parent.path,
+    }),
     banner: x.banner && ({
       large_url: x.banner.large_url,
       medium_url: x.banner.medium_url,
@@ -130,7 +135,7 @@ export async function serveIndex(ctx, path) {
           }
           data = found
         } else {
-          found = await Page.getSingle(id, ['media', 'banner', 'children'])
+          found = await Page.getSingle(id, ['media', 'banner', 'children', 'parent'])
           found = mapPage(found.toJSON())
           data = found
         }

app/api/page.p.js

@@ -14,6 +14,6 @@ exports.getTree = function() {
 exports.getPage = function(id) {
   return common.sendRequest({
     method: 'GET',
-    url: '/api/pages/' + id + '?includes=media,banner,children',
+    url: '/api/pages/' + id + '?includes=media,banner,children,parent',
   })
 }

app/article/article.scss

@@ -78,7 +78,7 @@ article.article {
     width: calc(100% - 40px);
     max-width: 800px;
     align-self: center;
-    padding: 10px 5px 0;
+    padding: 30px 5px 0;
     margin-bottom: -10px;
 
     a {

app/frontpage/frontpage.scss

@@ -64,6 +64,8 @@ frontpage {
 
         a {
           display: inline-block;
+          padding: 0;
+          max-width: 206px;
         }
       }
     }
@@ -101,6 +103,10 @@ frontpage {
   frontpage aside.sidebar {
     width: 200px;
     flex: 0 0 200px;
+
+    ul li a {
+      max-width: 156px;
+    }
   }
 }
 
@@ -116,6 +122,10 @@ frontpage {
     margin: 20px 0 30px;
     border-bottom: 1px solid $border;
     order: 2;
+
+    ul li a {
+      max-width: unset;
+    }
   }
 }
 

app/pages/page.js

@@ -112,6 +112,9 @@ const Page = {
         m('div.loading-spinner')
       : m('article.page', [
           bannerPath ? m('.div.page-banner', { style: { 'background-image': 'url("' + bannerPath + '")' } } ) : null,
+          this.page.parent
+            ? m('div.goback', ['« ', m(m.route.Link, { href: '/page/' + this.page.parent.path }, this.page.parent.name)])
+            : m('div.goback', ['« ', m(m.route.Link, { href: '/' }, 'Home')]),
           m('header', m('h1', this.page.name)),
           m('.container', {
               class: this.page.children.length ? 'multi' : '',

app/pages/page.scss

@@ -27,7 +27,7 @@ article.page {
   }
 
   .page-cover {
-    margin: 0 -10px 20px;
+    margin: 0 0 20px;
 
     &.single {
       margin: 0 20px 20px;
@@ -38,6 +38,20 @@ article.page {
     }
   }
 
+  .goback {
+    width: 100%;
+    max-width: 1050px;
+    align-self: center;
+    padding: 10px 5px 0;
+    margin-bottom: -10px;
+
+    a {
+      font-weight: bold;
+      text-decoration: none;
+      color: $secondary-dark-bg;
+    }
+  }
+
   .admin-actions {
     margin-bottom: 20px;
   }
@@ -71,18 +85,18 @@ article.page {
     align-items: center;
     height: auto;
     padding: 20px 0;
+    width: 100%;
+    max-width: 1050px;
+    align-self: center;
 
     background: $newsitem-bg;
     border-right: $newsitem-border;
     border-left: $newsitem-border;
 
     &.multi {
-      align-self: center;
       align-items: flex-start;
       flex-direction: row;
       flex-grow: 2;
-      width: 100%;
-      max-width: 1050px;
     }
   }
 
@@ -114,6 +128,10 @@ article.page {
     max-width: 800px;
     flex: 2 0 0;
 
+    .page-cover {
+      margin: 0 -10px 20px;
+    }
+
     main {
       padding: 0 5px;
     }
@@ -138,7 +156,7 @@ aside.news {
   }
 
   &.single {
-    max-width: 800px;
+    // max-width: 800px;
     flex: 2 0 0;
     padding: 0 20px 10px;
     border-top: none;
@@ -235,4 +253,8 @@ aside.news {
       border-bottom: 1px solid $dark_border;
     }
   }
+
+  .goback a {
+    color: $dark_secondary-dark-bg;
+  }
 }