j1-template 2021.0.2 → 2021.0.7

data/lib/starter_web/pages/public/learn/roundtrip/_includes/attributes.asciidoc

@@ -53,7 +53,7 @@ tag::urls[]
 :roundtrip-icon-fonts:                            /pages/public/learn/roundtrip/mdi_icon_font/
 :roundtrip-responsive-tables:                     /pages/public/learn/roundtrip/responsive_tables/
 :roundtrip-themes:                                /pages/public/learn/roundtrip/themes/
-:roundtrip-search-engine:                         /pages/public/learn/roundtrip/search_engine/
+:roundtrip-quicksearch:                           /pages/public/learn/roundtrip/quicksearch/
 
 :github-gist-home:                                https://gist.github.com/
 :asciidoc-extensions-gist-example:                https://gist.github.com/mojavelinux/5546622
@@ -78,6 +78,9 @@ tag::data[]
 :data-images-standalone:                          "pages/roundtrip/100_present_images/lightbox-image-1.jpg, Golden Gate Bridge with San Francisco in distance, pages/roundtrip/100_present_images/lightbox-image-2.jpg, Forest with mountains behind"
 :data-images-group:                               "pages/roundtrip/100_present_images/lightbox-image-1.jpg, Golden Gate Bridge with San Francisco in distance, pages/roundtrip/100_present_images/lightbox-image-2.jpg, Forest with mountains behind"
 
+:data-quicksearch-icon:                           "pages/roundtrip/600_quicksearch/quicksearch_icon-800x200.jpg, Search button (magnifier) in the quick access area"
+:data-quicksearch-input:                          "pages/roundtrip/600_quicksearch/quicksearch_input-800x200.jpg, Input bar for a QuickSearch"
+
 end::data[]
 
 

data/lib/starter_web/pages/public/learn/roundtrip/_includes/documents/tables/bs_modal_examples.asciidoc

@@ -0,0 +1,47 @@
+
+.Selected extended BS modal examples
+[cols="6a,3a,3a", options="header", width="100%", role="rtable"]
+|===============================================================================
+|Postion |Class | Example
+
+|`top`
+|`info`
+|
+include::../410_top_info.asciidoc[]
+
+|`top-right`
+|`success`
+|
+include::../410_top_right_success.asciidoc[]
+
+|`top-left`
+|`info`
+|
+include::../410_top_left_info.asciidoc[]
+
+|`bottom`
+|`info`
+|
+include::../410_bottom_info.asciidoc[]
+
+|`bottom-right`
+|`danger`
+|
+include::../410_bottom_right_danger.asciidoc[]
+
+|`bottom-left`
+|`warning`
+|
+include::../410_bottom_left_warning.asciidoc[]
+
+|`full-height right`
+|`success`
+|
+include::../410_full_height_right_success.asciidoc[]
+
+|`full-height left`
+|`info`
+|
+include::../410_full_height_left_info.asciidoc[]
+
+|===============================================================================

data/lib/starter_web/pages/public/learn/where_to_go.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  Where to go
 tagline:                                fasten your way
-date:                                   2020-11-03 12:00:00
+date:                                   2020-11-03 00:00:00
 description: >
                                         Where to go, Too Long; Didn't Read to fasten
                                         your way through the preview pages of J1 Template.
@@ -35,7 +35,7 @@ resource_options:
 // Enable the Liquid Preprocessor
 :page-liquid:
 
-// Set page (local) attributes here
+// Set (local) page attributes here
 // -----------------------------------------------------------------------------
 // :page--attr:                         <attr-value>
 

data/lib/starter_web/pages/public/legal/en/000_copyright.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  Copyright
 tagline:                                software and content
-date:                                   2020-10-23 12:00:00
+date:                                   2020-10-23 00:00:00
 description: >
                                         Copyright for Software and Content
 

data/lib/starter_web/pages/public/legal/en/100_impress.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  Impress
 tagline:                                Entries referred to § 5 TMG
-date:                                   2020-10-23 12:00:00
+date:                                   2020-10-23 00:00:00
 description: >
                                         Impressum
 

data/lib/starter_web/pages/public/legal/en/200_terms_of_use.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  Terms of Use
 tagline:                                Terms of Use for Software and Content
-date:                                   2020-10-23 12:00:00
+date:                                   2020-10-23 00:00:00
 description: >
                                         Terms of Use for Software and Content
 

data/lib/starter_web/pages/public/legal/en/300_privacy.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  Privacy
 tagline:                                your personal data
-date:                                   2020-10-23 12:00:00
+date:                                   2020-10-23 00:00:00
 description: >
                                         Protection of your personal data
 

