j1-template 2020.0.2 → 2020.0.7

data/lib/starter_web/pages/public/learn/roundtrip/400_asciidoc_extensions.adoc

@@ -78,12 +78,12 @@ additional useful extensions to the Markup language *Asciidoc* are made
 especially for documents of the Jekyll content type *pages* (but can be used
 for post or collections as well).
 
-=== Asciidoc Code
+== Asciidoc Code
 
 J1 Template adds a simple *Javascript* based on the `View Result Extension` to
 any `listingblock`. The extension adds an interactive *toggle button* `VIEW`
-to the output of an Asciidoc *listingblock box* placed to the top right of 
-the example box. If a result block `[.result]` is placed under a `listingblock`, 
+to the output of an Asciidoc *listingblock box* placed to the top right of
+the example box. If a result block `[.result]` is placed under a `listingblock`,
 clicking the toggle button `VIEW` displays (or hide) the content given by the
 `result block`.
 
@@ -120,7 +120,7 @@ for *5 seconds*. If the button `VIEW` is clicked, the result box toggles
 between open and close (the result gets hidden). That way, you can *open and
 close* the result box *at any time*.
 
-=== Asciidoc Admonitions
+== Asciidoc Admonitions
 
 All colors for all *default* admonition blocks set to the standard MD color
 set. Find available block types an their colors below.
@@ -141,14 +141,14 @@ WARNING: Icon background-color: yellow
 CAUTION: Icon background-color: red
 
 
-=== Q&A Blocks
+== Q&A Blocks
 
 *Q&A sections* are used quite often to answer popular questions. To make
-such a Q&A section more eye-minded, the additional Admonition Blocks 
+such a Q&A section more eye-minded, the additional Admonition Blocks
 `[QUESTION]` and `[ANSWER]` are available for J1 Template as Asciidoctor
 extentions.
 
-==== Question block
+=== Question block
 
 The admonition *Question block* is an extention to the Asciidoc admonition
 block types that introduce an admonition of type *question*.
@@ -167,7 +167,7 @@ What's the main tool for selecting colors?
 What's the main tool for selecting colors used for J1 Template?
 ====
 
-====  Answer block
+===  Answer block
 
 The Admonition *Answer block* is an extention to the Asciidoc admonition
 block types that introduce an admonition type of *answer* in conjunction
@@ -206,8 +206,8 @@ lightbox::block_id[ images_width, images_data [, group_name] ]
 
 NOTE: For a `lightbox::` block, images are placed in the output document
 *without* any other scaling than in *width* - they are placed using simple
-HTML `img` tags. This is fine for images *even in size*. For images in 
-different sizes, a *gallery* should be used as gallery (apps) rearrange 
+HTML `img` tags. This is fine for images *even in size*. For images in
+different sizes, a *gallery* should be used as gallery (apps) rearrange
 images to make them fit at its best for the available space.
 
 === Standalone Images
@@ -250,7 +250,6 @@ lightbox::images-standalone[ 400, {data-images-standalone} ]
 .Lightbox block for standalone images
 lightbox::images-standalone[ 400, {data-images-standalone} ]
 
-
 === Grouped Images
 
 If more than a single image is given for a `lightbox::` block, the images can be
@@ -279,9 +278,9 @@ All icon fonts are supported:
 * Twitter Emoji
 
 
-=== Material Designs Icons
- 
-*Material Designs Icons* can be used as *inline* icons by using 
+== Material Designs Icons
+
+*Material Designs Icons* can be used as *inline* icons by using
 the `mdi:` inline macro:
 
 [source, adoc, role="noclip"]
@@ -290,7 +289,7 @@ mdi:icon_name[icon_size, modifier] <1> <2> <3>
 ----
 <1> All `icon_name` can be found on the Preview page for *MDI Icon Previewer*
 <2> The `icon_size` attribute can be one of: `xs`, `sm`, `lg` and `1x` to `10x`
