aboutsummaryrefslogtreecommitdiffhomepage
path: root/org
diff options
context:
space:
mode:
authorRalph Amissah <ralph@amissah.com>2017-08-07 08:01:27 -0400
committerRalph Amissah <ralph@amissah.com>2019-04-10 15:14:14 -0400
commitdfd85dee88c5b6061a573126b21319ab6bebe03c (patch)
tree6c7627a5817a0eee8fbfe8a7401a276df1c76faa /org
parenthtml css using grid & flex (remove tables) (diff)
css, separate files and reorganization
- separate files for html seg, scroll & epub - output_xmls_css.org, reorganized org file
Diffstat (limited to 'org')
-rw-r--r--org/default_paths.org7
-rw-r--r--org/output_xmls.org10
-rw-r--r--org/output_xmls_css.org882
3 files changed, 555 insertions, 344 deletions
diff --git a/org/default_paths.org b/org/default_paths.org
index 6d6c1db..ddf9bfe 100644
--- a/org/default_paths.org
+++ b/org/default_paths.org
@@ -316,8 +316,11 @@ template SiSUpathsHTML() {
string css() {
return (out_pth.output_root).chainPath("css").array;
}
- string fn_css() {
- return css.chainPath("html.css").array;
+ string fn_seg_css() {
+ return css.chainPath("html_seg.css").array;
+ }
+ string fn_scroll_css() {
+ return css.chainPath("html_scroll.css").array;
}
string seg(string fn_src) {
return base.chainPath(base_filename(fn_src)).array;
diff --git a/org/output_xmls.org b/org/output_xmls.org
index a89cc88..1333969 100644
--- a/org/output_xmls.org
+++ b/org/output_xmls.org
@@ -329,7 +329,9 @@ auto html_head(Dm)(
: ", " ~ doc_matters.dochead_meta["creator"]["author"],
header_metadata(doc_matters),
((type == "seg") ? "../../../" : "../../") ~ "image/rb7.ico",
- ((type == "seg") ? "../../../" : "../../") ~ "css/html.css",
+ ((type == "seg")
+ ? "../../../css/html_seg.css"
+ : "../../css/html_scroll.css"),
doc_matters.language,
site_info_button(doc_matters),
inline_search_form(doc_matters),
@@ -1777,8 +1779,10 @@ void css(M)(
if (!exists(pth_html.css)) {
(pth_html.css).mkdirRecurse;
}
- auto f = File(pth_html.fn_css, "w");
- f.writeln(css.html_css);
+ auto f = File(pth_html.fn_seg_css, "w");
+ f.writeln(css.html_seg_css);
+ f = File(pth_html.fn_scroll_css, "w");
+ f.writeln(css.html_scroll_css);
}
catch (ErrnoException ex) {
// Handle error
diff --git a/org/output_xmls_css.org b/org/output_xmls_css.org
index 574d562..7bef1dd 100644
--- a/org/output_xmls_css.org
+++ b/org/output_xmls_css.org
@@ -25,16 +25,29 @@
module sdp.output.xmls_css;
template SiSUcss() {
auto SiSUcss() {
- string css_shared="
+ string _css_html_seg="
<<css_shared>>
+<<css_html_seg>>
+";
+ string _css_html_scroll="
+<<css_shared>>
+<<css_html_scroll>>
+";
+ string _css_epub="
+<<css_shared>>
+<<css_epub>>
";
struct _css {
- auto html_css() {
- string _css = "/* SiSU css html stylesheet */\n" ~ css_shared;
+ auto html_seg_css() {
+ string _css = "/* SiSU css html seg stylesheet */\n" ~ _css_html_seg;
+ return _css;
+ }
+ auto html_scroll_css() {
+ string _css = "/* SiSU css html scroll stylesheet */\n" ~ _css_html_scroll;
return _css;
}
auto epub_css() {
- string _css = "/* SiSU css epub stylesheet */\n" ~ css_shared;
+ string _css = "/* SiSU css epub stylesheet */\n" ~ _css_epub;
return _css;
}
}
@@ -43,7 +56,9 @@ template SiSUcss() {
}
#+END_SRC
-** shared_css
+** css
+*** html shared
+**** general
#+name: css_shared
#+BEGIN_SRC css
@@ -55,121 +70,17 @@ template SiSUcss() {
height: 100vh;
background-color: #ffffff;
}
- /* flex */
- .flex-menu-bar {
- display: -webkit-flex;
- display: flex;
- -webkit-flex-wrap: wrap;
- -webkit-align-items: center;
- align-items: center;
- width: 100%;
- background-color: #ffffff;
- }
- .flex-menu-option {
- background-color: white;
- margin: 8px;
- }
- .flex-list {
- display: -webkit-flex;
- display: flex;
- -webkit-align-items: center;
- display: block;
- align-items: center;
- width: 100%;
- background-color: #ffffff;
- }
- .flex-list-item {
- background-color: white;
- margin: 4px;
- }
- /* grid */
- .wrapper {
- display: grid;
- grid-template-columns: 100%;
- grid-template-areas:
- \"headband\"
- \"doc_header\"
- \"doc_title\"
- \"doc_toc\"
- \"doc_prefix\"
- \"doc_intro\"
- \"doc_body\"
- \"doc_endnotes\"
- \"doc_glossary\"
- \"doc_biblio\"
- \"doc_bookindex\"
- \"doc_blurb\"
- \"doc_suffix\";
- margin: 0px;
- padding: 0px;
- background-color: #ffffff;
- }
- .delimit {
- border-style: none;
- border-color: white;
- padding: 10px;
- }
- .headband {
- grid-area: headband;
- background-color: #ffffff;
- }
- .doc_header {
- grid-area: doc_header;
- }
- .doc_title {
- grid-area: doc_title;
- }
- .doc_toc {
- grid-area: doc_toc;
- }
- .doc_prefix {
- grid-area: doc_prefix;
- }
- .doc_intro {
- grid-area: doc_intro;
- }
- .doc_body {
- grid-area: doc_body;
- }
- .doc_endnotes {
- grid-area: doc_endnotes;
- }
- .doc_glossary {
- grid-area: doc_glossary;
- }
- .doc_biblio {
- grid-area: doc_biblio;
- }
- .doc_bookindex {
- grid-area: doc_bookindex;
- }
- .doc_blurb {
- grid-area: doc_blurb;
- }
- .doc_suffix {
- grid-area: doc_suffix;
- }
- .nav-ul {
- list-style: none;
- float: left;
- }
- .nav-li {
- float: left;
- padding-right: 0.7em;
- }
- .nav-li a {
- text-decoration: none;
- color: white;
- }
- footer {
- background-color: #00704e;
- }
- /* regular */
body {
color: black;
background: #ffffff;
background-color: #ffffff;
}
+#+END_SRC
+
+**** link
+
+#+name: css_shared
+#+BEGIN_SRC css
a:link {
color: #003399;
text-decoration: none;
@@ -193,6 +104,12 @@ template SiSUcss() {
color: #003399;
text-decoration: underline;
}
+#+END_SRC
+
+**** div
+
+#+name: css_shared
+#+BEGIN_SRC css
div {
margin-left: 0;
margin-right: 0;
@@ -201,6 +118,114 @@ template SiSUcss() {
margin-left: 5%;
margin-right: 1%;
}
+ 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%;
+ margin-top: 1.8em;
+ margin-bottom: 1.8em;
+ }
+ span.currentlink {
+ text-decoration: none;
+ background-color: #aaaaf9;
+ }
+ div.toc a:visited {
+ color: #0000aa;
+ }
+ div.toc a:hover {
+ color: #000000;
+ background-color: #f9f9aa;
+ }
+ nav#toc ol {
+ list-style-type: none;
+ }
+#+END_SRC
+
+**** paragraphs headings blocks
+***** misc
+
+#+name: css_shared
+#+BEGIN_SRC css
.norm, .bold, .verse, .group, .block, .alt {
line-height: 133%;
margin-left: 0em;
@@ -223,8 +248,142 @@ template SiSUcss() {
margin-top: 0.8em;
margin-bottom: 0.8em;
}
+#+END_SRC
+
+***** paragraph general
+
+#+name: css_shared
+#+BEGIN_SRC css
/* spaced */
p.spaced { white-space: pre; }
+ p.block {
+ white-space: pre;
+ }
+ p.group { }
+ p.alt { }
+ p.verse {
+ white-space: pre;
+ margin-bottom: 6px;
+ }
+ p.code {
+ font-family: inconsolata, andale mono, courier new, courier, monospace;
+ font-size: 90%;
+ text-align: left;
+ background-color: #eeeeee;
+ white-space: pre;
+ margin-top: 0px;
+ margin-bottom: 0px;
+ }
+ 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;
+ }
+#+END_SRC
+
+***** paragraph indent
+
+#+name: css_shared
+#+BEGIN_SRC css
/* indent */
p.norm { }
p.i1 { padding-left: 1em; }
@@ -637,128 +796,12 @@ template SiSUcss() {
padding-left: 9em;
text-indent: 0em;
}
- p.block {
- white-space: pre;
- }
- p.group { }
- p.alt { }
- p.verse {
- white-space: pre;
- margin-bottom: 6px;
- }
- p.code {
- font-family: inconsolata, andale mono, courier new, courier, monospace;
- font-size: 90%;
- text-align: left;
- background-color: #eeeeee;
- white-space: pre;
- margin-top: 0px;
- margin-bottom: 0px;
- }
- 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;
- }
+#+END_SRC
+
+***** misc including tables & lists
+
+#+name: css_shared
+#+BEGIN_SRC css
note { white-space: pre; }
label.ocn {
width: 2%;
@@ -815,6 +858,12 @@ template SiSUcss() {
}
ul {
}
+#+END_SRC
+
+***** headings
+
+#+name: css_shared
+#+BEGIN_SRC css
h0, h1, h2, h3, h4, h5, h6, h7 {
font-weight: bold;
line-height: 120%;
@@ -911,108 +960,13 @@ template SiSUcss() {
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%;
- margin-top: 1.8em;
- margin-bottom: 1.8em;
- }
- span.currentlink {
- text-decoration: none;
- background-color: #aaaaf9;
- }
- div.toc a:visited {
- color: #0000aa;
- }
- div.toc a:hover {
- color: #000000;
- background-color: #f9f9aa;
- }
- /* in toc no list numbering */
- nav#toc ol {
- list-style-type: none;
- }
+#+END_SRC
+
+*** html seg
+**** previous next
+
+#+name: css_html_seg
+#+BEGIN_SRC css
.icon-bar {
width: 100%;
overflow: auto;
@@ -1069,3 +1023,253 @@ template SiSUcss() {
}
.arrow { fill: #333333; }
#+END_SRC
+
+**** flex
+
+#+name: css_html_seg
+#+BEGIN_SRC css
+ /* flex */
+ .flex-menu-bar {
+ display: -webkit-flex;
+ display: flex;
+ -webkit-flex-wrap: wrap;
+ -webkit-align-items: center;
+ align-items: center;
+ width: 100%;
+ background-color: #ffffff;
+ }
+ .flex-menu-option {
+ background-color: white;
+ margin: 8px;
+ }
+ .flex-list {
+ display: -webkit-flex;
+ display: flex;
+ -webkit-align-items: center;
+ display: block;
+ align-items: center;
+ width: 100%;
+ background-color: #ffffff;
+ }
+ .flex-list-item {
+ background-color: white;
+ margin: 4px;
+ }
+#+END_SRC
+
+**** TODO grid
+
+Consider what if anything should be used here
+
+#+name: css_html_seg
+#+BEGIN_SRC css
+ /* grid */
+ .wrapper {
+ display: grid;
+ grid-template-columns: 100%;
+ grid-template-areas:
+ \"headband\"
+ \"doc_header\"
+ \"doc_title\"
+ \"doc_toc\"
+ \"doc_prefix\"
+ \"doc_intro\"
+ \"doc_body\"
+ \"doc_endnotes\"
+ \"doc_glossary\"
+ \"doc_biblio\"
+ \"doc_bookindex\"
+ \"doc_blurb\"
+ \"doc_suffix\";
+ margin: 0px;
+ padding: 0px;
+ background-color: #ffffff;
+ }
+ .delimit {
+ border-style: none;
+ border-color: white;
+ padding: 10px;
+ }
+ .headband {
+ grid-area: headband;
+ background-color: #ffffff;
+ }
+ .doc_header {
+ grid-area: doc_header;
+ }
+ .doc_title {
+ grid-area: doc_title;
+ }
+ .doc_toc {
+ grid-area: doc_toc;
+ }
+ .doc_prefix {
+ grid-area: doc_prefix;
+ }
+ .doc_intro {
+ grid-area: doc_intro;
+ }
+ .doc_body {
+ grid-area: doc_body;
+ }
+ .doc_endnotes {
+ grid-area: doc_endnotes;
+ }
+ .doc_glossary {
+ grid-area: doc_glossary;
+ }
+ .doc_biblio {
+ grid-area: doc_biblio;
+ }
+ .doc_bookindex {
+ grid-area: doc_bookindex;
+ }
+ .doc_blurb {
+ grid-area: doc_blurb;
+ }
+ .doc_suffix {
+ grid-area: doc_suffix;
+ }
+ .nav-ul {
+ list-style: none;
+ float: left;
+ }
+ .nav-li {
+ float: left;
+ padding-right: 0.7em;
+ }
+ .nav-li a {
+ text-decoration: none;
+ color: white;
+ }
+ footer {
+ background-color: #00704e;
+ }
+#+END_SRC
+
+*** html scroll
+**** flex
+
+#+name: css_html_scroll
+#+BEGIN_SRC css
+ /* flex */
+ .flex-menu-bar {
+ display: -webkit-flex;
+ display: flex;
+ -webkit-flex-wrap: wrap;
+ -webkit-align-items: center;
+ align-items: center;
+ width: 100%;
+ background-color: #ffffff;
+ }
+ .flex-menu-option {
+ background-color: white;
+ margin: 8px;
+ }
+ .flex-list {
+ display: -webkit-flex;
+ display: flex;
+ -webkit-align-items: center;
+ display: block;
+ align-items: center;
+ width: 100%;
+ background-color: #ffffff;
+ }
+ .flex-list-item {
+ background-color: white;
+ margin: 4px;
+ }
+#+END_SRC
+
+**** grid
+
+#+name: css_html_scroll
+#+BEGIN_SRC css
+ /* grid */
+ .wrapper {
+ display: grid;
+ grid-template-columns: 100%;
+ grid-template-areas:
+ \"headband\"
+ \"doc_header\"
+ \"doc_title\"
+ \"doc_toc\"
+ \"doc_prefix\"
+ \"doc_intro\"
+ \"doc_body\"
+ \"doc_endnotes\"
+ \"doc_glossary\"
+ \"doc_biblio\"
+ \"doc_bookindex\"
+ \"doc_blurb\"
+ \"doc_suffix\";
+ margin: 0px;
+ padding: 0px;
+ background-color: #ffffff;
+ }
+ .delimit {
+ border-style: none;
+ border-color: white;
+ padding: 10px;
+ }
+ .headband {
+ grid-area: headband;
+ background-color: #ffffff;
+ }
+ .doc_header {
+ grid-area: doc_header;
+ }
+ .doc_title {
+ grid-area: doc_title;
+ }
+ .doc_toc {
+ grid-area: doc_toc;
+ }
+ .doc_prefix {
+ grid-area: doc_prefix;
+ }
+ .doc_intro {
+ grid-area: doc_intro;
+ }
+ .doc_body {
+ grid-area: doc_body;
+ }
+ .doc_endnotes {
+ grid-area: doc_endnotes;
+ }
+ .doc_glossary {
+ grid-area: doc_glossary;
+ }
+ .doc_biblio {
+ grid-area: doc_biblio;
+ }
+ .doc_bookindex {
+ grid-area: doc_bookindex;
+ }
+ .doc_blurb {
+ grid-area: doc_blurb;
+ }
+ .doc_suffix {
+ grid-area: doc_suffix;
+ }
+ .nav-ul {
+ list-style: none;
+ float: left;
+ }
+ .nav-li {
+ float: left;
+ padding-right: 0.7em;
+ }
+ .nav-li a {
+ text-decoration: none;
+ color: white;
+ }
+ footer {
+ background-color: #00704e;
+ }
+#+END_SRC
+*** epub xhtml
+
+#+name: css_epub
+#+BEGIN_SRC css
+#+END_SRC