data/lib/starter_web/pages/public/legal/en/400_license_agreement.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  License
 tagline:                                Software and their licenses used by this website
-date:                                   2020-10-23 12:00:00
+date:                                   2020-10-23 00:00:00
 description: >
                                         License Agreement
 

data/lib/starter_web/pages/public/legal/en/500_support.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  Support
 tagline:                                Where to get help
-date:                                   2020-10-23 12:00:00
+date:                                   2020-10-23 00:00:00
 description: >
                                         Where to get help and support
 

data/lib/starter_web/pages/public/panels/intro_panel/panel.adoc

@@ -1,7 +1,7 @@
 ---
 title:                                  J1 Template
 tagline:                                creating responsive websites
-date:                                   2020-11-03 12:00:00
+date:                                   2020-11-03 00:00:00
 description: >
                                         A good user experience browsing a Web is one of
                                         the most important features a site has to offer as
@@ -25,8 +25,12 @@ resource_options:
       padding_bottom:                   50
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/modules/attics/the-place-1920x1280-bw.jpg
-          alt:                          the-place-1920x1280-bw
+        - url:                          /assets/images/modules/attics/responsive-text-1920x1280.jpg
+          alt:                          responsive-text-1920x1280
+          badge:
+            type:                       unsplash
+            author:                     Alexander Andrews
+            href:                       https://unsplash.com/@alex_andrews
 ---
 
 // Page content
@@ -35,6 +39,9 @@ resource_options:
 [[responsive-design]]
 == Full Responsive
 
+[role="mb-3"]
+image::/assets/images/pages/panels/the-place-1920x800.jpg[{{page.title}}]
+
 A good user experience browsing a Web site is one of the most important
 feature a site has to offer as a must. Beside excellent content. Presenting
 content at its best on all devices, for all window sizes makes an excellent
@@ -56,12 +63,14 @@ elements, cards, forms, etc.
 [[current-technology]]
 == HTML5 · CSS3 · JS
 
+[role="mb-3"]
+image::/assets/images/pages/panels/modules-apps-1920x800.jpg[{{page.title}}]
+
 The Internet is a rapidly changing world. Like the fashion industries, new
 trends are set every year. J1 Template combines modern technologies for the
 world of static Webs to make a site unique using current standards in terms
 of web development, languages, and tools.
 
-
 === HTML5 + CSS3
 
 J1 is using HTML5 for structuring content on the World Wide Web. The current
@@ -112,6 +121,9 @@ lightboxes, and so on.
 [[launch-ready]]
 == Start in No Time
 
+[role="mb-3"]
+image::/assets/images/pages/panels/no-time-1920x800.jpg[{{page.title}}]
+
 The base idea of the J1 Template is to give all people a toolset at their
 hands to create a website with no need to start by web development or
 web design from the beginning. A website based on J1 is using build-in
@@ -122,7 +134,6 @@ truly matters: your content.
 Using J1, you can instantly start a web project by creating your content and
 not by start learning the deep web development technologies.
 
-
 === Create your Web
 
 J1 is highly customizable. Based on a pure configuration, a website can be

data/lib/starter_web/pages/public/previewer/_includes/attributes.asciidoc

@@ -2,101 +2,24 @@
 //  Asciidoc attribute includes:                 attributes.asciidoc
 // -----------------------------------------------------------------------------
 
-
 // URLs - Internal references and/or sources on the Internet
 // -----------------------------------------------------------------------------
 tag::urls[]
