diff --git a/README.md b/README.md index 8b4524e..c3299e7 100644 --- a/README.md +++ b/README.md @@ -9,8 +9,8 @@ The tools used in the implementation of _jqt_ are: * [Pandoc](http://pandoc.org/), a universal document converter. * [Bash](https://www.gnu.org/software/bash/), [sed](https://www.gnu.org/software/sed/) and other shell tools. -If you want to learn how to use _jqt_ consult the documentation at -. The documentation is generated using _jqt_ in +If you want to learn how to use _jqt_ visit the site +. The site pages are generated using _jqt_ in the [`docs`](./docs/) folder of this repository. If you are interested in _jq_ you can see also [JBOL](https://fadado.github.io/jbol/), a related project with a collection of modules for the _jq_ language. @@ -43,7 +43,7 @@ are: ### Installation -In systems with the GNU software installed tools as [Bash](https://www.gnu.org/software/bash/), +In systems with the GNU software installed tools such as [Bash](https://www.gnu.org/software/bash/), [sed](https://www.gnu.org/software/sed/) and other shell tools are installed by default. To use _jqt_ you must install additional tools like [GPP](https://logological.org/gpp) or [Pandoc](http://pandoc.org/); for example, in recent _Fedora Linux_ distributions @@ -84,7 +84,7 @@ another `jqt` uses. ### Documentation -The directory [`docs`](./docs/) contains the documentation for _jqt_, and is in itself a subproject with his +The directory [`docs`](./docs/) contains the source files for _jqt_ documentation, and is in itself a subproject with his own makefile. Please see the directory [`docs`](./docs/) for all information on this subproject. diff --git a/docs/Makefile b/docs/Makefile index 477c7af..7c8609a 100644 --- a/docs/Makefile +++ b/docs/Makefile @@ -56,6 +56,7 @@ Destination := /tmp/jqt # Input files directories Assets := ./assets Blocks := ./blocks +Layouts := ./blocks Content := ./content Data := ./data Styles := ./styles @@ -65,7 +66,7 @@ Common := \ $(Metadata)/config.json \ $(Metadata)/snippets.json \ $(Blocks)/*/markup.html \ - $(Blocks)/main.html \ + $(Layouts)/page.html \ $(Blocks)/filters.jq \ $(Content)/LINKS.txt \ $(Content)/macros.m \ @@ -130,21 +131,22 @@ DETAILS := sed \ $(Destination)/index.html: $(Content)/home.md $(Common) \ | $(Destination) $(info ==> $@) - $(JQT) -d $< $(Blocks)/main.html > $@ + $(JQT) -d $< $(Layouts)/page.html > $@ $(foreach p,$(Pages),$(Destination)/$(p).html): $(Content)/FLOW.txt $(Content)/opt/*.txt $(Destination)/index.html $(Destination)/structure.html: $(Content)/EXAMPLE.txt define Target -$(Destination)/$(1).html: $(Content)/$(1).md $(Blocks)/$(2).html $(Common) \ +$(Destination)/$(1).html: $(Content)/$(1).md $(Layouts)/$(2).html $(Common) \ | $(Destination) $$(info ==> $$@) - $(JQT) -d $$< $(Blocks)/$(2).html | $(DETAILS) > $$@ + $(JQT) -d $$< $(Layouts)/$(2).html | $(DETAILS) > $$@ endef -$(foreach p,$(Pages),$(eval $(call Target,$(p),page))) +$(foreach p,$(Pages),$(eval $(call Target,$(p),page-toc))) -$(Destination)/styles.css: $(Styles)/*.css $(Styles)/new/*.css $(Blocks)/*/*style.css $(Styles)/macros.m +TOPCSS=$(Styles)/page.css +$(Destination)/styles.css: $(TOPCSS) $(Styles)/*.css $(Styles)/milligram/*.css $(Blocks)/*/*style.css $(Styles)/bem.m $(info ==> $@) jqt -P CSS-min -I$(Styles) <$< >$@ diff --git a/docs/blocks/body/_toc/markup.html b/docs/blocks/body/_toc/markup.html new file mode 100644 index 0000000..048fbf7 --- /dev/null +++ b/docs/blocks/body/_toc/markup.html @@ -0,0 +1,10 @@ +<####################################################################### + # Body with TOC + ######################################################################>& +
+ <%include blocks/toc/markup.html> + <%include blocks/content/markup.html> +
+<# +vim:ts=2:sw=2:ai:et:fileencoding=utf8:syntax=html +#>& diff --git a/docs/blocks/body/markup.html b/docs/blocks/body/markup.html index 2a41388..640e12d 100644 --- a/docs/blocks/body/markup.html +++ b/docs/blocks/body/markup.html @@ -1,12 +1,8 @@ <####################################################################### - # Body + # Body simple ######################################################################>&
- <%ifndef BODY_BLOCK>& <%include blocks/content/markup.html>& - <%else>& - <%call BODY_BLOCK> - <%endif>&
<# vim:ts=2:sw=2:ai:et:fileencoding=utf8:syntax=html diff --git a/docs/blocks/container/markup.html b/docs/blocks/container/markup.html deleted file mode 100644 index abaefd3..0000000 --- a/docs/blocks/container/markup.html +++ /dev/null @@ -1,12 +0,0 @@ -<####################################################################### - # Document body - ######################################################################>& - - <%include blocks/header/markup.html>& - <%include blocks/body/markup.html>& - <%include blocks/footer/markup.html>& - <%partial analytics 'UA-82432866-1'>& - -<# -vim:ts=2:sw=2:ai:et:fileencoding=utf8:syntax=html -#>& diff --git a/docs/blocks/content/style.css b/docs/blocks/content/style.css index 3b76fb6..dd681cd 100644 --- a/docs/blocks/content/style.css +++ b/docs/blocks/content/style.css @@ -3,7 +3,7 @@ //////////////////////////////////////////////////////////////////////// &SEL{$content} h2:target::after, -&SEL{$content} h2:target::after, +&SEL{$content} h3:target::after, &SEL{$content} h4:target::after { content: " §"; color: &ColorQuaternary; diff --git a/docs/blocks/main.html b/docs/blocks/main.html deleted file mode 100644 index b538813..0000000 --- a/docs/blocks/main.html +++ /dev/null @@ -1,30 +0,0 @@ -<# Default layout #>& - - - - -<# - # Meta elements - #> - -<# Document title and related metadata #> - jqt · {{.page.title}} - - - -<# More metadata #> - - -<# Presentation #> - - - {{.page._highlight}} - -<# - # Document body - #> -<%include blocks/container/markup.html>& - -<# -vim:ts=2:sw=2:ai:et:fileencoding=utf8:syntax=html -#> diff --git a/docs/blocks/page-toc.html b/docs/blocks/page-toc.html new file mode 100644 index 0000000..9e7cbc9 --- /dev/null +++ b/docs/blocks/page-toc.html @@ -0,0 +1,14 @@ +<# Page with toc markup #>& +<# + # Main page block for content + #>& +<%define BODY_BLOCK + <%include blocks/body/_toc/markup.html> +>& +<# + # Inherit default layout + #>& +<%include blocks/page.html>& +<# +vim:ts=2:sw=2:ai:et:fileencoding=utf8:syntax=perl +#>& diff --git a/docs/blocks/page.html b/docs/blocks/page.html index 87537e3..008e4e7 100644 --- a/docs/blocks/page.html +++ b/docs/blocks/page.html @@ -1,15 +1,39 @@ -<# Layout for documentation pages #>& +<# Top-level page markup #>& + + + + <# - # Main page block for content - #>& -<%define BODY_BLOCK - <%include blocks/toc/markup.html> - <%include blocks/content/markup.html> ->& + # Meta elements + #> + +<# Document title and related metadata #> + jqt · {{.page.title}} + + + +<# More metadata #> + + +<# Presentation #> + + + {{.page._highlight}} + <# - # Inherit default layout - #>& -<%include blocks/main.html>& + # Document body + #> + + <%include blocks/header/markup.html>& +<%ifndef BODY_BLOCK>& + <%include blocks/body/markup.html>& +<%else>& + <%call BODY_BLOCK> +<%endif>& + <%include blocks/footer/markup.html>& + <%partial analytics 'UA-82432866-1'>& + + <# vim:ts=2:sw=2:ai:et:fileencoding=utf8:syntax=html -#>& +#> diff --git a/docs/content/content.md b/docs/content/content.md index 36b3a91..99e0948 100644 --- a/docs/content/content.md +++ b/docs/content/content.md @@ -1,5 +1,5 @@ --- -layout: page +layout: page-toc title: Authoring content in jqt using MarkDown description: jqt transforms MarkDown documents to HTML using Pandoc. keywords: jqt, markdown, pandoc, gpp, preprocessing, authoring content diff --git a/docs/content/data.md b/docs/content/data.md index e92efee..e5186bb 100644 --- a/docs/content/data.md +++ b/docs/content/data.md @@ -1,5 +1,5 @@ --- -layout: page +layout: page-toc title: Managing the data model with jqt description: jqt combines one template with one MarkDown document and a data model. keywords: jqt, JSON, YAML, gpp, preprocessing, data model diff --git a/docs/content/engine.md b/docs/content/engine.md index f137cb9..dfa6e34 100644 --- a/docs/content/engine.md +++ b/docs/content/engine.md @@ -1,5 +1,5 @@ --- -layout: page +layout: page-toc title: The jqt template engine description: jqt orchestrates several shell utilities to transform MarkDown text and YAML or JSON data into a final HTML page. keywords: jqt, jq, YAML, gpp, preprocessing, template engine diff --git a/docs/content/home.md b/docs/content/home.md index a04e108..8042c57 100644 --- a/docs/content/home.md +++ b/docs/content/home.md @@ -1,5 +1,5 @@ --- -layout: default +layout: page title: Welcome to jqt description: Could be jq the basis for a web template engine? keywords: jqt, jq, template engine diff --git a/docs/content/structure.md b/docs/content/structure.md index 1107934..4668a13 100644 --- a/docs/content/structure.md +++ b/docs/content/structure.md @@ -1,5 +1,5 @@ --- -layout: page +layout: page-toc title: Defining the page structure with jqt description: Web pages structure is defined by the HTML macros. keywords: jqt, jq, gpp, preprocessing, template engine diff --git a/docs/styles/macros.m b/docs/styles/bem.m similarity index 100% rename from docs/styles/macros.m rename to docs/styles/bem.m diff --git a/docs/styles/new/colornames.css b/docs/styles/colornames.m similarity index 99% rename from docs/styles/new/colornames.css rename to docs/styles/colornames.m index 1595f39..1ffbe88 100644 --- a/docs/styles/new/colornames.css +++ b/docs/styles/colornames.m @@ -1,3 +1,4 @@ +// CSS named colors &define{Black}{ #000000} &define{Navy}{ #000080} &define{DarkBlue}{ #00008B} diff --git a/docs/styles/milligram.css b/docs/styles/milligram.css index 7a16ba9..c8ac18b 100644 --- a/docs/styles/milligram.css +++ b/docs/styles/milligram.css @@ -13,21 +13,27 @@ &define{SpacingScale}{0.7} &define{TypographyScale}{0.8} +@media screen { + html { + background-color: &ColorInitial; + } +} + // Modules -&include{new/color.css} -&include{new/base.css} -&include{new/spacing.css} -&include{new/typography.css} -&include{new/blockquote.css} -&include{new/code.css} -&include{new/link.css} -&include{new/list.css} -&include{new/table.css} -&include{new/divider.css} -&include{new/grid.css} -&include{new/utility.css} -//&include{new/image.css} -//&include{new/form.css} -//&include{new/button.css} +&include{milligram/color.css} +&include{milligram/base.css} +&include{milligram/spacing.css} +&include{milligram/typography.css} +&include{milligram/blockquote.css} +&include{milligram/code.css} +&include{milligram/link.css} +&include{milligram/list.css} +&include{milligram/table.css} +&include{milligram/divider.css} +&include{milligram/grid.css} +&include{milligram/utility.css} +//&include{milligram/image.css} +//&include{milligram/form.css} +//&include{milligram/button.css} // vim:ts=2:sw=2:ai:et:fileencoding=utf-8:syntax=css diff --git a/docs/styles/new/base.css b/docs/styles/milligram/base.css similarity index 100% rename from docs/styles/new/base.css rename to docs/styles/milligram/base.css diff --git a/docs/styles/new/blockquote.css b/docs/styles/milligram/blockquote.css similarity index 100% rename from docs/styles/new/blockquote.css rename to docs/styles/milligram/blockquote.css diff --git a/docs/styles/new/button.css b/docs/styles/milligram/button.css similarity index 100% rename from docs/styles/new/button.css rename to docs/styles/milligram/button.css diff --git a/docs/styles/new/code.css b/docs/styles/milligram/code.css similarity index 100% rename from docs/styles/new/code.css rename to docs/styles/milligram/code.css diff --git a/docs/styles/new/color.css b/docs/styles/milligram/color.css similarity index 100% rename from docs/styles/new/color.css rename to docs/styles/milligram/color.css diff --git a/docs/styles/new/divider.css b/docs/styles/milligram/divider.css similarity index 100% rename from docs/styles/new/divider.css rename to docs/styles/milligram/divider.css diff --git a/docs/styles/new/form.css b/docs/styles/milligram/form.css similarity index 100% rename from docs/styles/new/form.css rename to docs/styles/milligram/form.css diff --git a/docs/styles/new/grid.css b/docs/styles/milligram/grid.css similarity index 100% rename from docs/styles/new/grid.css rename to docs/styles/milligram/grid.css diff --git a/docs/styles/new/image.css b/docs/styles/milligram/image.css similarity index 100% rename from docs/styles/new/image.css rename to docs/styles/milligram/image.css diff --git a/docs/styles/new/link.css b/docs/styles/milligram/link.css similarity index 100% rename from docs/styles/new/link.css rename to docs/styles/milligram/link.css diff --git a/docs/styles/new/list.css b/docs/styles/milligram/list.css similarity index 100% rename from docs/styles/new/list.css rename to docs/styles/milligram/list.css diff --git a/docs/styles/new/spacing.css b/docs/styles/milligram/spacing.css similarity index 100% rename from docs/styles/new/spacing.css rename to docs/styles/milligram/spacing.css diff --git a/docs/styles/new/table.css b/docs/styles/milligram/table.css similarity index 100% rename from docs/styles/new/table.css rename to docs/styles/milligram/table.css diff --git a/docs/styles/new/typography.css b/docs/styles/milligram/typography.css similarity index 100% rename from docs/styles/new/typography.css rename to docs/styles/milligram/typography.css diff --git a/docs/styles/new/utility.css b/docs/styles/milligram/utility.css similarity index 100% rename from docs/styles/new/utility.css rename to docs/styles/milligram/utility.css diff --git a/docs/styles/new/default.css b/docs/styles/new/default.css deleted file mode 100644 index 1185ac5..0000000 --- a/docs/styles/new/default.css +++ /dev/null @@ -1,25 +0,0 @@ -// A new default style sheet for HTML - -@import url("https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"); - -&include{new/normalize.css} -&include{new/colornames.css} - -// All available modules (colornames.css must be included the first) -//&include{new/base.css} -//&include{new/blockquote.css} -//&include{new/button.css} -//&include{new/code.css} -//&include{new/color.css} -//&include{new/divider.css} -//&include{new/form.css} -//&include{new/grid.css} -//&include{new/image.css} -//&include{new/link.css} -//&include{new/list.css} -//&include{new/spacing.css} -//&include{new/table.css} -//&include{new/typography.css} -//&include{new/utility.css} - -// vim:ts=2:sw=2:ai:et:fileencoding=utf-8:syntax=css diff --git a/docs/styles/new/normalize.css b/docs/styles/normalize.css similarity index 87% rename from docs/styles/new/normalize.css rename to docs/styles/normalize.css index 9b77e0e..b26c100 100644 --- a/docs/styles/new/normalize.css +++ b/docs/styles/normalize.css @@ -1,33 +1,23 @@ -/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ +/*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ /** - * 1. Change the default font family in all browsers (opinionated). - * 2. Correct the line height in all browsers. - * 3. Prevent adjustments of font size after orientation changes in + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in * IE on Windows Phone and in iOS. */ -/* Document - ========================================================================== */ - html { - font-family: sans-serif; /* 1 */ - line-height: 1.15; /* 2 */ - -ms-text-size-adjust: 100%; /* 3 */ - -webkit-text-size-adjust: 100%; /* 3 */ + line-height: 1.15; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ -/** - * Remove the margin in all browsers (opinionated). - */ - -body { - margin: 0; -} - /** * Add the correct display in IE 9-. */ @@ -108,17 +98,7 @@ a { } /** - * Remove the outline on focused links when they are also active or hovered - * in all browsers (opinionated). - */ - -a:active, -a:hover { - outline-width: 0; -} - -/** - * 1. Remove the bottom border in Firefox 39-. + * 1. Remove the bottom border in Chrome 57- and Firefox 39-. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ @@ -245,8 +225,7 @@ svg:not(:root) { ========================================================================== */ /** - * 1. Change the font styles in all browsers (opinionated). - * 2. Remove the margin in Firefox and Safari. + * Remove the margin in Firefox and Safari. */ button, @@ -254,10 +233,7 @@ input, optgroup, select, textarea { - font-family: sans-serif; /* 1 */ - font-size: 100%; /* 1 */ - line-height: 1.15; /* 1 */ - margin: 0; /* 2 */ + margin: 0; } /** @@ -316,16 +292,6 @@ button:-moz-focusring, outline: 1px dotted ButtonText; } -/** - * Change the border, margin, and padding in all browsers (opinionated). - */ - -fieldset { - border: 1px solid #c0c0c0; - margin: 0 2px; - padding: 0.35em 0.625em 0.75em; -} - /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. diff --git a/docs/styles/main.css b/docs/styles/page.css similarity index 75% rename from docs/styles/main.css rename to docs/styles/page.css index d23280d..ed10cf2 100644 --- a/docs/styles/main.css +++ b/docs/styles/page.css @@ -1,18 +1,15 @@ //////////////////////////////////////////////////////////////////////// -// main +// Top-level stylesheet //////////////////////////////////////////////////////////////////////// -&include{macros.m} -&include{new/default.css} +&include{bem.m} +&include{colornames.m} -&include{milligram.css} -//&include{media.css} +@import url("https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"); + +&include{normalize.css} -@media screen { - html { - background-color: &ColorInitial; - } -} +&include{milligram.css} &include{blocks/container/style.css} &include{blocks/header/style.css} @@ -25,4 +22,7 @@ &include{blocks/license/style.css} &include{blocks/repository/style.css} +// Not used +//&include{media.css} + // vim:ts=2:sw=2:ai:et:fileencoding=utf-8:syntax=css