-<3> The `modifier` can be used to set the e.g the color (md-blue), an 
+<3> The `modifier` can be used to set the e.g the color (md-blue), an
     animation (fa-pulsed) or the orientation (fa-rotate-45)
 
 .Click on _view result_ to see how it's looks alike
@@ -307,16 +306,16 @@ mdi:font-awesome[2x, ml-3 mr-2 mb-2] Brand icon +
 mdi:apple[2x, md-indigo ml-3 mr-2] Brand icon (colored)
 ====
 
-Find all MDI Icons on page 
+Find all MDI Icons on page
 link:{previewer-mdi}[MDI Icon Previewer, {window}].
 
 NOTE: Parameters `icon_size` and `modifier` are optional. If *not* given,
 the icons `size` is set to default  (`1x`), the color to `black` and *no*
 settings for the `modifier` are applied.
 
-=== Font Awesome Icons
+== Font Awesome Icons
 
-*Font Awesome Icons* can be used as *inline* icons by using 
+*Font Awesome Icons* can be used as *inline* icons by using
 the `fas:` (solid icons) or `fab` (brand icons) inline macro:
 
 [source, adoc, role="noclip"]
@@ -325,7 +324,7 @@ fas:icon_name[icon_size, modifier] <1> <2> <3>
 ----
 <1> All `icon_name` can be found on the Preview page for *FA Icon Previewer*
 <2> The `icon_size` attribute can be one of: `xs`, `sm`, `lg` and `1x` to `10x`
-<3> The `modifier` can be used to set e.g the color (md-blue), an 
+<3> The `modifier` can be used to set e.g the color (md-blue), an
     animation (fa-pulsed) or the orientation (fa-rotate-45) of an icon
 
 .Click on _view result_ to see how it's looks alike
@@ -347,9 +346,9 @@ the icons `size` is set to default  (`1x`), the color to `black` and *no*
 settings for the `modifier` are applied.
 
 
-=== Iconify Icons
+== Iconify Icons
 
-*Iconify Icons* can be used as *inline* icons by using the `iconify:` 
+*Iconify Icons* can be used as *inline* icons by using the `iconify:`
 inline macro:
 
 [source, adoc, role="noclip"]
@@ -358,14 +357,14 @@ iconify:icon_name[icon_size, modifier] <1> <2> <3>
 ----
 <1> All `icon_name` can be found on the Preview page for *FA Icon Previewer*
 <2> The `icon_size` attribute can be one of: `xs`, `sm`, `lg` and `1x` to `10x`
-<3> The `modifier` can be used to set e.g the color (md-blue) or additional 
+<3> The `modifier` can be used to set e.g the color (md-blue) or additional
 positioning classes for margings and padding
 
 .Click on _view result_ to see how it's looks alike
 ----
 iconify:logos:opensource[2x, ml-4 mr-2 mb-2] Brand icon *OpenSource*  +
 iconify:logos:netlify[2x, ml-4 mr-2 mb-2] Brand icon *Netlify* +
-iconify:simple-icons:netlify[2x, md-red ml-4 mr-2] Brand icon *Netlify* 
+iconify:simple-icons:netlify[2x, md-red ml-4 mr-2] Brand icon *Netlify*
 ----
 
 [.result]
@@ -375,7 +374,7 @@ iconify:logos:netlify[2x, ml-4 mb-2] Brand icon *Netlify* +
 iconify:simple-icons:netlify[2x, md-red ml-4] Brand icon *Netlify*, colored
 ====
 
-Find all Iconify Icons available on page 
+Find all Iconify Icons available on page
 link:{iconify-icon-sets}[Iconify Icon Sets, {window}].
 
 [NOTE]
@@ -389,7 +388,7 @@ applied, the color settings will have *no* effect.
 ====
 
 
-=== Twitter Emoji Icons
+== Twitter Emoji Icons
 
 Twitter Emoji's can be used as *inline* icons by using the `emoji:`
 inline macro:
@@ -403,13 +402,13 @@ emoji:icon_name[icon_size] <1> <2>
 
 .Click on _view result_ to see how it's look alike
 ----
-This is an example of how you can emoji:heart[2x, pulsed mt-1] Asciidoctor 
+This is an example of how you can emoji:heart[2x, pulsed mt-1] Asciidoctor
 and Twitter Emoji emoji:smile[].
 ----
 
 [.result]
 ====
-This is an example of how you can emoji:heart[2x, pulsed mt-1] Asciidoctor 
+This is an example of how you can emoji:heart[2x, pulsed mt-1] Asciidoctor
 and Twitter Emoji emoji:smile[].
 ====
 
@@ -510,8 +509,6 @@ lorem:email[]
 
 |===============================================================================
 
-
-
 // Include documents
 // -----------------------------------------------------------------------------
 
@@ -529,7 +526,7 @@ that is needed for modern Web pages based on the Asciidoc Markup language
 generated by Jekyll. For sure!
 
 The next preview is focussing advanced Bootstrap *Modals*. The modals feature
-is currently in *beta* status, but it is a great option to customize your 
+is currently in *beta* status, but it is a great option to customize your
 user dialogs using them!
 
 Have a look for the link:{roundtrip-extended-modals}[BS modal extensions]

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

@@ -12,6 +12,8 @@ regenerate:                             false
 
 resources:                              [ lightbox ]
 resource_options:
+  - ssm:
+      mode:                             menu
   - attic:
       padding_top:                      400
       padding_bottom:                   50
@@ -61,21 +63,21 @@ resource_options:
 // -----------------------------------------------------------------------------
 
 Welcome to the pages of J1 Template. If your here first time,
-hopefully you get on that page first. For sure, there is no better 
+hopefully you get on that page first. For sure, there is no better
 place to step in.
 
-Having a menu system is great. We hope the the navigator module of J1 will 
-support you to explore this site, find what your are looking for. The site 
-of J1 has grown over the last month a lot. Many documents were seeking for 
+Having a menu system is great. We hope the the navigator module of J1 will
+support you to explore this site, find what your are looking for. The site
+of J1 has grown over the last month a lot. Many documents were seeking for
 a home. And we have really a bunch of them.
 
 To get better orientated, the site is organized for *natural reading*. As we
-use the English language for our international vistors (we are German), 
-*natural reading* means for a western language, reading from the left to the 
-right (LTR), and from top to down a page. The same to all menus, sections 
+use the English language for our international vistors (we are German),
+*natural reading* means for a western language, reading from the left to the
+right (LTR), and from top to down a page. The same to all menus, sections
 and pages.
 
-To read the site it is recommended to go for LTR. Other languages, other 
+To read the site it is recommended to go for LTR. Other languages, other
 countries and cultures go for RTL, but currently we've *no* support for RTL
 implemented.
 
@@ -84,7 +86,7 @@ For that reason, it was a good decision to start from here.
 
 == Whats up
 
-First of all, you've started already! The important first step in to find 
+First of all, you've started already! The important first step in to find
 your way to Jekyll is done. Congratiulations.
 
 The *Learn* section contains all you need to learn what Jekyll and J1 can do
@@ -96,7 +98,7 @@ With this section you'll find a:
   *J1*.
 
 . *Kickstarter* are Tutorials. The most important one to start is *Web in a Day*.
-  This tutorial guides you through all the steps to build a website using 
+  This tutorial guides you through all the steps to build a website using
   the template system Jekyll One - your site using Jekyll and the template J1.
 
 == Where to go
@@ -114,4 +116,3 @@ You're welcome!
 
 If you like, continue by walking through the roundtrip examples
 link:/pages/public/learn/roundtrip/present_images/[by starting the tour here].
-

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

@@ -7,7 +7,7 @@ tags:                                   [ Support ]
 index:                                  []
 categories:                             [ pages ]
 