-
-:google-md-icons:                                 https://material.io/icons/
-:google-github-md-icons:                          https://github.com/google/material-design-icons
-:material-design-icons-home:                      https://materialdesignicons.com/
-:material-design-icons-github:                    https://github.com/Templarian/MaterialDesign
-:stackoverflow-i-or-span-for-font-icons:          https://stackoverflow.com/questions/11135261/should-i-use-i-tag-for-icons-instead-of-span
-
-
-:bs_themes:                                       https://themes.getbootstrap.com/
-:bs_expo:                                         https://expo.getbootstrap.com/
-
-:bs_doc_v4:                                       http://getbootstrap.com/docs/4.0/getting-started/introduction/
-:bs_doc_examples:                                 http://getbootstrap.com/docs/4.0/examples/
-
-:bs_doc_content_code:                             https://getbootstrap.com/docs/4.0/content/code/
-:bs_doc_content_figures:                          https://getbootstrap.com/docs/4.0/content/figures/
-:bs_doc_content_images:                           https://getbootstrap.com/docs/4.0/content/images/
-:bs_doc_content_typography:                       https://getbootstrap.com/docs/4.0/content/typography/
-:bs_doc_content_tables:                           https://getbootstrap.com/docs/4.0/content/tables/
-
-:bs_doc_components_alerts:                        http://getbootstrap.com/docs/4.0/components/alerts/
-:bs_doc_components_badges:                        http://getbootstrap.com/docs/4.0/components/badge/
-:bs_doc_components_breadcrumb:                    http://getbootstrap.com/docs/4.0/components/breadcrumb/
-:bs_doc_components_buttons:                       http://getbootstrap.com/docs/4.0/components/buttons/
-:bs_doc_components_button_group:                  http://getbootstrap.com/docs/4.0/components/button-group/
-:bs_doc_components_cards:                         http://getbootstrap.com/docs/4.0/components/card/
-:bs_doc_components_carousel:                      http://getbootstrap.com/docs/4.0/components/carousel/
-:bs_doc_components_collapse:                      http://getbootstrap.com/docs/4.0/components/collapse/
-:bs_doc_components_dropdowns:                     http://getbootstrap.com/docs/4.0/components/dropdowns/
-:bs_doc_components_forms:                         http://getbootstrap.com/docs/4.0/components/forms/
-:bs_doc_components_input_group:                   http://getbootstrap.com/docs/4.0/components/input-group/
-:bs_doc_components_jumbotron:                     http://getbootstrap.com/docs/4.0/components/jumbotron/
-:bs_doc_components_list_group:                    http://getbootstrap.com/docs/4.0/components/list-group/
-:bs_doc_components_modal:                         http://getbootstrap.com/docs/4.0/components/modal/
-:bs_doc_components_navs:                          http://getbootstrap.com/docs/4.0/components/navs/
-:bs_doc_components_navbar:                        http://getbootstrap.com/docs/4.0/components/navbar/
-:bs_doc_components_pagination:                    http://getbootstrap.com/docs/4.0/components/pagination/
-:bs_doc_components_popovers:                      http://getbootstrap.com/docs/4.0/components/popovers/
-:bs_doc_components_progress:                      http://getbootstrap.com/docs/4.0/components/progress/
-:bs_doc_components_tooltips:                      http://getbootstrap.com/docs/4.0/components/tooltips/
-
-:bs_doc_utils_borders:                            http://getbootstrap.com/docs/4.0/utilities/borders/
-:bs_doc_utils_clearfix:                           http://getbootstrap.com/docs/4.0/utilities/clearfix/
-:bs_doc_utils_close_icon:                         http://getbootstrap.com/docs/4.0/utilities/close-icon/
-:bs_doc_utils_colors:                             http://getbootstrap.com/docs/4.0/utilities/colors/
-:bs_doc_utils_display:                            http://getbootstrap.com/docs/4.0/utilities/display/
-:bs_doc_utils_embeds:                             http://getbootstrap.com/docs/4.0/utilities/embed/
-:bs_doc_utils_flex:                               http://getbootstrap.com/docs/4.0/utilities/flex/
-:bs_doc_utils_float:                              http://getbootstrap.com/docs/4.0/utilities/float/
-:bs_doc_utils_image_replacement:                  http://getbootstrap.com/docs/4.0/utilities/image-replacement/
-:bs_doc_utils_screenreaders:                      http://getbootstrap.com/docs/4.0/utilities/screenreaders/
-:bs_doc_utils_sizing:                             http://getbootstrap.com/docs/4.0/utilities/sizing/
-:bs_doc_utils_spacing:                            http://getbootstrap.com/docs/4.0/utilities/spacing/
-:bs_doc_utils_text:                               http://getbootstrap.com/docs/4.0/utilities/text/
-:bs_doc_utils_vertical_alignment:                 http://getbootstrap.com/docs/4.0/utilities/vertical-align/
-:bs_doc_utils_visibility:                         http://getbootstrap.com/docs/4.0/utilities/visibility/
-
-:bs_doc_migration_to_v4:                          http://getbootstrap.com/docs/4.0/migration/
-
 end::urls[]
 
+
 // Tags - Asciidoc attributes used internally
 // -----------------------------------------------------------------------------
 tag::tags[]
-
-:window:                                          window="_blank"
-:no-clipboard:                                    noclip
-:figure-caption:                                  Figure
-:images-dir:                                      pages/roundtrip
-:y:                                               icon:check[role="green"]
-:n:                                               icon:times[role="red"]
-:c:                                               icon:file-alt[role="blue"]
-:beginner:                                        icon:battery-quarter[role="md-blue"]
-:inter:                                           icon:battery-half[role="md-blue"]
-:advanced:                                        icon:battery-full[role="md-blue"]
-:emdash:                                          —
-:bullet:                                          •
-:bigbullet:                                       ●
-:bigbigbullet:                                    ⬤
-:dot:                                             .
-:dotdot:                                          ..
-:middot:                                          ·
-
 end::tags[]
 
