typo styles ok, text mode ok with close bouton, bugfixes

assets/dist/main.css

@@ -737,7 +737,6 @@ header {
 
 .sticky-clone-wrapper {
   padding-top: 5em;
-  padding-bottom: 1em;
   position: fixed;
   top: 0;
   left: 0;
@@ -750,7 +749,8 @@ header {
 main#content {
   margin-top: 5em; }
   main#content section.part {
-    position: relative; }
+    position: relative;
+    margin-bottom: 2em; }
 
 section.intro {
   margin-left: 70px; }
@@ -758,6 +758,7 @@ section.intro {
 h1.part-title {
   font-size: 1.8em;
   margin: 0 0 0 70px;
+  padding-bottom: 0.5em;
   font-weight: normal;
   letter-spacing: 0.3em; }
   h1.part-title em {
@@ -766,20 +767,50 @@ h1.part-title {
 
 h2.title {
   font-size: 1.2em;
-  font-weight: normal;
+  font-weight: 500;
   margin: 1em 0 0 70px;
   line-height: 1; }
 
-main#content.mode-text h1.part-title {
-  margin: 1em 0 0 70px; }
+h4.filet {
+  margin: 0.5em 0 0 70px; }
 
-main#content.mode-text h2.title, main#content.mode-text h4.filet {
-  margin: 1em 0 0 70px; }
+div.proposition:not(.chapitre), div.proposition.chapitre:first-of-type,
+div.appendice:not(.chapitre),
+div.appendice.chapitre:first-of-type,
+div.chapitre:not(.chapitre),
+div.chapitre.chapitre:first-of-type {
+  margin-top: 1em; }
 
-main#content.mode-text section.enonce {
-  width: 450px;
+div.proposition span.title,
+div.appendice span.title,
+div.chapitre span.title {
+  font-size: 1.2em;
+  font-weight: 500; }
+
+div.explication span.title,
+div.demonstration span.title,
+div.scolie span.title,
+div.corollaire span.title,
+div.prop-axiom span.title,
+div.lemme span.title {
+  font-size: 0.8em;
+  text-transform: capitalize;
+  font-variant: small-caps; }
+
+div.lemme-scolie span.title,
+div.lemme-corrollaire span.title,
+div.lemme-demonstration span.title,
+div.corollaire-demo span.title {
+  font-size: 0.7em;
+  text-transform: capitalize;
+  font-variant: small-caps; }
+
+main#content.mode-text section.enonce, main#content.mode-text section.item.nested {
+  width: 600px;
   margin: 1em 0 1em 70px;
-  overflow-x: visible;
+  overflow-x: visible; }
+
+main#content.mode-text section.enonce {
   font-family: 'amiri', sans-serif;
   font-size: 16px;
   font-kerning: auto;
@@ -789,13 +820,22 @@ main#content.mode-text section.enonce {
     font-weight: 300;
     margin: 0;
     cursor: pointer; }
+  main#content.mode-text section.enonce.definition:not(.nested) > h2, main#content.mode-text section.enonce.axiom:not(.nested) > h2, main#content.mode-text section.enonce.def-affect:not(.nested) > h2 {
+    font-size: 1.2em;
+    float: left;
+    margin: 0 0.5em 0 0;
+    font-weight: 600;
+    text-transform: uppercase; }
   main#content.mode-text section.enonce h3 {
     font-size: 0.9em;
     font-weight: 300;
     margin: 0;
     cursor: pointer; }
+  main#content.mode-text section.enonce.proposition > div.text {
+    font-size: 1.5em;
+    font-weight: 500; }
   main#content.mode-text section.enonce div.text {
-    font-size: 1.3em; }
+    font-size: 1.2em; }
     main#content.mode-text section.enonce div.text div.paragraph {
       margin-bottom: 1em; }
       main#content.mode-text section.enonce div.text div.paragraph div.opened-link {
@@ -811,19 +851,50 @@ main#content.mode-text section.enonce {
         border-left: 1px solid #999; }
       main#content.mode-text section.enonce div.text div.paragraph img {
         float: left; }
