1 files changed, 13 insertions, 846 deletions
diff --git a/src/sdp/output_html.d b/src/sdp/output_html.d
index d5b1a22..155ad48 100644
--- a/src/sdp/output_html.d
+++ b/src/sdp/output_html.d
@@ -25,7 +25,8 @@ template outputHTML() {
     create_zip_file,
     defaults,
     output_rgx,
-    output_xhtmls,
+    output_xmls,
+    output_xmls_css,
     paths_output;
   mixin outputXHTMLs;
   
@@ -167,7 +168,7 @@ template outputHTML() {
         }
       }
     }
-    doc = xhtml_format.scroll_head(doc_matters.dochead_meta) ~ doc_html ~ xhtml_format.tail;
+    doc = xhtml_format.html_scroll_head(doc_matters.dochead_meta) ~ doc_html ~ xhtml_format.tail;
     scroll_write_output(doc_matters, doc);
   }
   void scroll_write_output(M,C)(
@@ -241,7 +242,7 @@ template outputHTML() {
             break;
           case 4:
             segment_filename = obj.segment_anchor_tag;
-            doc_html[segment_filename] ~= xhtml_format.seg_head(doc_matters.dochead_meta);
+            doc_html[segment_filename] ~= xhtml_format.html_seg_head(doc_matters.dochead_meta);
             foreach (top_level_heading; top_level_headings) {
               // writeln(top_level_heading);
               doc_html[segment_filename] ~= top_level_heading;
@@ -442,851 +443,17 @@ template outputHTML() {
       // handle error
     }
   }
-  auto html_css() {
-    string css;
-    css="/* SiSU css default stylesheet */
-    body {
-      color: black;
-      background: #ffffff;
-      background-color: #ffffff;
-    }
-    a:link {
-      color: #003399;
-      text-decoration: none;
-    }
-    a:visited {
-      color: #003399;
-      text-decoration: none;
-    }
-    a:hover {
-      color: #000000;
-      background-color: #f9f9aa;
-    }
-    a.lnkocn:link {
-      color: #777777;
-      text-decoration: none;
-    }
-    a:hover img {
-      background-color: #ffffff;
-    }
-    a:active {
-      color: #003399;
-      text-decoration: underline;
-    }
-    div {
-      margin-left: 0;
-      margin-right: 0;
-    }
-    div.p {
-      margin-left: 5%;
-      margin-right: 1%;
-    }
-    .norm, .bold, .verse, .group, .block, .alt {
-      line-height: 133%;
-      margin-left: 0em;
-      margin-right: 2em;
-      margin-top: 12px;
-      margin-bottom: 0px;
-      padding-left: 0em;
-      text-indent: 0em;
-    }
-    p, h0, h1, h2, h3, h4, h5, h6, h7 {
-      display: block;
-      font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-      font-size: 100%;
-      font-weight: normal;
-      line-height: 133%;
-      text-align: justify;
-      margin-left: 0em;
-      margin-right: 2em;
-      text-indent: 0mm;
-      margin-top: 0.8em;
-      margin-bottom: 0.8em;
-    }
-    /* indent */
-    p.norm { }
-    p.i1 {padding-left: 1em;}
-    p.i2 {padding-left: 2em;}
-    p.i3 {padding-left: 3em;}
-    p.i4 {padding-left: 4em;}
-    p.i5 {padding-left: 5em;}
-    p.i6 {padding-left: 6em;}
-    p.i7 {padding-left: 7em;}
-    p.i8 {padding-left: 8em;}
-    p.i9 {padding-left: 9em;}
-    /* hanging indent */
-    p[indent=\"h0i0\"] {
-      padding-left: 0em;
-      text-indent:  0em;
-    }
-    p[indent=\"h0i1\"] {
-      padding-left: 1em;
-      text-indent: -1em;
-    }
-    p[indent=\"h0i2\"] {
-      padding-left: 2em;
-      text-indent: -2em;
-    }
-    p[indent=\"h0i3\"] {
-      padding-left: 3em;
-      text-indent: -3em;
-    }
-    p[indent=\"h0i4\"] {
-      padding-left: 4em;
-      text-indent: -4em;
-    }
-    p[indent=\"h0i5\"] {
-      padding-left: 5em;
-      text-indent: -5em;
-    }
-    p[indent=\"h0i6\"] {
-      padding-left: 6em;
-      text-indent: -6em;
-    }
-    p[indent=\"h0i7\"] {
-      padding-left: 7em;
-      text-indent: -7em;
-    }
-    p[indent=\"h0i8\"] {
-      padding-left: 8em;
-      text-indent: -8em;
-    }
-    p[indent=\"h0i9\"] {
-      padding-left: 9em;
-      text-indent: -9em;
-    }
-    p[indent=\"h1i0\"] {
-      padding-left: 0em;
-      text-indent:  1em;
-    }
-    p[indent=\"h1i1\"] {
-      padding-left: 1em;
-      text-indent:  0em;
-    }
-    p[indent=\"h1i2\"] {
-      padding-left: 2em;
-      text-indent: -1em;
-    }
-    p[indent=\"h1i3\"] {
-      padding-left: 3em;
-      text-indent: -2em;
-    }
-    p[indent=\"h1i4\"] {
-      padding-left: 4em;
-      text-indent: -3em;
-    }
-    p[indent=\"h1i5\"] {
-      padding-left: 5em;
-      text-indent: -4em;
-    }
-    p[indent=\"h1i6\"] {
-      padding-left: 6em;
-      text-indent: -5em;
-    }
-    p[indent=\"h1i7\"] {
-      padding-left: 7em;
-      text-indent: -6em;
-    }
-    p[indent=\"h1i8\"] {
-      padding-left: 8em;
-      text-indent: -7em;
-    }
-    p[indent=\"h1i9\"] {
-      padding-left: 9em;
-      text-indent: -8em;
-    }
-    p[indent=\"h2i0\"] {
-      padding-left: 0em;
-      text-indent:  2em;
-    }
-    p[indent=\"h2i1\"] {
-      padding-left: 1em;
-      text-indent:  1em;
-    }
-    p[indent=\"h2i2\"] {
-      padding-left: 2em;
-      text-indent:  0em;
-    }
-    p[indent=\"h2i3\"] {
-      padding-left: 3em;
-      text-indent: -1em;
-    }
-    p[indent=\"h2i4\"] {
-      padding-left: 4em;
-      text-indent: -2em;
-    }
-    p[indent=\"h2i5\"] {
-      padding-left: 5em;
-      text-indent: -3em;
-    }
-    p[indent=\"h2i6\"] {
-      padding-left: 6em;
-      text-indent: -4em;
-    }
-    p[indent=\"h2i7\"] {
-      padding-left: 7em;
-      text-indent: -5em;
-    }
-    p[indent=\"h2i8\"] {
-      padding-left: 8em;
-      text-indent: -6em;
-    }
-    p[indent=\"h2i9\"] {
-      padding-left: 9em;
-      text-indent: -7em;
-    }
-    p[indent=\"h3i0\"] {
-      padding-left: 0em;
-      text-indent:  3em;
-    }
-    p[indent=\"h3i1\"] {
-      padding-left: 1em;
-      text-indent:  2em;
-    }
-    p[indent=\"h3i2\"] {
-      padding-left: 2em;
-      text-indent:  1em;
-    }
-    p[indent=\"h3i3\"] {
-      padding-left: 3em;
-      text-indent:  0em;
-    }
-    p[indent=\"h3i4\"] {
-      padding-left: 4em;
-      text-indent: -1em;
-    }
-    p[indent=\"h3i5\"] {
-      padding-left: 5em;
-      text-indent: -2em;
-    }
-    p[indent=\"h3i6\"] {
-      padding-left: 6em;
-      text-indent: -3em;
-    }
-    p[indent=\"h3i7\"] {
-      padding-left: 7em;
-      text-indent: -4em;
-    }
-    p[indent=\"h3i8\"] {
-      padding-left: 8em;
-      text-indent: -5em;
-    }
-    p[indent=\"h3i9\"] {
-      padding-left: 9em;
-      text-indent: -6em;
-    }
-    p[indent=\"h4i0\"] {
-      padding-left: 0em;
-      text-indent:  4em;
-    }
-    p[indent=\"h4i1\"] {
-      padding-left: 1em;
-      text-indent:  3em;
-    }
-    p[indent=\"h4i2\"] {
-      padding-left: 2em;
-      text-indent:  2em;
-    }
-    p[indent=\"h4i3\"] {
-      padding-left: 3em;
-      text-indent:  1em;
-    }
-    p[indent=\"h4i4\"] {
-      padding-left: 4em;
-      text-indent:  0em;
-    }
-    p[indent=\"h4i5\"] {
-      padding-left: 5em;
-      text-indent: -1em;
-    }
-    p[indent=\"h4i6\"] {
-      padding-left: 6em;
-      text-indent: -2em;
-    }
-    p[indent=\"h4i7\"] {
-      padding-left: 7em;
-      text-indent: -3em;
-    }
-    p[indent=\"h4i8\"] {
-      padding-left: 8em;
-      text-indent: -4em;
-    }
-    p[indent=\"h4i9\"] {
-      padding-left: 9em;
-      text-indent: -5em;
-    }
-    p[indent=\"h5i0\"] {
-      padding-left: 0em;
-      text-indent:  5em;
-    }
-    p[indent=\"h5i1\"] {
-      padding-left: 1em;
-      text-indent:  4em;
-    }
-    p[indent=\"h5i2\"] {
-      padding-left: 2em;
-      text-indent:  3em;
-    }
-    p[indent=\"h5i3\"] {
-      padding-left: 3em;
-      text-indent:  2em;
-    }
-    p[indent=\"h5i4\"] {
-      padding-left: 4em;
-      text-indent:  1em;
-    }
-    p[indent=\"h5i5\"] {
-      padding-left: 5em;
-      text-indent:  0em;
-    }
-    p[indent=\"h5i6\"] {
-      padding-left: 6em;
-      text-indent: -1em;
-    }
-    p[indent=\"h5i7\"] {
-      padding-left: 7em;
-      text-indent: -2em;
-    }
-    p[indent=\"h5i8\"] {
-      padding-left: 8em;
-      text-indent: -3em;
-    }
-    p[indent=\"h5i9\"] {
-      padding-left: 9em;
-      text-indent: -4em;
-    }
-    p[indent=\"h6i0\"] {
-      padding-left: 0em;
-      text-indent:  6em;
-    }
-    p[indent=\"h6i1\"] {
-      padding-left: 1em;
-      text-indent:  5em;
-    }
-    p[indent=\"h6i2\"] {
-      padding-left: 2em;
-      text-indent:  4em;
-    }
-    p[indent=\"h6i3\"] {
-      padding-left: 3em;
-      text-indent:  3em;
-    }
-    p[indent=\"h6i4\"] {
-      padding-left: 4em;
-      text-indent:  2em;
-    }
-    p[indent=\"h6i5\"] {
-      padding-left: 5em;
-      text-indent:  1em;
-    }
-    p[indent=\"h6i6\"] {
-      padding-left: 6em;
-      text-indent:  0em;
-    }
-    p[indent=\"h6i7\"] {
-      padding-left: 7em;
-      text-indent: -1em;
-    }
-    p[indent=\"h6i8\"] {
-      padding-left: 8em;
-      text-indent: -2em;
-    }
-    p[indent=\"h6i9\"] {
-      padding-left: 9em;
-      text-indent: -3em;
-    }
-    p[indent=\"h7i0\"] {
-      padding-left: 0em;
-      text-indent:  7em;
-    }
-    p[indent=\"h7i1\"] {
-      padding-left: 1em;
-      text-indent:  6em;
-    }
-    p[indent=\"h7i2\"] {
-      padding-left: 2em;
-      text-indent:  5em;
-    }
-    p[indent=\"h7i3\"] {
-      padding-left: 3em;
-      text-indent:  4em;
-    }
-    p[indent=\"h7i4\"] {
-      padding-left: 4em;
-      text-indent:  3em;
-    }
-    p[indent=\"h7i5\"] {
-      padding-left: 5em;
-      text-indent:  2em;
-    }
-    p[indent=\"h7i6\"] {
-      padding-left: 6em;
-      text-indent:  1em;
-    }
-    p[indent=\"h7i7\"] {
-      padding-left: 7em;
-      text-indent:  0em;
-    }
-    p[indent=\"h7i8\"] {
-      padding-left: 8em;
-      text-indent: -1em;
-    }
-    p[indent=\"h7i9\"] {
-      padding-left: 9em;
-      text-indent: -2em;
-    }
-    p[indent=\"h8i0\"] {
-      padding-left: 0em;
-      text-indent:  8em;
-    }
-    p[indent=\"h8i1\"] {
-      padding-left: 1em;
-      text-indent:  7em;
-    }
-    p[indent=\"h8i2\"] {
-      padding-left: 2em;
-      text-indent:  6em;
-    }
-    p[indent=\"h8i3\"] {
-      padding-left: 3em;
-      text-indent:  5em;
-    }
-    p[indent=\"h8i4\"] {
-      padding-left: 4em;
-      text-indent:  4em;
-    }
-    p[indent=\"h8i5\"] {
-      padding-left: 5em;
-      text-indent:  3em;
-    }
-    p[indent=\"h8i6\"] {
-      padding-left: 6em;
-      text-indent:  2em;
-    }
-    p[indent=\"h8i7\"] {
-      padding-left: 7em;
-      text-indent:  1em;
-    }
-    p[indent=\"h8i8\"] {
-      padding-left: 8em;
-      text-indent:  0em;
-    }
-    p[indent=\"h8i9\"] {
-      padding-left: 9em;
-      text-indent: -1em;
-    }
-    p[indent=\"h9i0\"] {
-      padding-left: 0em;
-      text-indent:  9em;
-    }
-    p[indent=\"h9i1\"] {
-      padding-left: 1em;
-      text-indent:  8em;
-    }
-    p[indent=\"h9i2\"] {
-      padding-left: 2em;
-      text-indent:  7em;
-    }
-    p[indent=\"h9i3\"] {
-      padding-left: 3em;
-      text-indent:  6em;
-    }
-    p[indent=\"h9i4\"] {
-      padding-left: 4em;
-      text-indent:  5em;
-    }
-    p[indent=\"h9i5\"] {
-      padding-left: 5em;
-      text-indent:  4em;
-    }
-    p[indent=\"h9i6\"] {
-      padding-left: 6em;
-      text-indent:  3em;
-    }
-    p[indent=\"h9i7\"] {
-      padding-left: 7em;
-      text-indent:  2em;
-    }
-    p[indent=\"h9i8\"] {
-      padding-left: 8em;
-      text-indent:  1em;
-    }
-    p[indent=\"h9i9\"] {
-      padding-left: 9em;
-      text-indent:  0em;
-    }
-    p.block { }
-    p.group { }
-    p.alt { }
-    p.verse {
-      margin-bottom: 6px;
-    }
-    p.code {
-      font-family: inconsolata, andale mono, courier new, courier, monospace;
-      font-size: 90%;
-      text-align: left;
-      background-color: #eeeeee;
-    }
-    p.caption {
-      text-align: left;
-      font-size: 80%;
-      display: inline;
-    }
-    p.endnote {
-      font-size: 96%;
-      line-height: 120%;
-      text-align: left;
-      margin-right: 15mm;
-    }
-    p.endnote_indent {
-      font-size: 96%;
-      line-height: 120%;
-      text-align: left;
-      margin-left: 2em;
-      margin-right: 15mm;
-    }
-    p.center {
-      text-align: center;
-    }
-    p.bold {
-      font-weight: bold;
-    }
-    p.bold_left {
-      font-weight: bold;
-      text-align: left;
-    }
-    p.centerbold {
-      text-align: center;
-      font-weight: bold;
-    }
-    p.em {
-      font-weight: bold;
-      font-style: normal;
-      background: #fff3b6;
-    }
-    p.small {
-      font-size: 80%;
-      margin-top: 0px;
-      margin-bottom: 0px;
-      margin-right: 6px;
-      text-align: left;
-    }
-    .tiny, .tiny_left, .tiny_right, .tiny_center {
-      font-size: 10px;
-      margin-top: 0px;
-      margin-bottom: 0px;
-      color: #777777;
-      margin-right: 6px;
-      text-align: left;
-    }
-    p.tiny { }
-    p.tiny_left {
-      margin-left: 0px;
-      margin-right: 0px;
-      text-align: left;
-    }
-    p.tiny_right {
-      margin-right: 1em;
-      text-align: right;
-    }
-    p.tiny_center {
-      margin-left: 0px;
-      margin-right: 0px;
-      text-align: center;
-    }
-    p.concordance_word {
-      line-height: 150%;
-      font-weight: bold;
-      display: inline;
-      margin-top: 4px;
-      margin-bottom: 1px;
-    }
-    p.concordance_count {
-      font-size: 80%;
-      color: #777777;
-      display: inline;
-      margin-left: 0em;
-    }
-    p.concordance_object {
-      font-size: 80%;
-      line-height: 120%;
-      text-align: left;
-      margin-left: 3em;
-      margin-top: 1px;
-      margin-bottom: 3px;
-    }
-    p.book_index_lev1 {
-      line-height: 100%;
-      margin-top: 4px;
-      margin-bottom: 1px;
-    }
-    p.book_index_lev2 {
-      line-height: 100%;
-      text-align: left;
-      margin-left: 3em;
-      margin-top: 1px;
-      margin-bottom: 3px;
-    }
-    tt {
-      font-family: inconsolata, andale mono, courier new, courier, monospace;
-      background-color: #eeeeee;
-    }
-    label.ocn {
-      width: 2%;
-      float: right;
-      top: 0;
-      font-size: 10px;
-      margin-top: 0px;
-      margin-bottom: 5px;
-      color: #777777;
-      margin-right: 5px;
-      text-align: right;
-      background-color: #ffffff;
-    }
-    table { }
-    tr { }
-    th,td {
-      vertical-align: top;
-      text-align: left;
-    }
-    th {
-      font-weight: bold;
-    }
-    p.left,th.left,td.left {
-      text-align: left;
-    }
-    p.small_left,th.small_left,td.small_left {
-      text-align: left;
-      font-size: 80%;
-    }
-    p.right,th.right,td.right {
-      text-align: right;
-    }
-    ul, li {
-      list-style-type: none;
-      list-style: none;
-      padding-left: 20px;
-      display: block;
-      font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-      font-weight: normal;
-      line-height: 150%;
-      text-align: left;
-      text-indent: 0mm;
-      margin-left: 1em;
-      margin-right: 2em;
-      margin-top: 3px;
-      margin-bottom: 3px;
-    }
-    li {
-      background: url(../image_sys/bullet_09.png) no-repeat 0px 6px;
-    }
-    ul {
-    }
-    h0, h1, h2, h3, h4, h5, h6, h7 {
-      font-weight: bold;
-      line-height: 120%;
-      text-align: left;
-      margin-top: 20px;
-      margin-bottom: 10px;
-    }
-    h4.norm, h5.norm, h6.norm, h7.norm {
-      margin-top: 10px;
-      margin-bottom: 0px;
-    }
-    h0 { font-size: 125%; }
-    h1 { font-size: 120%; }
-    h2 { font-size: 115%; }
-    h3 { font-size: 110%; }
-    h4 { font-size: 105%; }
-    h5 { font-size: 100%; }
-    h6 { font-size: 100%; }
-    h7 { font-size: 100%; }
-    h1.i {margin-left: 2em;}
-    h2.i {margin-left: 3em;}
-    h3.i {margin-left: 4em;}
-    h4.i {margin-left: 5em;}
-    h5.i {margin-left: 6em;}
-    h6.i {margin-left: 7em;}
-    h7.i {margin-left: 8em;}
-    h8.i {margin-left: 9em;}
-    h9.i {margin-left: 10em;}
-    .toc {
-      font-weight: normal;
-      margin-top: 6px;
-      margin-bottom: 6px;
-    }
-    h0.toc {
-      margin-left: 1em;
-      font-size: 120%;
-      line-height: 150%;
-    }
-    h1.toc {
-      margin-left: 1em;
-      font-size: 115%;
-      line-height: 150%;
-    }
-    h2.toc {
-      margin-left: 2em;
-      font-size: 110%;
-      line-height: 140%;
-    }
-    h3.toc {
-      margin-left: 3em;
-      font-size: 105%;
-      line-height: 120%;
-    }
-    h4.toc {
-      margin-left: 4em;
-      font-size: 100%;
-      line-height: 120%;
-    }
-    h5.toc {
-      margin-left: 5em;
-      font-size: 95%;
-      line-height: 110%;
-    }
-    h6.toc {
-      margin-left: 6em;
-      font-size: 90%;
-      line-height: 110%;
-    }
-    h7.toc {
-      margin-left: 7em;
-      font-size: 85%;
-      line-height: 100%;
-    }
-    .subtoc {
-      margin-right: 34%;
-      font-weight: normal;
-    }
-    h5.subtoc {
-      margin-left: 2em;
-      font-size: 80%;
-      margin-top: 2px;
-      margin-bottom: 2px;
-    }
-    h6.subtoc {
-      margin-left: 3em;
-      font-size: 75%;
-      margin-top: 0px;
-      margin-bottom: 0px;
-    }
-    h7.subtoc {
-      margin-left: 4em;
-      font-size: 70%;
-      margin-top: 0px;
-      margin-bottom: 0px;
-    }
-    div.substance {
-      width: 100%;
-      background-color: #ffffff;
-    }
-    div.ocn {
-      width: 5%;
-      float: right;
-      top: 0;
-      background-color: #ffffff;
-    }
-    div.endnote {
-      width: 95%;
-      background-color: #fffffff;
-    }
-    div.toc {
-      position: absolute;
-      float: left;
-      margin: 0;
-      padding: 0;
-      padding-top: 0.5em;
-      border: 0;
-      width: 13em;
-      background-color: #eeeeee;
-      margin-right:1em;
-    }
-    div.summary {
-      margin: 0;
-      padding: 0;
-      border-left: 13em solid #eeeeee;
-      padding-left: 1em;
-      background-color: #eeeeee;
-    }
-    div.content, div.main_column {
-      margin: 0;
-      padding: 0;
-      border-left: 13em solid #ffffff;
-      padding-left: 1em;
-      padding-right: 1em;
-    }
-    div.content0, div.main_column0 {
-      margin: 0;
-      padding: 0;
-      border-left: 0% solid #ffffff;
-      padding-left: 5%;
-    }
-    div.scroll {
-      margin: 0;
-      padding: 0;
-      padding-left: 1em;
-      padding-right: 1em;
-    }
-    div.content:after {
-      content:' ';
-      clear:both;
-      display:block;
-      height:0;
-      overflow:hidden
-    }
-    div.footer {
-      clear:left;
-      padding: 0.5em;
-      font-size: 80%;
-      margin: 0;
-    }
-    div.toc ul {
-      list-style: none;
-      padding: 0;
-      margin: 0;
-    }
-    div.toc li ul a, li ul span.currentlink
-    {
-      font-weight: normal;
-      font-size: 90%;
-      padding-left: 2em;
-      background-color: #eeeeee;
-    }
-    div.toc a, span.currentlink{
-      display:block;
-      text-decoration: none;
-      padding-left: 0.5em;
-      color: #0000aa;
-    }
-    hr {
-      width: 90%;
-    }
-    span.currentlink {
-      text-decoration: none;
-      background-color: #aaaaf9;
-    }
-    div.toc a:visited {
-      color: #0000aa;
-    }
-    div.toc a:hover {
-      color: #000000;
-      background-color: #f9f9aa;
-    }";
-    return css;
-  }
-  auto css_write() {
-    auto pth_css= "_sisu/css";
-    auto pth_css_fn= pth_css ~ "/html.css";
+  void css(M)(
+    auto return ref M          doc_matters,
+  ) {
+    auto css = SiSUcss();
+    auto pth_html = SiSUpathsHTML!()(doc_matters.src_path_info, doc_matters.language);
     try {
-      if (!exists(pth_css)) {
-        pth_css.mkdirRecurse;
+      if (!exists(pth_html.css)) {
+        (pth_html.css).mkdirRecurse;
       }
-      auto f = File(pth_css_fn, "w");
-      f.writeln(html_css);
-      // foreach (o; doc) {
-      //   f.writeln(o);
-      // }
+      auto f = File(pth_html.fn_css, "w");
+      f.writeln(css.html_css);
     }
     catch (ErrnoException ex) {
       // Handle error