xmls, css, codeblocks linenumbers

2 files changed, 255 insertions, 10 deletions

diff --git a/src/doc_reform/output/xmls.d b/src/doc_reform/output/xmls.d
index 164613b..84028df 100644
--- a/src/doc_reform/output/xmls.d
+++ b/src/doc_reform/output/xmls.d
@@ -1164,23 +1164,49 @@ template outputXHTMLs() {
       assert(obj.metainfo.is_of_type    == "block");
       assert(obj.metainfo.is_a          == "code");
       string o;
+      string codelines(string _txt) {
+        string _codelines;
+        if (obj.code_block.linenumbers) {
+          string[] _block_lines = (_txt).split(rgx.br_newlines_linebreaks);
+          _codelines = "  <pre class=\"codeline\">\n";
+          foreach (k, _line; _block_lines) {
+            if (k == 1) {
+              _codelines ~= format(q"┃    <span class="tr first-row"><span class="th"></span><codeline>%s</codeline></span>
+    ┃",
+                _line,
+              );
+            } else {
+              _codelines ~= format(q"┃    <span class="tr"><span class="th"></span><codeline>%s</codeline></span>
+    ┃",
+                _line,
+              );
+            }
+          }
+          _codelines ~= "  </pre>";
+        } else {
+          _codelines = "  <pre class=\"codeline\">\n";
+          _codelines ~= _txt;
+          _codelines ~= "  </pre>";
+        }
+        return _codelines;
+      }
       if (!(obj.metainfo.identifier.empty)) {
         o = format(q"┃  <div class="substance">
       <label class="ocn"><a href="#%s" class="lnkocn">%s</a></label>
-      <pre><p class="%s" id="%s">%s</p></pre>
+      <p class="%s" id="%s">%s</p>
     </div>┃",
           obj.metainfo.identifier,
           (doc_matters.opt.action.ocn_off) ? "" : ((obj.metainfo.object_number.empty) ? "" : obj.metainfo.identifier),
           obj.metainfo.is_a,
           obj.metainfo.identifier,
-          _txt
+          codelines(_txt)
         );
       } else {
         o = format(q"┃  <div class="substance">
-      <pre><p class="%s">%s</p></pre>
+      <p class="%s">%s</p>
     </div>┃",
           obj.metainfo.is_a,
-          _txt
+          codelines(_txt)
         );
       }
       return o;
diff --git a/src/doc_reform/output/xmls_css.d b/src/doc_reform/output/xmls_css.d
index 2c5697f..2ced969 100644
--- a/src/doc_reform/output/xmls_css.d
+++ b/src/doc_reform/output/xmls_css.d
@@ -609,7 +609,14 @@ template DocReformCss() {
     clear                    : both;
     color                    : #555555;
   }
-  p.code {
+  pre.codeline {
+    display                  : table;
+    clear                    : both;
+    table-layout             : fixed;
+    margin-left              : 5%%;
+    margin-right             : 5%%;
+    width                    : 90%%;
+    white-space              : pre-wrap;
     border-style             : none;
     border-radius            : 5px 5px 5px 5px;
     box-shadow               : 0 2px 5px #AAAAAA inset;
@@ -627,6 +634,36 @@ template DocReformCss() {
     font-size                : 95%%;
     line-height              : 100%%;
   }
+  pre.codeline::before {
+    counter-reset            : linenum;
+  }
+  pre.codeline span.tr {
+    display                  : table-row;
+    counter-increment        : linenum;
+  }
+  pre.codeline span.th {
+    display                  : table-cell;
+    user-select              : none;
+    -moz-user-select         : none;
+    -webkit-user-select      : none;
+    padding                  : 0.5em 0.5em;
+    /* background-color         : #666666; */
+  }
+  pre.codeline span.th::before {
+    content                  : counter(linenum) ".";
+    color                    : #999999;
+    text-align               : right;
+    display                  : block;
+  }
+  pre.codeline span.th {
+    width                    : 4em;
+  }
+  pre.codeline code {
+    display                  : table-cell;
+  }
+  p.code {
+    border-style             : none;
+  }
   p.spaced { white-space:    pre; }
   p.block {
     white-space              : pre;
@@ -1276,7 +1313,14 @@ template DocReformCss() {
     clear                    : both;
     color                    : #555555;
   }
-  p.code {
+  pre.codeline {
+    display                  : table;
+    clear                    : both;
+    table-layout             : fixed;
+    margin-left              : 5%%;
+    margin-right             : 5%%;
+    width                    : 90%%;
+    white-space              : pre-wrap;
     border-style             : none;
     border-radius            : 5px 5px 5px 5px;
     box-shadow               : 0 2px 5px #AAAAAA inset;
@@ -1294,6 +1338,35 @@ template DocReformCss() {
     font-size                : 95%%;
     line-height              : 100%%;
   }
+  pre.codeline::before {
+    counter-reset            : linenum;
+  }
+  pre.codeline span.tr {
+    display                  : table-row;
+    counter-increment        : linenum;
+  }
+  pre.codeline span.th {
+    display                  : table-cell;
+    user-select              : none;
+    -moz-user-select         : none;
+    -webkit-user-select      : none;
+    padding                  : 0.5em 0.5em;
+  }
+  pre.codeline span.th::before {
+    content                  : counter(linenum) ".";
+    color                    : #999999;
+    text-align               : right;
+    display                  : block;
+  }
+  pre.codeline span.th {
+    width                    : 4em;
+  }
+  pre.codeline code {
+    display                  : table-cell;
+  }
+  p.code {
+    border-style             : none;
+  }
   p.spaced { white-space:    pre; }
   p.block {
     white-space              : pre;
@@ -1947,7 +2020,14 @@ template DocReformCss() {
     clear                    : both;
     color                    : #555555;
   }
-  p.code {
+  pre.codeline {
+    display                  : table;
+    clear                    : both;
+    table-layout             : fixed;
+    margin-left              : 5%%;
+    margin-right             : 5%%;
+    width                    : 90%%;
+    white-space              : pre-wrap;
     border-style             : none;
     border-radius            : 5px 5px 5px 5px;
     box-shadow               : 0 2px 5px #AAAAAA inset;
@@ -1965,6 +2045,36 @@ template DocReformCss() {
     font-size                : 95%%;
     line-height              : 100%%;
   }
+  pre.codeline::before {
+    counter-reset            : linenum;
+  }
+  pre.codeline span.tr {
+    display                  : table-row;
+    counter-increment        : linenum;
+  }
+  pre.codeline span.th {
+    display                  : table-cell;
+    user-select              : none;
+    -moz-user-select         : none;
+    -webkit-user-select      : none;
+    padding                  : 0.5em 0.5em;
+    /* background-color         : #666666; */
+  }
+  pre.codeline span.th::before {
+    content                  : counter(linenum) ".";
+    color                    : #999999;
+    text-align               : right;
+    display                  : block;
+  }
+  pre.codeline span.th {
+    width                    : 4em;
+  }
+  pre.codeline code {
+    display                  : table-cell;
+  }
+  p.code {
+    border-style             : none;
+  }
   p.spaced { white-space:    pre; }
   p.block {
     white-space              : pre;
@@ -2542,7 +2652,14 @@ template DocReformCss() {
     clear                    : both;
     color                    : #555555;
   }
-  p.code {
+  pre.codeline {
+    display                  : table;
+    clear                    : both;
+    table-layout             : fixed;
+    margin-left              : 5%%;
+    margin-right             : 5%%;
+    width                    : 90%%;
+    white-space              : pre-wrap;
     border-style             : none;
     border-radius            : 5px 5px 5px 5px;
     box-shadow               : 0 2px 5px #AAAAAA inset;
@@ -2560,6 +2677,35 @@ template DocReformCss() {
     font-size                : 95%%;
     line-height              : 100%%;
   }
+  pre.codeline::before {
+    counter-reset            : linenum;
+  }
+  pre.codeline span.tr {
+    display                  : table-row;
+    counter-increment        : linenum;
+  }
+  pre.codeline span.th {
+    display                  : table-cell;
+    user-select              : none;
+    -moz-user-select         : none;
+    -webkit-user-select      : none;
+    padding                  : 0.5em 0.5em;
+  }
+  pre.codeline span.th::before {
+    content                  : counter(linenum) ".";
+    color                    : #999999;
+    text-align               : right;
+    display                  : block;
+  }
+  pre.codeline span.th {
+    width                    : 4em;
+  }
+  pre.codeline code {
+    display                  : table-cell;
+  }
+  p.code {
+    border-style             : none;
+  }
   p.spaced { white-space:    pre; }
   p.block {
     white-space              : pre;
@@ -3139,7 +3285,14 @@ template DocReformCss() {
     clear                    : both;
     color                    : #555555;
   }
-  p.code {
+  pre.codeline {
+    display                  : table;
+    clear                    : both;
+    table-layout             : fixed;
+    margin-left              : 5%%;
+    margin-right             : 5%%;
+    width                    : 90%%;
+    white-space              : pre-wrap;
     border-style             : none;
     border-radius            : 5px 5px 5px 5px;
     box-shadow               : 0 2px 5px #AAAAAA inset;
@@ -3157,6 +3310,36 @@ template DocReformCss() {
     font-size                : 95%%;
     line-height              : 100%%;
   }
+  pre.codeline::before {
+    counter-reset            : linenum;
+  }
+  pre.codeline span.tr {
+    display                  : table-row;
+    counter-increment        : linenum;
+  }
+  pre.codeline span.th {
+    display                  : table-cell;
+    user-select              : none;
+    -moz-user-select         : none;
+    -webkit-user-select      : none;
+    padding                  : 0.5em 0.5em;
+    /* background-color         : #666666; */
+  }
+  pre.codeline span.th::before {
+    content                  : counter(linenum) ".";
+    color                    : #999999;
+    text-align               : right;
+    display                  : block;
+  }
+  pre.codeline span.th {
+    width                    : 4em;
+  }
+  pre.codeline code {
+    display                  : table-cell;
+  }
+  p.code {
+    border-style             : none;
+  }
   p.spaced { white-space:    pre; }
   p.block {
     white-space              : pre;
@@ -3624,7 +3807,14 @@ template DocReformCss() {
     clear                    : both;
     color                    : #555555;
   }
-  p.code {
+  pre.codeline {
+    display                  : table;
+    clear                    : both;
+    table-layout             : fixed;
+    margin-left              : 5%%;
+    margin-right             : 5%%;
+    width                    : 90%%;
+    white-space              : pre-wrap;
     border-style             : none;
     border-radius            : 5px 5px 5px 5px;
     box-shadow               : 0 2px 5px #AAAAAA inset;
@@ -3642,6 +3832,35 @@ template DocReformCss() {
     font-size                : 95%%;
     line-height              : 100%%;
   }
+  pre.codeline::before {
+    counter-reset            : linenum;
+  }
+  pre.codeline span.tr {
+    display                  : table-row;
+    counter-increment        : linenum;
+  }
+  pre.codeline span.th {
+    display                  : table-cell;
+    user-select              : none;
+    -moz-user-select         : none;
+    -webkit-user-select      : none;
+    padding                  : 0.5em 0.5em;
+  }
+  pre.codeline span.th::before {
+    content                  : counter(linenum) ".";
+    color                    : #999999;
+    text-align               : right;
+    display                  : block;
+  }
+  pre.codeline span.th {
+    width                    : 4em;
+  }
+  pre.codeline code {
+    display                  : table-cell;
+  }
+  p.code {
+    border-style             : none;
+  }
   p.spaced { white-space:    pre; }
   p.block {
     white-space              : pre;