+      main#content.mode-text section.enonce div.text div.paragraph sup {
+        font-size: 50%;
+        font-weight: 600; }
+  main#content.mode-text section.enonce hr {
+    display: none; }
+  main#content.mode-text section.enonce section ol {
+    font-size: 0.7em;
+    margin: -1em 0 2em 0;
+    padding: 0 0 0 1em; }
+
+main#content.mode-text .enonce.nested, main#content.mode-text .item.nested {
+  font-size: 16px; }
+
+main#content.mode-text .opened-link .close-link-btn {
+  width: 20px;
+  margin: 1em 0 -2.1em 61px;
+  position: relative;
+  background-color: white;
+  z-index: 10;
+  cursor: pointer;
+  text-align: center; }
+  main#content.mode-text .opened-link .close-link-btn span {
+    font-style: normal;
+    font-size: 0.7em;
+    font-weight: 300; }
 
 .dot {
   margin: 0 0 0 70px;
   position: relative;
   border: 1px solid white;
   width: 550px; }
+  .dot > span.title {
+    margin: 0 0.6em 0 0; }
   .dot > p.summary {
     display: inline-block;
     vertical-align: top;
-    margin: 0 0 0 0.6em;
+    margin: 0;
     opacity: 0;
     transition: opacity 0.4s ease-in-out;
     max-width: 475px; }
+  .dot.preface .title {
+    display: none; }
+  .dot.preface p.summary {
+    opacity: 1; }
   .dot:not(.disabled) > span.title, .dot:not(.disabled) > p.summary {
     cursor: pointer; }
   .dot.disabled > span.title, .dot.disabled > p.summary {
@@ -847,7 +918,6 @@ main#content.mode-text section.enonce {
     border-bottom: 1px solid #e2e2e2; }
   .dot > nav.links {
     position: relative;
-    left: 140px;
     box-sizing: border-box; }
     .dot > nav.links.to {
       bottom: 100%;
@@ -862,7 +932,7 @@ main#content.mode-text section.enonce {
       border-left: 1px solid #e2e2e2;
       position: absolute;
       top: 0;
-      left: 90px;
+      left: 65px;
       height: 100%;
       width: 1px;
       z-index: -1; }
@@ -878,6 +948,6 @@ footer {
   background-color: white;
   width: 100%; }
   footer > * {
-    margin-left: 1em; }
+    margin-left: 70px; }
 
 /*# sourceMappingURL=main.css.map*/

assets/main.scss