+
 // Data - Data elements for Asciidoctor extensions
 // -----------------------------------------------------------------------------
 tag::data[]
 
-:lightbox-image-data-base-color-palette:          "pages/previewer/bs-color-palette.png, Bootstrap base color palette"
-:lightbox-image-data-md-color-palette:            "pages/previewer/material-design-color-palette.png, Material Design color palette"
+:lightbox-image-data--base-color-palette:         "pages/previewer/bs-color-palette.png, Bootstrap base color palette"
+:lightbox-image-data--md-color-palette:           "pages/previewer/material-design-color-palette.png, Material Design color palette"
 
 end::data[]
 
@@ -106,6 +29,7 @@ end::data[]
 tag::images[]
 end::images[]
 
+
 // DOCUMENTS, local document resources
 // -----------------------------------------------------------------------------
 tag::documents[]

data/lib/starter_web/pages/public/previewer/_includes/documents/rouge/100_language_examples.asciidoc

@@ -0,0 +1,119 @@
+/////
+==== Brainfuck
+
+The program prints *Hello World!*. For sure, it's brainfuck.
+
+.Hello World!
+[source, brainfuck]
+----
+  ++++++++++
+  [
+   >+++++++>++++++++++>+++>+<<<<-     Schleife zur Vorbereitung der Textausgabe
+  ]
+  >++.                                Ausgabe von 'H'
+  >+.                                 Ausgabe von 'e'
+  +++++++.                            'l'
+  .                                   'l'
+  +++.                                'o'
+  >++.                                Leerzeichen
+  <<+++++++++++++++.                  'W'
+  >.                                  'o'
+  +++.                                'r'
+  ------.                             'l'
+  --------.                           'd'
+  >+.                                 '!'
+  >.                                  Zeilenvorschub
+  +++.                                Wagenrücklauf
+----
+/////
+
+==== Liquid
+
+// [source, liquid, linenums, highlight='3-7']
+// [source, liquid, role="linenums"]
+//
+// {% raw %}
+[source, liquid]
+----
+Hello {{ 'now' | date: "%Y %h" }}
+
+{% comment %}
+if item.quantity is 4...
+{% endcomment %}
+
+{% for i in (1..item.quantity) %}
+  {{ i }}
+{% endfor %}
+
+{% comment %} results in 1,2,3,4 {% endcomment %}
+----
+// {% endraw %}
+
+==== Javascript
+
+[source, javascript, linenums, highlight='3-7']
+----
+// ---------------------------------------------------------------
+// helper functions
+// ---------------------------------------------------------------
+function styleSheetLoaded(styleSheet) {
+  var sheets     = document.styleSheets,
+      stylesheet = sheets[(sheets.length - 1)];
+
+  // find CSS file 'styleSheetName' in document
+  for(var i in document.styleSheets) {
+    if(sheets[i].href && sheets[i].href.indexOf(styleSheet) > -1) {
+      return true;;
+    }
+  }
+}
+----
+
+==== Ruby
+
+// :source-highlighter: rouge
+// :source-highlighter: pygments
+// :pygments-style: emacs
+// :icons: font
+
+[source, ruby, linenums]
+----
+# Load Asciidoctor extensions needed
+#
+require 'asciidoctor/extensions' unless RUBY_ENGINE == 'opal'
+include Asciidoctor <1>
+
+Asciidoctor:Extensions.register do
+  class J1BlockMacro < Extensions:BlockMacroProcessor
+    use_dsl
+    named :banner
+    name_positional_attributes 'role'
+
+    def process parent, target, attrs
+      html = %(<div id="#{target}" class="#{attrs['role']}"></div>)
+      create_pass_block parent, html, attrs, subs: nil
+    end
+  end
+  block_macro J1BlockMacro
+end
+----
+<1> don't miss to load the Asciidoctor ruby
+
+/////
+==== Asciidoc
+
+[source, prometheus, linenums]
+----
+== Lightbox Examples
+
+Find below an example of using the lightbox Lightbox standalone.
+See how single (individual) images are linked for the use with
+Lightbox.
+
+.A Lightbox block for standalone images
+lightbox:example-standalone[ 400, {data-images-standalone} ]
+
+NOTE: The name LightGallery implies a sort of a Gallery but
+the library is a _lightbox_.
+----
+/////