From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Mon, 11 Oct 2021 13:46:01 +0000 (+0200)
Subject: wait #4774 @0.25
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=aa122b35ddcbbd428adb512095c66ca262f85a3d;p=fluidbook-html5.git

wait #4774 @0.25
---

diff --git a/js/libs/fluidbook/menu/fluidbook.chapters.js b/js/libs/fluidbook/menu/fluidbook.chapters.js
index c4af374c..9dabd479 100644
--- a/js/libs/fluidbook/menu/fluidbook.chapters.js
+++ b/js/libs/fluidbook/menu/fluidbook.chapters.js
@@ -3,6 +3,7 @@ function FluidbookChapters(fluidbook, chapters) {
     this.chapters = chapters;
     this.style = 'classic';
     this.cascade = this.fluidbook.settings.chaptersCascade;
+    this.indent = !this.cascade && this.fluidbook.settings.chaptersIndent;
     this.cascadeEventsInited = false;
     if (this.fluidbook.settings.mobileChaptersStyle) {
         this.style = this.fluidbook.settings.mobileChaptersStyle;
@@ -85,7 +86,7 @@ FluidbookChapters.prototype = {
 
         // Columns setup
         var nbItems = 0;
-        var columns = Math.max(1,parseInt(this.fluidbook.settings.chaptersColumns));
+        var columns = Math.max(1, parseInt(this.fluidbook.settings.chaptersColumns));
         $.each(this.chapters, function (k, v) {
             if (v.label === '--' || v.label === '++') {
 
@@ -136,9 +137,13 @@ FluidbookChapters.prototype = {
         }
 
         var $this = this;
-        this.html[sub] = '<ul class="chapters">';
 
+        var classes = ['chapters'];
+        if (this.indent) {
+            classes.push('indent');
+        }
 
+        this.html[sub] = '<ul class="' + classes.join(' ') + '">';
         $.each(base, function (k, v) {
             if (!forgetCut) {
                 forgetCut = v.label.indexOf('++') === 0;
@@ -219,9 +224,9 @@ FluidbookChapters.prototype = {
             href = this.cascade ? 'href="#"' : "nohref";
         }
         if (this.style == 'classic') {
-            res += '<li data-level="' + level + '" data-page="' + p + '"><a ' + href + ' class="level clickonly ' + level + '">';
+            res += '<li data-level="' + level + '" data-page="' + p + '"><a ' + href + ' class="level' + level + ' clickonly">';
         } else if (this.style == 'ina') {
-            res += '<li style="background-color:#' + color + ';" data-level="' + level + '" data-page="' + p + '"><a ' + href + ' class="nodark level clickonly ' + level + '">';
+            res += '<li style="background-color:#' + color + ';" data-level="' + level + '" data-page="' + p + '"><a ' + href + ' class="nodark level' + level + ' clickonly">';
         }
         res += '<span>' + chapter.label + '</span>';
         if (href != 'nohref') {
diff --git a/style/chapters.less b/style/chapters.less
index c18e93f0..dafc3f5c 100644
--- a/style/chapters.less
+++ b/style/chapters.less
@@ -11,6 +11,75 @@ ul.chapters {
     width: unit((100/@menu-chapters-columns-count), %);
   }
 
+  &.indent {
+    a {
+      &.level-1 {
+        font-family: @font;
+        font-weight: 700;
+        text-align: left;
+
+        .right {
+          display: none;
+        }
+      }
+
+      &.level0 {
+        font-family: @font;
+        font-weight: 400;
+
+        .right .puce {
+          margin: unit(2*@scale, px) 0 0 0;
+        }
+
+      }
+
+      &.level1 {
+        padding-left: unit(50*@scale, px);
+
+        .right {
+          top: unit(6*@scale, px);
+        }
+
+        .rtl & {
+          padding-left: 0;
+          padding-right: unit(50*@scale, px);
+        }
+
+      }
+
+      &.level2 {
+        padding-left: unit(80*@scale, px);
+
+        .rtl & {
+          padding-left: 0;
+          padding-right: unit(80*@scale, px);
+        }
+
+        .right {
+          top: unit(6*@scale, px);
+        }
+
+        .right .puce {
+          margin: unit(-2*@scale, px) 0 0 0;
+        }
+      }
+
+      .level3 {
+        padding-left: unit(110*@scale, px);
+
+        .right {
+          top: unit(6*@scale, px);
+        }
+
+        .rtl & {
+          padding-left: 0;
+          padding-right: unit(110*@scale, px);
+        }
+      }
+    }
+  }
+
+
   &.onecolumn {
     .column {
       width: 100%;
@@ -60,69 +129,6 @@ ul.chapters {
       text-align: right;
     }
 
-    &.level-1 {
-      font-family: @font;
-      font-weight: 700;
-      text-align: left;
-
-      .right {
-        display: none;
-      }
-    }
-
-    &.level0 {
-      font-family: @font;
-      font-weight: 400;
-
-      .right .puce {
-        margin: unit(2*@scale, px) 0 0 0;
-      }
-
-    }
-
-    &.level1 {
-      padding-left: unit(50*@scale, px);
-
-      .right {
-        top: unit(6*@scale, px);
-      }
-
-      .rtl & {
-        padding-left: 0;
-        padding-right: unit(50*@scale, px);
-      }
-
-    }
-
-    &.level2 {
-      padding-left: unit(80*@scale, px);
-
-      .rtl & {
-        padding-left: 0;
-        padding-right: unit(80*@scale, px);
-      }
-
-      .right {
-        top: unit(6*@scale, px);
-      }
-
-      .right .puce {
-        margin: unit(-2*@scale, px) 0 0 0;
-      }
-    }
-
-    .level3 {
-      padding-left: unit(110*@scale, px);
-
-      .right {
-        top: unit(6*@scale, px);
-      }
-
-      .rtl & {
-        padding-left: 0;
-        padding-right: unit(110*@scale, px);
-      }
-    }
 
     > nav {
       display: none;