@@ -32,7 +32,7 @@ header{
   top:0; z-index: 5;
   background-color: white;
   // padding: 0 0 0 $margin_left;
-  // border-bottom: 1px solid green;
+  // outline: 1px solid green;
   >*{
     display: inline-block;
     vertical-align: text-bottom;
@@ -132,7 +132,7 @@ header{
 
 .sticky-clone-wrapper{
   padding-top: $header_height;
-  padding-bottom: 1em;
+  // padding-bottom: 1em;
   position: fixed;
   top:0; left: 0;
   z-index: 4;
@@ -173,6 +173,7 @@ main#content{
 
   section.part{
     position: relative;
+    margin-bottom:2em;
   }
 
   // h2.title, h2.filet{
@@ -192,6 +193,7 @@ section.intro{
 h1.part-title{
   font-size: 1.8em;
   margin:0 0 0 $margin_left;
+  padding-bottom: 0.5em;
   font-weight: normal;
   letter-spacing: 0.3em;
   em{
@@ -202,25 +204,64 @@ h1.part-title{
 
 h2.title{
   font-size: 1.2em;
-  font-weight: normal;
+  font-weight: 500;
   margin:1em 0 0 $margin_left;
   line-height: 1;
 }
 
+// div.definition,
+// div.axiom{
+//   margin-top: 1em;
+// }
 
+h4.filet{
+  margin:0.5em 0 0 $margin_left;
+}
 
+div.proposition,
+div.appendice,
+div.chapitre{
+  &:not(.chapitre), &.chapitre:first-of-type{margin-top: 1em;}
+  span.title{
+  font-size: 1.2em;
+  font-weight: 500;
+  }
+}
+
+div.explication,
+div.demonstration,
+div.scolie,
+div.corollaire,
+div.prop-axiom,
+div.lemme{
+  span.title{
+    font-size: 0.8em;
+    text-transform:capitalize;
+    font-variant: small-caps;
+  }
+}
+div.lemme-scolie,
+div.lemme-corrollaire,
+div.lemme-demonstration,
+div.corollaire-demo{
+  span.title{
+    font-size: 0.7em;
+    text-transform:capitalize;
+    font-variant: small-caps;
+  }
+}
 //     ____      __    _
 //    /  _/___  / /   (_)___  ___
 //    / // __ \/ /   / / __ \/ _ \
 //  _/ // / / / /___/ / / / /  __/
 // /___/_/ /_/_____/_/_/ /_/\___/
 main#content.mode-text{
-  h1.part-title{
-    margin: 1em 0 0 $margin_left;
-  }
-  h2.title, h4.filet{
-    margin: 1em 0 0 $margin_left;
-  }
+  // h1.part-title{
+  //   margin: 1em 0 0 $margin_left;
+  // }
+  // h2.title, h4.filet{
+  //   margin: 1em 0 0 $margin_left;
+  // }
 
   // .sticky{
   //   color: red;
@@ -228,11 +269,12 @@ main#content.mode-text{
   //     position: fixed;
   //   }
   // }
-
-  section.enonce{
-    width:450px;
+  section.enonce, section.item.nested{
+    width:600px;
     margin: 1em 0 1em $margin_left;
     overflow-x: visible;
+  }
+  section.enonce{
     @include base_font;
     // max-height:14px;
     // overflow: hidden;
@@ -249,6 +291,17 @@ main#content.mode-text{
       cursor:pointer;
     }
 
+    &.definition, &.axiom, &.def-affect{
+      &:not(.nested)>h2{
+        font-size: 1.2em;
+        float:left;
+        margin:0 0.5em 0 0;
+        // line-height: 1.9;
+        font-weight: 600;
+        text-transform: uppercase;
+      }
+    }
+
     h3{
       font-size: 0.9em;
       font-weight: 300;
@@ -256,8 +309,12 @@ main#content.mode-text{
       cursor:pointer;
     }
 
+    &.proposition>div.text{
+      font-size: 1.5em;
+      font-weight: 500;
+    }
     div.text{
-      font-size: 1.3em;
+      font-size: 1.2em;
       div.paragraph{
         margin-bottom: 1em;
 
@@ -279,11 +336,53 @@ main#content.mode-text{
         img{
           float: left;
         }
+        sup{
+          font-size: 50%;
+          font-weight: 600;
+        }
+
       }
 
     }
+
+    // footnotes
+    hr{
+      display:none;
+    }
+    section ol{
+      font-size: 0.7em;
+      margin: -1em 0 2em 0;
+      padding:0 0 0 1em;
+    }
+
+  }
+
+  // reset font-size since nested items are in a div with alternate font-size
+  .enonce.nested, .item.nested{
+    font-size: $fs;
   }
 
+  .opened-link{
+    // position:relative;
+    // outline: 1px solid red;
+    .close-link-btn{
+      width:20px;
+      margin:1em 0 -2.1em $margin_left - 9px;
+      // outline: 1px solid green;
+      // display:inline-block;
+      position:relative;
+      background-color: white;
+      z-index: 10;
+      // top:0; left:-1em;
+      cursor: pointer;
+      text-align: center;
+      span{
+        font-style: normal;
+        font-size: 0.7em;
+        font-weight: 300;
+      }
+    }
+  }
 }
 
 
@@ -324,23 +423,30 @@ main#content.mode-connections{
   //   font-kerning: none;
   // }
   >span.title{
+    margin: 0 0.6em 0 0;
   }
 
   >p.summary{
     display: inline-block;
     vertical-align: top;
-    margin: 0 0 0 0.6em;
+    margin: 0;
     opacity: 0;
     transition: opacity 0.4s ease-in-out;
     max-width : $dot_w - $margin_left -5px;
   }
+  &.preface{
+    .title{display: none;}
+    p.summary{
+      opacity: 1;
+    }
+  }
   &:not(.disabled) {
     >span.title,>p.summary{cursor: pointer;}
   }
   &.disabled {
     >span.title,>p.summary{cursor: default;}
   }
-  
+
   >section.text{
     display: inline-block;
     vertical-align: top;
@@ -367,7 +473,7 @@ main#content.mode-connections{
 
   >nav.links{
     position:relative;
-    left: $margin_left*2;
+    // left: $margin_left*2;
     box-sizing: border-box;
     &.to{
       bottom:100%;
@@ -384,7 +490,7 @@ main#content.mode-connections{
       content: "";
       border-left: 1px solid #e2e2e2;
       position: absolute;
-      top:0; left:$margin_left + ($bullet_w/2);
+      top:0; left:$margin_left - 5px;
       height: 100%; width:1px;
       z-index: -1;
     }
@@ -420,6 +526,6 @@ footer{
   position: fixed;
   bottom: 0;
   background-color: white;
-  >*{margin-left: 1em;}
+  >*{margin-left: $margin_left;}
   width: 100%;
 }

assets/modules/ModeConnections.js

@@ -41,12 +41,22 @@ var _Dot = {
     this.text = vn.attrs.text || '';
     this.rendered_text = markdown.render(this.text);
 
-    // construct summary
-    // TODO: summary needs more work (strip tags, markdown render)
-    this.summary = this.text.match('([^ ]*[ ]{0,1}){1,6}')[0];
-    this.summary = this.summary.trim().replace(/_([^_]+)$/g, "_$1_");
-    this.summary = this.summary.replace(/\[([^\]]+)$/g, "$1");
-    this.summary = markdown.renderInline(this.summary) + " …";
+    if(this.dottype == "preface"){
+      this.summary = this.rendered_text;
+    }else{
+      // construct summary
+      // TODO: summary needs more work (strip tags, markdown render)
+      // remove img
+      this.summary = this.text.replace(/!\[[^\]]+\]\([^\)]+\)/g, "");
+      // get portion of text
+      this.summary = this.summary.match('([^ ]*[ ]{0,1}){1,6}')[0];
+      // end underscores (italic)
+      this.summary = this.summary.trim().replace(/_([^_]+)$/g, "_$1_");
+      // end brackets (links)
+      this.summary = this.summary.replace(/\[([^\]]+)$/g, "$1");
+      // render the marckdown
+      this.summary = markdown.renderInline(this.summary) + " …";
+    }
 
   },
   oninit(vn){
@@ -89,73 +99,15 @@ var _Dot = {
       this.setupTitle(vn);
     }
   },
-  view(vn){
-    if (this.active && this.opened) {
-      // full view of dot with linked dots
-      // console.log('_Dot view '+this.id+' parents :',this.parents);
-      var dot_content = [
-        // links to
-        this.links.to.length
-          ? m('nav', {'class':'links to'}, this.links.to.map(id => {
-              // console.log(id);
-              if(typeof _dbs.data_byid[_dbs.lang][id] !== 'undefined'){
-                var obj = _dbs.data_byid[_dbs.lang][id];
-                // console.log('link to : obj', obj);
-                return m(_Dot, {
-                  "id":id,
-                  'text':obj.text,
-                  'dottype':obj.dottype,
-                  'type':obj.type,
-                  // passe the memory of crossed dots plus the current one
-                  'parents':vn.state.parents.concat([vn.state.id]),
-                  // activate link only if not in parents (already went through it)
-                  'active':vn.state.parents.indexOf(id) == -1 ? true:false
-                });
-              }
-            })
-          )
-          : null, // if no links to, add nothing
-        // id
-        // m('span', {'class':'id'}, this.id), // this.type+' '+
-        // bullet
-        // m('span', {'class':'bullet'}, m.trust('⚫')),
-        // Title
-        m('span', {'class':'title'}, m.trust(this.title)),
-        // full text
-        m('section', {
-          'class':'text',
-          onmouseover(e){
-            e.preventDefault();
-            if(e.target.nodeName == "A" ){
-              // console.log("over e.target", e.target);
-              // console.log('over vn', vn);
-              var id = e.target.getAttribute("href");
-              // add highlight class
-              vn.dom.querySelector('nav.links>div[uid="'+id+'"]').classList.add('highlight');
-            }else{
-              // remove all hilight class
-              for (link of vn.dom.querySelectorAll('nav.links>div.dot')) {
-                link.classList.remove('highlight');
-              }
-            }
-          },
-          onclick(e){
-            e.preventDefault();
-            if(e.target.nodeName == "A" ){
-              // console.log("over e.target", e.target);
-              // console.log('over vn', vn);
-              var id = e.target.getAttribute("href");
-              // add highlight class
-              vn.dom.querySelector('nav.links>div[uid="'+id+'"]>.summary').click();
-            }
-          }
-        }, m.trust(this.rendered_text)),
-        // links from
-        this.links.from.length
-          ? m('nav', {'class':'links from'}, this.links.from.map(id => {
+  setOpenedContent(vn){
+    this.dot_content = [
+      // links to
+      this.links.to.length
+        ? m('nav', {'class':'links to'}, this.links.to.map(id => {
+            // console.log(id);
+            if(typeof _dbs.data_byid[_dbs.lang][id] !== 'undefined'){
               var obj = _dbs.data_byid[_dbs.lang][id];
-              // console.log('link from : obj', obj);
-              // return a dot
+              // console.log('link to : obj', obj);
               return m(_Dot, {
                 "id":id,
                 'text':obj.text,
@@ -166,41 +118,100 @@ var _Dot = {
                 // activate link only if not in parents (already went through it)
                 'active':vn.state.parents.indexOf(id) == -1 ? true:false
               });
-            })
-          )
-          : null, // if no links from, add nothing
-      ];
-    }else{
-      // preview dot
-      var dot_content = [
-          // m('span', {'class':'id'}, this.id), // this.type+' '+
-          // m('span', {'class':'bullet'}, m.trust('•')),
-          m('span', {
-            'class':'title',
-            onclick(e){
-              // TODO: animate openening (text and links separatly)
-              vn.state.opened = true;
             }
-          }, m.trust(this.title)), // TODO: on nested dot add full description : Part 1, Prop 8, scolie
-          m('p', {
-            'class':'summary',
-            onclick(e){
-              // TODO: animate openening (text and links separatly)
-              vn.state.opened = true;
+          })
+        )
+        : null, // if no links to, add nothing
+      // id
+      // m('span', {'class':'id'}, this.id), // this.type+' '+
+      // bullet
+      // m('span', {'class':'bullet'}, m.trust('⚫')),
+      // Title
+      m('span', {'class':'title'}, m.trust(this.title)),
+      // full text
+      m('section', {
+        'class':'text',
+        onmouseover(e){
+          e.preventDefault();
+          if(e.target.nodeName == "A" ){
+            // console.log("over e.target", e.target);
+            // console.log('over vn', vn);
+            var id = e.target.getAttribute("href");
+            // add highlight class
+            vn.dom.querySelector('nav.links>div[uid="'+id+'"]').classList.add('highlight');
+          }else{
+            // remove all hilight class
+            for (link of vn.dom.querySelectorAll('nav.links>div.dot')) {
+              link.classList.remove('highlight');
             }
-          }, m.trust(this.summary))
-      ];
+          }
+        },
+        onclick(e){
+          e.preventDefault();
+          if(e.target.nodeName == "A" ){
+            // console.log("over e.target", e.target);
+            // console.log('over vn', vn);
+            var id = e.target.getAttribute("href");
+            // add highlight class
+            vn.dom.querySelector('nav.links>div[uid="'+id+'"]>.summary').click();
+          }
+        }
+      }, m.trust(this.rendered_text)),
+      // links from
+      this.links.from.length
+        ? m('nav', {'class':'links from'}, this.links.from.map(id => {
+            var obj = _dbs.data_byid[_dbs.lang][id];
+            // console.log('link from : obj', obj);
+            // return a dot
+            return m(_Dot, {
+              "id":id,
+              'text':obj.text,
+              'dottype':obj.dottype,
+              'type':obj.type,
+              // passe the memory of crossed dots plus the current one
+              'parents':vn.state.parents.concat([vn.state.id]),
+              // activate link only if not in parents (already went through it)
+              'active':vn.state.parents.indexOf(id) == -1 ? true:false
+            });
+          })
+        )
+        : null, // if no links from, add nothing
+    ];
+  },
+  setPreviewContent(vn){
+    this.dot_content = [
+        // m('span', {'class':'id'}, this.id), // this.type+' '+
+        // m('span', {'class':'bullet'}, m.trust('•')),
+        m('span', {
+          'class':'title',
+          onclick(e){
+            // TODO: animate openening (text and links separatly)
+            vn.state.opened = true;
+          }
+        }, m.trust(this.title)), // TODO: on nested dot add full description : Part 1, Prop 8, scolie
+        m('p', {
+          'class':'summary',
+          onclick(e){
+            // TODO: animate openening (text and links separatly)
+            vn.state.opened = true;
+          }
+        }, m.trust(this.summary))
+    ];
+  },
+  view(vn){
+    if (this.active && this.opened) {
+      // full view of dot with linked dots
+      this.setOpenedContent(vn);
+    }else{
+      // preview dot
+      this.setPreviewContent(vn);
     }
 
     return m('div',{
         'uid':this.id,
         'class':`dot ${this.dottype}`,
-        // onclick(e){
-        //   // TODO: animate openening (text and links separatly)
-        //   vn.state.opened = true;
-        // }
       },
-      dot_content
+      this.dot_content
     );
   },
   onupdate(vn){

assets/modules/ModeText.js

@@ -16,6 +16,7 @@ var _Ui = require('./ui.js');
 //  / /___/ / / / / ,<
 // /_____/_/_/ /_/_/|_|
 var _Link = {
+  parent_id:null,
   tid:"",
   opened:false,
   oninit(vn){
@@ -29,16 +30,28 @@ var _Link = {
   view(vn){
     this.tid_known = typeof _dbs.data_byid[_dbs.lang][this.tid] === 'undefined' ? false : true;
     if (!this.tid_known) {
-      // console.log('!! target id '+this.tid+' unkonwn !!');
+      // console.log(`!! in ${this.id}, target id ${this.tid} is unkonwn !!`);
     }
     if(this.opened && this.tid_known){
       // console.log('this.tid', vn.state);
+      // traget object
+      this.tob = Object.assign({"nested":true},_dbs.data_byid[_dbs.lang][this.tid]);
+
       return m('div', {'class':'opened-link'},
           [
             m('span', {'class':"link text"}, vn.children),
+            m('div', {
+              'class':'close-link-btn',
+              onclick(e){
+                // e.preventDefault();
+                console.log('click close btn', this);
+                vn.state.opened = false;
+                // return false;
+              }
+            }, m('span', m.trust("&#128473;"))),
             typeof _dbs.data_byid[_dbs.lang][this.tid].childs != "undefined"
-              ? m(_Enonce, _dbs.data_byid[_dbs.lang][this.tid])
-              : m(_Item, _dbs.data_byid[_dbs.lang][this.tid])
+              ? m(_Enonce, this.tob)
+              : m(_Item, this.tob)
           ]
         );
     }else{
@@ -93,7 +106,7 @@ function parseTextDom(nodes){
         // again parse node's childs
         n.childs = parseTextDom(nodes[i].childNodes);
       }
-    }else if (nodes[i].textContent.length > 1){
+    }else if (nodes[i].textContent.length > 0){
       // if node has no localName it is probably a #text node
       // we record it if it's not empty
       n.tag='#text';
@@ -133,15 +146,10 @@ var _Text = {
     // !! we need to convert markdown to html here because parseTextDom() is recursive through nodes tree
     // convert markdown to html
     this.texthtml = markdown.render(this.text)
-    // TODO: fixe number link text disapear [3](1d3) ( in 104d )
-    // TODO: fixe parenthèse disparait _(par les Défin. [test 3](1d3) et [test 5](1d5))_  ( in 104d )
-    // parse html string to virtual dom
+    // convert html string to virtual dom
     this.textdom = new DOMParser().parseFromString(this.texthtml, "text/html");
-    // get the text nodes (avoid html document extra)
+    // get the text nodes (avoid html document extra) and apply some transformations
     this.textchilds = parseTextDom(this.textdom.getElementsByTagName('body')[0].childNodes);
-    if(this.id == "115sc"){
-      // console.log(this.textchilds);
-    }
   },
   oninit(vn){
     this.id = vn.attrs.id;
@@ -179,6 +187,7 @@ var _Item = {
     // vn.state.part = vn.state.slug.match(/^(\d)(.+)/)[1];
     this.text = vn.attrs.text;
     this.nested = vn.attrs.nested || false;
+    this.dottype = vn.attrs.dottype || null;
   },
   onbeforeupdate(vn, old){
     this.nested = vn.attrs.nested || false;
@@ -186,18 +195,22 @@ var _Item = {
     this.text = vn.attrs.text;
   },
   view(vn){
+    // if(this.id == "340c2"){
+    //   console.log(`${this.id} vn.attrs `,vn.attrs);
+    // }
     return m("section", {
         'id':this.id,
-        'class':'item'+(this.nested ? ' nested':'')
+        // 'class':'item'+(this.nested ? ' nested':'')
+        'class' :`item${this.nested ? ' nested':''} ${this.dottype}`
       },
       [
-        // create title node
-        m("h3", {
+        // create title node (only if not nested)
+        !this.nested ? m("h3", {
             // 'ref':vn.attrs.href,
-            onclick(e){
-              vn.state.active = vn.state.active ? 0 : 1;
-            }
-          }, m.trust(markdown.renderInline(this.type))),
+            // onclick(e){ WHAT IS THIS STATE ACTIVE ???
+            //   vn.state.active = vn.state.active ? 0 : 1;
+            // }
+          }, m.trust(markdown.renderInline(this.type))) : null,
         // create text node
         m(_Text, {'text':this.text, 'id':this.id})
       ]
@@ -225,6 +238,7 @@ var _Enonce = {
     this.text = vn.attrs.text;
     this.childs = vn.attrs.childs || [];
     this.nested = vn.attrs.nested || false;
+    this.dottype = vn.attrs.dottype || "no-dottype";
   },
   onbeforeupdate(vn, old) {
     // console.log(vn.attrs.childs);
@@ -238,15 +252,15 @@ var _Enonce = {
     // if(vn.attrs.id == '1d1') console.log('_Enonce VIEW, text :', vn.attrs.text);
     return m("section", {
       'id'    :this.id,
-      'class' :'enonce'+(this.nested ? ' nested':'')
+      'class' :`enonce${this.nested ? ' nested':''} ${this.dottype}`
     },
     [
-      // create title node
-      m("h2", {}, m.trust(markdown.renderInline(this.title))),
+      // create title node (only if not nested)
+      !this.nested ? m("h2", {}, m.trust(markdown.renderInline(this.title))) : null,
       // create text node
       m(_Text, {'text':this.text, 'id':this.id}),
-      // addd children
-      this.childs.map(c => { return m(_Item, c); })
+      // add children (only if not nested)
+      !this.nested ? this.childs.map(c => { return m(_Item, c); }) : null
     ])
   }
 }
@@ -268,7 +282,7 @@ var _Part = {
     this.enonces = vn.attrs.enonces;
   },
   view(vn){
-    console.log("part enonces", vn.attrs.enonces);
+    // console.log("part enonces", vn.attrs.enonces);
     return m("section", {
         'id'    :this.id,
         'class' :'part'

assets/modules/dbs.js

@@ -120,75 +120,48 @@ module.exports = {
     var m = id.match(rx_id);
     if(m){
       switch(true){
-        case /^\d{2}$/.test(m[2]):
+        case /^\d{2}$/.test(m[2]): // proposition
           switch(true){
             case /^cd$/.test(m[3])    : return 'corollaire-demo';
-            case /^cd$/.test(m[3])    : return 'corollaire-demo';
-            case /^sc$/.test(m[3])    : return 'scolie';
             case /^sc$/.test(m[3])    : return 'scolie';
             case /^d$/.test(m[3])     : return 'demonstration';
-            case /^d$/.test(m[3])     : return 'demonstration';
             case /^c$/.test(m[3])     :
               switch(true){
-                case /^sc$/.test(m[4]): return 'scolie';
                 case /^sc$/.test(m[4]): return 'scolie';
                 case /^d$/.test(m[4]) : return 'demonstration';
-                case /^d$/.test(m[4]) : return 'demonstration';
-                case /^d$/.test(m[5]) : return 'demonstration';
-                case /^d$/.test(m[5]) : return 'demonstration';
-                case /^sc$/.test(m[5]): return 'scolie';
                 case /^sc$/.test(m[5]): return 'scolie';
                 case /^\d$/.test(m[4]): return 'corollaire';
-                case /^\d$/.test(m[4]): return 'corollaire';
-                case !m[4]            : return 'corollaire';
                 case !m[4]            : return 'corollaire';
               }
-            case /^a$/.test(m[3])     : return 'axiom';
-            case /^a$/.test(m[3])     : return 'axiom';
+            case /^a$/.test(m[3])     : return 'prop-axiom';
             case /^l$/.test(m[3])     :
               switch(true){
-                case /^d$/.test(m[5]) : return 'demonstration';
-                case /^d$/.test(m[5]) : return 'demonstration';
-                case /^sc$/.test(m[5]): return 'scolie';
-                case /^sc$/.test(m[5]): return 'scolie';
-                case !m[5]            : return 'lemme';
+                case /^d$/.test(m[5]) : return 'lemme-demonstration';
+                case /^sc$/.test(m[5]): return 'lemme-scolie';
+                case /^c$/.test(m[5]) : return 'lemme-corrollaire';
                 case !m[5]            : return 'lemme';
               }
             case /^p$/.test(m[3])     : return 'postulat';
-            case /^p$/.test(m[3])     : return 'postulat';
-            case /^\d$/.test(m[3])    : return '??';
             case /^\d$/.test(m[3])    : return '??';
             case /^\d{2}$/.test(m[3]) : return '??';
-            case /^\d{2}$/.test(m[3]) : return '??';
-            case !m[3]                : return 'proposition';
             case !m[3]                : return 'proposition';
           }
         case /^app|ap$/.test(m[2])    : return 'appendice';
-        case /^app|ap$/.test(m[2])    : return 'appendice';
         case /^agd$/.test(m[2])       : return 'def-gen-affect';
-        case /^agd$/.test(m[2])       : return 'def-gen-affect';
-        case /^pr$/.test(m[2])        : return 'preface';
         case /^pr$/.test(m[2])        : return 'preface';
         case /^ad$/.test(m[2])        :
           switch(true){
-            case /^e$/.test(m[4])     :return 'explication';
             case /^e$/.test(m[4])     :return 'explication';
             case !m[4]                :return 'def-affect';
-            case !m[4]                :return 'def-affect';
           }
         case /^c$/.test(m[2])         : return 'chapitre';
-        case /^c$/.test(m[2])         : return 'chapitre';
-        case /^p$/.test(m[2])         : return 'postulat';
         case /^p$/.test(m[2])         : return 'postulat';
         case /^d$/.test(m[2])         :
           switch(true){
             case /^e$/.test(m[4])     : return 'explication';
-            case /^e$/.test(m[4])     : return 'explication';
-            case !m[4]                : return 'definition';
             case !m[4]                : return 'definition';
           }
         case /^a$/.test(m[2])         : return 'axiom';
-        case /^a$/.test(m[2])         : return 'axiom';
       }
       // }
     }

assets/modules/ui.js

@@ -28,12 +28,15 @@ module.exports = {
     // console.log(header_height);
 
     // create the stkd titles wrapper block
-    let stkd_wrapper = document.createElement('div');
-    stkd_wrapper.classList.add('sticky-clone-wrapper');
-    document.body.append(stkd_wrapper);
+    var stkd_wrapper = document.querySelector('.sticky-clone-wrapper');
+    if(!stkd_wrapper){
+      var stkd_wrapper = document.createElement('div');
+      stkd_wrapper.classList.add('sticky-clone-wrapper');
+      document.body.append(stkd_wrapper);
+    }
 
     // get all part title
-    let part_titles = new Array();
+    var part_titles = new Array();
     Array.from(document.querySelectorAll('h1.part-title')).forEach(function(e){
       e._part = e.getAttribute('part');
       part_titles.push(e)