-permalink:                              /pages/public/legal/de/support/
+permalink:                              /pages/public/legal/en/support/
 regenerate:                             false
 
 resources:                              []

data/lib/starter_web/pages/public/previewer/000_includes/tables/mdi_icons/200_rotate.asciidoc

@@ -41,7 +41,7 @@
 |
 [source, html]
 ----
-<i class="mdi mdi-3x mdi-account mdi-rotate-45">
+<i class="mdi mdi-3x mdi-account mdi-rotate-180">
 ----
 
 |`mdi-rotate-225`

data/lib/starter_web/pages/public/previewer/mdi_icons_preview.adoc

@@ -10,7 +10,7 @@ categories:                             [ pages, manuals ]
 permalink:                              /pages/protected/previewer/mdi_font/
 regenerate:                             false
 
-scrollbar:                              true
+scrollbar:                              false
 
 resources:                              []
 resource_options:
@@ -46,7 +46,7 @@ include::{includedir}/attributes.asciidoc[tag=data]
 
 // Additional Asciidoc page attributes goes here
 // -----------------------------------------------------------------------------
- 
+
 
 // Include documents
 // -----------------------------------------------------------------------------
@@ -89,7 +89,6 @@ include equivalent text either inside the `` tag or right next to it
 click to reply, the link is usable if CSS doesn't load, and human readers
 with good eyesight and a decent browser see a pretty icon.
 
-
 == Sizes
 
 For more eye-minded placement, or to place emphasis on, all icons can be

data/lib/starter_web/pages/public/previewer/twitter_emoji_preview.adoc

@@ -8,9 +8,9 @@ index:                                  []
 categories:                             [ pages, manuals ]
 
 permalink:                              /pages/protected/previewer/twitter_emoji/
-regenerate:                             false 
+regenerate:                             false
 
-scrollbar:                              true
+scrollbar:                              false
 
 resources:                              []
 resource_options:
@@ -50,7 +50,7 @@ include::{includedir}/attributes.asciidoc[tag=data]
 
 // Additional Asciidoc page attributes goes here
 // -----------------------------------------------------------------------------
-:jollygoodcode-emoji:                   https://github.com/jollygoodcode/twemoji 
+:jollygoodcode-emoji:                   https://github.com/jollygoodcode/twemoji
 
 // Include documents
 // -----------------------------------------------------------------------------

data/lib/starter_web/pages/public/site_search.adoc

@@ -0,0 +1,196 @@
+---
+title:                                  Site Search
+tagline:                                Full-text search engine
+description:                            Algolia Index for all documents
+
+tags:                                   [
+                                          Doc, Post, Documents, Full, Text,
+                                          Site, Search, Engine, Algolia
+                                        ]
+index:                                  []
+categories:                             [ pages ]
+
+toc:                                    false
+
+permalink:                              /pages/public/start/site_search/
+regenerate:                             false
+
+resources:                              [ algolia ]
+resource_options:
+  - masthead:
+      opacity:                          0.2
+      slides:
+        - url:                          /assets/images/widescreen/featured-1920x800.jpg
+          alt:                          featured-1920x800 
+---
+
+// Enable the Liquid Preprocessor
+// -----------------------------------------------------------------------------
+:page-liquid:
+
+// Set other global page attributes here
+// -----------------------------------------------------------------------------
+
+// Liquid procedures
+// -----------------------------------------------------------------------------
+//{% capture set_env_entry_document %}themes/{{site.template.name}}/procedures/global/set_env_entry_document.proc{%endcapture%}
+
+// Initialize entry document paths
+// -----------------------------------------------------------------------------
+//{% include {{set_env_entry_document}} init_folders=all %}
+
+// Load tags and urls
+// -----------------------------------------------------------------------------
+//include::{includedir}/attributes.asciidoc[tag=tags]
+//include::{includedir}/attributes.asciidoc[tag=urls]
+//include::{includedir}/attributes.asciidoc[tag=data]
+
+// Additional Asciidoc page attributes goes here
+// -----------------------------------------------------------------------------
+
+// Include sub-documents
+// -----------------------------------------------------------------------------
+
+== Site Search
+
+J1 Template integrates an Algolia Search Index for all documents of this site.
+Using Algolia *Site Search*, looking for documents is done in a second.
+
+++++
+  <!-- See: https://community.algolia.com/instantsearch.js/v2/getting-started.html -->
+
+  <!-- CurrentRefinedValues widget -->
+  <div id="current-refined-values"></div>
+
+  <!-- ClearAll widget -->
+  <div id="clear-all"></div>
+
+  <!-- SearchBox widget -->
+  <div id="search-searchbar" class="mb-4"> </div>
+
+  <!-- HitsPerPage widget -->
+  <!-- div id="hits-per-page-selector"></div -->
+
+  <div id="searcher" class"row">
+    <div class="col-md-4 col-xs-6">
+      <!-- CurrentRefinedValues widget -->
+      <div id="current-refined-values"></div>
+      <!-- RefinementList widget -->
+      <div id="refinement-list" class="limit-y"></div>
+    </div>
+
+    <div class="col-md-8 col-xs-6">
+      <!-- Pagination widget -->
+      <div id="pagination"></div>
+      <!-- Hits widget -->
+      <ul class="list-unstyled">
+        <div id="search-hits" class="result-list" >
+          <div class="result-item"></div>
+        </div>
+      </ul>
+    </div>
+
+  </div>
+++++
+
+++++
+<style>
+
+#refinement-list {
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none;  /* IE 10+ */
+}
+
+#refinement-list::-webkit-scrollbar {
+  width: 0px; /* WebKit */
+}
+
+/*
+input:focus{
+  outline: none;
+//  box-shadow: 0px 0px 5px #61C5FA;
+  border: 1px solid #424242;
+}
+
+input:hover {
+  border: 1px solid #424242;
+  border-radius: 5px;
+}
+
+input:focus:hover{
+  outline: none;
+  box-shadow: 0px 0px 5px #424242;
+  border: 1px solid #3f51b5;
+  border-radius:0;
+}
+*/
+
+.limit-y {
+  max-height: 1000px;
+  overflow-y: scroll;
+}
+
+.ais-pagination {
+  -webkit-box-shadow: 0 !important;
+  box-shadow: 0 !important;
+  width: 100%;
+}
+
+.ais-pagination--item__active {
+  background: #3f51b5;
+}
+
+.ais-clear-all--link, .ais-current-refined-values--clear-all,
+.ais-price-ranges--button, .ais-range-input--submit {
+  background: #3f51b5;
+}
+
+
+.ais-current-refined-values--link, .ais-geo-search--toggle-label,
+.ais-hierarchical-menu--link, .ais-menu--link, .ais-price-ranges--link,
+.ais-refinement-list--label, .ais-star-rating--link, .ais-toggle--label {
+  color: #3f51b5;
+}
+
+.ais-refinement-list {
+    margin-top: 1.25rem;
+}
+
+.search-result-item {
+  margin-bottom: 0px;
+}
+
+.ais-search-box {
+  max-width: 100%;
+  /* margin-bottom: 15px; */
+}
+
+.ais-search-box--input {
+  padding-left: 2.5rem !important;
+}
+
+.ais-search-box--magnifier {
+  top: 1rem !important;
+  right: 1rem !important;
+  left: 1rem !important;
+}
+
+.ais-search-box--reset {
+  top: 1rem !important;
+  right: 1rem !important;
+}
+
+.ais-clear-all {
+  margin-bottom: .125rem!important;
+}
+
+em.ais-Highlight {
+  font-weight: bold;
+  /* font-size: 1.125rem; */
+  /* font-style: inherit; */
+  color: #ef2929;
+  font-style: unset !important;
+}
+
+</style>
+++++