RubyGems - j1-template - Versions diffs - 2020.0.9 → 2020.0.14 - Mend

j1-template 2020.0.9 → 2020.0.14

Files changed (541) hide show

data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/000_includes/parts.asciidoc CHANGED

@@ -61,7 +61,7 @@ Find here is a list of the basic Chocolatey commands used this section.
 And some more related ones. If you'd like to explore the Chocolatey CLI a bit
 *more*, give it a try before moving on.
-[cols="8a,4", options="header", role="table-responsive, full-width"]
+[cols="8a,4", options="header", role="table-responsive-stacked-lg, full-width"]
 |===============================================================================
 |Command |Description

data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/100_meet_and_greet_jekyll.adoc CHANGED

@@ -1,7 +1,12 @@
 ---
-title:                                  Web in a Day
+title:                                  Web in a Day
 tagline:                                meet & greet jekyll
-description:                            Modern static website in a day
+description: >
+                                        Web in a Day is the first in a series of tutorials to
+                                        learn how to create modern websites using Jekyll. This
+                                        Kickstarter focus on the basics of Jekyll and the
+                                        J1 Template which all people needs to know for a successful
+                                        way to a modern static website using Jekyll and J1 Template
 tags:                                   [ Kickstarter ]
 index:                                  [ Introduction, Web, Website, Jekyll ]
@@ -15,7 +20,7 @@ resource_options:
   - attic:
       padding_top:                      400
       padding_bottom:                   50
-      opacity:                          0.5
+      opacity:                          0.5
       slides:
         - url:                          /assets/images/pages/kickstarter/web_in_a_day/get-started-1920x1280-bw.jpg
           alt:                          Photo by JESHOOTS.COM on Unsplash
@@ -26,7 +31,7 @@ resource_options:
             href:                       https://unsplash.com/@jeshoots/portfolio
 ---
-// Enable the Liquid Preprocessor
+// Enable the Liquid Preprocessor
 // -----------------------------------------------------------------------------
 :page-liquid:

data/lib/starter_web/pages/public/learn/roundtrip/000_bs_tour.1.asciidoc CHANGED

@@ -20,7 +20,7 @@ resource_options:
       padding_bottom:                   50
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
+        - url:                          /assets/images/pages/roundtrip/images/bootstrap-1920x1000-bw.webp
           alt:                          Photo by Ricardo Gomez Angel on Unsplash
           badge:
             type:                       unsplash
@@ -118,4 +118,3 @@ Javascript libraries to support such functionality.
 </script>
 ++++

data/lib/starter_web/pages/public/learn/roundtrip/000_bs_tour.adoc CHANGED

@@ -20,7 +20,7 @@ resource_options:
       padding_bottom:                   50
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
+        - url:                          /assets/images/pages/roundtrip/images/bootstrap-1920x1000-bw.webp
           alt:                          Photo by Ricardo Gomez Angel on Unsplash
           badge:
             type:                       unsplash
@@ -142,4 +142,3 @@ Javascript libraries to support such functionality.
 }).call(this);
 </script>
 ++++

data/lib/starter_web/pages/public/learn/roundtrip/000_bs_tour_api.adoc CHANGED

@@ -20,7 +20,7 @@ resource_options:
       padding_bottom:                   50
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
+        - url:                          /assets/images/pages/roundtrip/images/bootstrap-1920x1000-bw.webp
           alt:                          Photo by Ricardo Gomez Angel on Unsplash
           badge:
             type:                       unsplash
@@ -116,7 +116,7 @@ var tour = Tour({
 });
 ----
-[cols="1,1,3a,7a", options="header", width="100%", role="table-responsive"]
+[cols="1,1,3a,7a", options="header", width="100%", role="table-responsive-stacked-lg"]
 |===============================================================================
 |Name |Type |Default |Description
@@ -145,7 +145,7 @@ http://getbootstrap.com/javascript/#popovers[Popover]._
 |autoscroll
 |Boolean
 |`true`
-|Autoscrolls the window when the step popover is out of view.
+|Autoscrolls the window when the step popover is out of view.
 |keyboard
 |Boolean
@@ -167,18 +167,18 @@ Storage interfaces]._
 |Boolean
 |`false`
 |Set this option to true to have some useful
-informations printed in the console.
+informations printed in the console.
 |backdrop
 |Boolean
 |`false`
 |Show a dark backdrop behind the popover and its
-element, highlighting the current step.
+element, highlighting the current step.
 |backdropContainer
 |String
 |`body`
-|HTML element (jQuery selector) on which the backdrop should be shown.
+|HTML element (jQuery selector) on which the backdrop should be shown.
 |backdropPadding
 |Number\|Object
@@ -238,7 +238,7 @@ template so you can easily rewrite it. However, Bootstrap Tour maps the
 _previous_, _next_ and _end_ logics to the elements which have the
 related `data-role` attribute. Therefore, you can also have multiple
 elements with the same `data-role` attribute. +
 |afterGetState \| afterSetState \| afterRemoveState  callout:2[]
 |Function
 |`name(key, value){}`
@@ -258,7 +258,7 @@ A simple example if to send a post request to your server each time
 there is a change.
 |onStart
-|Function
+|Function
 |`name(tour){}`
 |Function to execute when the tour starts.
@@ -341,7 +341,7 @@ var tour = Tour({
   afterSetState: function (key, value) {
     $.post("/some/path", value);
   }
-});
+});
 ----
@@ -381,7 +381,7 @@ tour.addStep({
 // |Name |Type |Description |Default
-[cols="1,1,3a,7a", options="header", width="100%", role="table-responsive"]
+[cols="1,1,3a,7a", options="header", width="100%", role="table-responsive-stacked-lg"]
 |===============================================================================
 |Name |Type |Default |Description
@@ -449,7 +449,7 @@ _This option should be used in conjunction with `next`._
 |container
 |String
 |`body`
-|Attachment of popover. Pass an element (jQuery selector) to append the
+|Attachment of popover. Pass an element (jQuery selector) to append the
 popover to. By default the popover is appended
 after the 'element' above. This option is particularly helpful for
 Internet Explorer.
@@ -460,10 +460,10 @@ Internet Explorer.
 |Show a dark backdrop behind the popover and its
 element, highlighting the current step.
-|backdropContainer NEW
+|backdropContainer NEW
 |String (jQuery selector)
 |`body`
-|HTML element on which the backdrop should be shown.
+|HTML element on which the backdrop should be shown.
 |backdropPadding NEW
 |Boolean\|Object
@@ -475,7 +475,7 @@ It can be a number or a object containing optional `top`, `right`,
 |redirect
 |Boolean\|Function
 |`true`
-|Set a custom function to execute as redirect function. The default
+|Set a custom function to execute as redirect function. The default
 redirect relies on the traditional `document.location.href`.
 |reflex UPDATED
@@ -497,7 +497,7 @@ The step is fixed positioned in the middle of the page. +
 You can use a string or function that returns a string of the HTML
 template for the orphan popovers.
-|duration NEW
+|duration NEW
 |Boolean\|String
 |`false`
 |Set a expiration time for the steps. When
@@ -580,7 +580,7 @@ the path of the step. It overrides the global `onRedirectError` option.
 === Methods
-If, for some reasons, you want to force the tour to be displayed, pass
+If, for some reasons, you want to force the tour to be displayed, pass
 *true* to the *start()* method.
 [cols="3,9a",options="header",]
@@ -632,13 +632,11 @@ word)_ .
 |Get the index of the current step.
 |setCurrentStep(`i`)
-|Override the current step. Pass `i` as the index of the step in the
+|Override the current step. Pass `i` as the index of the step in the
 tour (0-based).
 |redraw()
-|Triggers a redraw on the overlay element. Useful for dynamically sized
+|Triggers a redraw on the overlay element. Useful for dynamically sized
 tour targets.
 |===============================================================================

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

@@ -89,7 +89,7 @@ tag::tags[]
 :dotdot:                                          &#46;&#46;
 :middot:                                          &middot;
-end::tags[]
+end::tags[]
 // Data - Data elements for Asciidoctor extensions
 // -----------------------------------------------------------------------------

data/lib/starter_web/pages/public/learn/roundtrip/000_includes/documents/410_table_3_column.asciidoc CHANGED

@@ -1,6 +1,6 @@
 .Selected extended BS modal examples
-[cols="6a,3a,3a", options="header", width="100%", role="table-responsive"]
+[cols="6a,3a,3a", options="header", width="100%", role="table-responsive-stacked-lg"]
 |===============================================================================
 |Postion |Class | Example

data/lib/starter_web/pages/public/learn/roundtrip/000_includes/documents/419_advanced_modals_html.asciidoc CHANGED

@@ -128,7 +128,7 @@
     <div class="modal-content">
       <!-- Body -->
       <div class="modal-body">
-        <p class="mt-1 ml-3 mr-2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit nisi quo provident fugiat reprehenderit nostrum quos..</p><div class="row ml-3">
+        <p class="mt-1 ml-3 mr-2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit nisi quo provident fugiat reprehenderit nostrum quos..</p><div class="row ml-3">
           <a type="button" class="btn btn-primary-modal mr-2">Yes, please</a>
           <a type="button" class="btn btn-outline-secondary-modal" data-dismiss="modal">No, thanks<div class="ripple-container"><div class="ripple-decorator ripple-on ripple-out" style="left: 51.4063px; top: 20px; background-color: rgb(1, 211, 107); transform: scale(14.5548);"></div></div></a>
         </div>
@@ -184,7 +184,7 @@
       </div>
       <!-- Body -->
       <div class="modal-body">
-        <img src="/assets/images/modules/attics/admin-dashboard-bootstrap-1280x600.png" alt="" class="img-fluid">
+        <img src="/assets/images/modules/attics/admin-dashboard-bootstrap-1280x600.webp" alt="admin-dashboard-bootstrap" class="img-fluid">
         <div class="text-center">
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt vero illo error eveniet cum.</p>
         </div>
@@ -409,7 +409,7 @@
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit iusto nulla aperiam blanditiis ad consequatur in dolores culpa, dignissimos, eius non possimus fugiat. Esse ratione fuga, enim, ab officiis totam.
           </p>
         </div>
-        <img src="/assets/images/modules/attics/admin-dashboard-bootstrap-1280x600.png" alt="" class="img-fluid">
+        <img src="/assets/images/modules/attics/admin-dashboard-bootstrap-1280x600.webp" alt="admin-dashboard-bootstrap" class="img-fluid">
       </div>
       <!-- Footer -->
       <div class="modal-footer">
@@ -724,7 +724,7 @@
       </div>
       <!-- Body -->
       <div class="modal-body">
-        <img src="/assets/images/modules/attics/admin-dashboard-bootstrap-1280x600.png" alt="" class="img-fluid">
+        <img src="/assets/images/modules/attics/admin-dashboard-bootstrap-1280x600.webp" alt="admin-dashboard-bootstrap" class="img-fluid">
         <div class="text-center">
           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt vero illo error eveniet cum.</p>
         </div>
@@ -925,4 +925,4 @@
   </div>
 </div>
 <!--END Modal Subscription -->
-++++
+++++

data/lib/starter_web/pages/public/learn/roundtrip/100_present_images.adoc CHANGED

@@ -11,10 +11,10 @@ toc:                                    true
 scrollbar:                              false
 permalink:                              /pages/public/learn/roundtrip/present_images/
-regenerate:                             false
+regenerate:                             true
 resources:                              [
-                                          bs_tour, carousel, lightbox,
+                                          carousel, lightbox,
                                           justified_gallery, light_gallery
                                         ]
 resource_options:
@@ -23,7 +23,7 @@ resource_options:
       padding_bottom:                   50
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
+        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.webp
           alt:                          Photo by Ricardo Gomez Angel on Unsplash
           badge:
             type:                       unsplash

data/lib/starter_web/pages/public/learn/roundtrip/100_present_videos.adoc CHANGED

@@ -26,7 +26,7 @@ resource_options:
         color_2:                        md_grey_400
       slides:
         # Broadway Underground - still image (animate default)
-        - url:                          /assets/videos/headers/still/underground-broadway.png
+        - url:                          /assets/videos/headers/still/underground-broadway.webp
           alt:                          Broadway Underground
           alignY:                       top
           animateFirst:                 false
@@ -37,7 +37,7 @@ resource_options:
           loop:                         false
           duration:                     12000
         # Broadway Underground - still image (animate random)
-        - url:                          /assets/videos/headers/still/underground-broadway.png
+        - url:                          /assets/videos/headers/still/underground-broadway.webp
           alt:                          Broadway Underground
           alignY:                       top
           transition:                   push_left|push_right|cover_up|cover_down|fade|fadeInOut

data/lib/starter_web/pages/public/learn/roundtrip/200_typography.adoc CHANGED

@@ -8,9 +8,10 @@ index:                                  [ Template, Roundtrip, Typography ]
 categories:                             [ pages ]
 permalink:                              /pages/public/learn/roundtrip/typography/
-regenerate:                             false
+regenerate:                             true
 toc:                                    true
+advertising:                            false
 resources:                              []
 resource_options:
@@ -21,8 +22,11 @@ resource_options:
       padding_bottom:                   50
       opacity:                          0.3
       slides:
-        - url:                          /assets/images/pages/roundtrip/typography-1920x1280-bw.jpg
+        - url:                          /assets/images/pages/roundtrip/typography-1920x1280-bw.webp
           alt:                          Photo by Alice Donovan Rousel on Unsplash
+          preload:                      0
+          transitionDuration:           fast
+          resolutionRefreshRate:        500
           badge:
             type:                       unsplash
             author:                     Alice Donovan Rousel
@@ -194,7 +198,7 @@ base.
 That way, five series are available by the five scale factors. See the following
 table how `r-text` scales.
-[cols="3,2,7a", options="header", role="table-responsive mb-5"]
+[cols="3,2,7a", options="header", role="table-responsive-stacked-lg mb-5"]
 |===============================================================================
 |Property | Factor |Example text
@@ -287,7 +291,7 @@ The design for the Bootstrap *nav pills* were change into MD Design. As all
 elements available with J1 Template, the _Meterial Design_ color palette is
 used. All Bootstrap base classes can be used to colorize:
-[cols="5,7a", options="header", role="table-responsive mb-5"]
+[cols="5,7a", options="header", role="table-responsive-stacked-lg mb-5"]
 |===============================================================================
 |Property | Example

data/lib/starter_web/pages/public/learn/roundtrip/300_icon_fonts.adoc CHANGED

@@ -10,14 +10,14 @@ categories:                             [ pages ]
 permalink:                              /pages/public/learn/roundtrip/mdi_icon_font/
 regenerate:                             false
-resources:                              []
+resources:                              [ iconify ]
 resource_options:
   - attic:
       padding_top:                      400
       padding_bottom:                   50
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/pages/roundtrip/icon-fonts-1920x1280-bw.jpg
+        - url:                          /assets/images/pages/roundtrip/icon-fonts-1920x1280-bw.webp
           alt:                          Photo by Harpal Singh on Unsplash
           badge:
             type:                       unsplash
@@ -50,7 +50,7 @@ include::{includedir}/attributes.asciidoc[tag=data]
 // Set local page attributes
 // -----------------------------------------------------------------------------
-// :images-dir:                         {imagesdir}/path/to/page/images
+// :images-dir:                         {imagesdir}/path/to/page/images
 // Page content
@@ -89,7 +89,7 @@ project to create an increased icon-set based on _Google_'s official repository
 and MD style specification.
 .Material Design Icons
-[cols="2a,3a,4a,3a", options="header", width="100%", role="rtable_v table-responsive mt-3"]
+[cols="2a,3a,4a,^", options="header", width="100%", role="table-responsive-stacked-lg mt-3"]
 |===============================================================================
 |Size |Modifier |Markup |Render
@@ -100,7 +100,7 @@ and MD style specification.
 ----
 mdi:account[1x]
 ----
-^|mdi:account[1x]
+|mdi:account[1x]
 |3x
 |no modifier set
@@ -109,7 +109,7 @@ mdi:account[1x]
 ----
 mdi:account[3x]
 ----
-^|mdi:account[3x]
+|mdi:account[3x]
 |5x
 |no modifier set
@@ -118,7 +118,7 @@ mdi:account[3x]
 ----
 mdi:account[5x]
 ----
-^|mdi:account[5x]
+|mdi:account[5x]
 |5x
 |`mdi-rotate-45`
@@ -127,7 +127,7 @@ mdi:account[5x]
 ----
 mdi:account[5x mdi-rotate-45]
 ----
-^|mdi:account[5x mdi-rotate-45]
+|mdi:account[5x mdi-rotate-45]
 |5x
 |`mdi-rotate-315`
@@ -136,7 +136,7 @@ mdi:account[5x mdi-rotate-45]
 ----
 mdi:account[5x mdi-rotate-315]
 ----
-^|mdi:account[5x mdi-rotate-315]
+|mdi:account[5x mdi-rotate-315]
 |5x
 |`mdi-light` +
@@ -146,7 +146,7 @@ mdi:account[5x mdi-rotate-315]
 ----
 mdi:alert[5x mdi-light mdi-flip-v]
 ----
-^|mdi:alert[5x mdi-light mdi-flip-v]
+|mdi:alert[5x mdi-light mdi-flip-v]
 |5x
 |`md-indigo`
@@ -155,7 +155,7 @@ mdi:alert[5x mdi-light mdi-flip-v]
 ----
 mdi:alert[5x md-indigo]
 ----
-^|mdi:account[5x md-indigo]
+|mdi:account[5x md-indigo]
 |5x
 |`md-pink`
@@ -164,7 +164,7 @@ mdi:alert[5x md-indigo]
 ----
 mdi:alert[5x md-pink]
 ----
-^|mdi:account[5x md-pink]
+|mdi:account[5x md-pink]
 |5x
 |`mdi-spin`
@@ -173,7 +173,7 @@ mdi:alert[5x md-pink]
 ----
 mdi:loading[5x mdi-spin]
 ----
-^|mdi:loading[5x mdi-spin]
+|mdi:loading[5x mdi-spin]
 |5x
 |`md-red-900` +
@@ -183,7 +183,7 @@ mdi:loading[5x mdi-spin]
 ----
 mdi:heart[5x md-red-900 mdi-pulsed]
 ----
-^|mdi:heart[5x md-red-900 mdi-pulsed]
+|mdi:heart[5x md-red-900 mdi-pulsed]
 |===============================================================================
@@ -223,7 +223,7 @@ and the MIT License.
 ====
 .FontAwesome Icons
-[cols="2a,3a,4a,3a", options="header", width="100%", role="rtable_v table-responsive mt-3"]
+[cols="2a,3a,4a,^", options="header", width="100%", role="table-responsive-stacked-lg mt-3"]
 |===============================================================================
 |Size |Modifier |Markup |Render
@@ -234,7 +234,7 @@ and the MIT License.
 ----
 fas:user[1x]
 ----
-^|fas:user[1x mt-4]
+^|fas:user[1x]
 |3x
 |no modifier set
@@ -243,7 +243,7 @@ fas:user[1x]
 ----
 fas:user[3x]
 ----
-^|fas:user[3x mt-4]
+^|fas:user[3x]
 |5x
 |no modifier set
@@ -252,25 +252,16 @@ fas:user[3x]
 ----
 fas:user[5x]
 ----
-^|fas:user[5x mt-4]
+^|fas:user[5x]
 |5x
-|`fa-rotate-45`
-|Rotate 45 degrees
-[source, adoc, role="noclip"]
-----
-fas:user[5x fa-rotate-45]
-----
-^|fas:user[5x fa-rotate-45 mt-4]
-|5x
-|`fa-rotate-315`
-|Rotate 315 degrees
+|`fa-rotate-90`
+|Rotate 90 degrees
 [source, adoc, role="noclip"]
 ----
-fas:user[5x fa-rotate-315]
+fas:user[5x fa-rotate-90]
 ----
-^|fas:user[5x fa-rotate-315 mt-4]
+^|fas:user[5x fa-rotate-90]
 |5x
 |`mdi-light` +
@@ -280,7 +271,7 @@ fas:user[5x fa-rotate-315]
 ----
 fas:exclamation-triangle[5x mdi-light fa-flip-v]
 ----
-^|fas:exclamation-triangle[5x mdi-light fa-flip-v mt-4]
+^|fas:exclamation-triangle[5x mdi-light fa-flip-v]
 |5x
 |`md-indigo`
@@ -289,7 +280,7 @@ fas:exclamation-triangle[5x mdi-light fa-flip-v]
 ----
 fas:alert[5x md-indigo]
 ----
-^|fas:user[5x md-indigo mt-4]
+^|fas:user[5x md-indigo]
 |5x
 |`md-pink`
@@ -298,7 +289,7 @@ fas:alert[5x md-indigo]
 ----
 fas:alert[5x md-pink]
 ----
-^|fas:user[5x md-pink mt-4]
+^|fas:user[5x md-pink]
 |5x
 |`fa-spin`
@@ -307,17 +298,17 @@ fas:alert[5x md-pink]
 ----
 fas:circle-notch[5x fa-spin]
 ----
-^|fas:circle-notch[5x fa-spin mt-4]
+^|fas:circle-notch[5x fa-spin]
 |5x
 |`md-red-900` +
-`fa-pulsed`
+`md-red-900` `fa-pulsed`
 |Color set to MDI Dark Red and added animation of type Pulsed
 [source, adoc, role="noclip"]
 ----
 fas:heart[5x md-red-900 fa-pulsed]
 ----
-^|fas:heart[5x md-red-900 fa-pulsed mt-4]
+^|fas:heart[5x md-red-900 fa-pulsed]
 |===============================================================================
@@ -366,20 +357,20 @@ Currently, over 40,000 vector icons are available for many different use cases.
 Find some examples below.
 .Brand Icons
-[cols="2a,3a,4a,3a", options="header", width="100%", role="rtable_v table-responsive mt-3"]
+[cols="2a,3a,4a,^", options="header", width="100%", role="table-responsive-stacked-lg mt-3"]
 |===============================================================================
 |Size |Modifier |Markup |Render
-|5x
+|3x
 |no modifier set
 |All `icons` can be found on the preview page at link:{iconify-brand-icons}[SVG Logos, {window}]
 [source, adoc, role="noclip"]
 ----
-iconify:logos:opensource[5x]
+iconify:logos:opensource[3x]
 ----
-^|iconify:logos:opensource[5x]
+^|iconify:logos:opensource[3x]
-|3x
+|5x
 |no modifier set
 |All `icons` can be found on the preview page at link:{iconify-brand-icons}[SVG Logos, {window}]
 [source, adoc, role="noclip"]
@@ -391,7 +382,7 @@ iconify:logos:atom[5x]
 |===============================================================================
 .Medical Icons
-[cols="2a,3a,4a,3a", options="header", width="100%", role="rtable_v table-responsive mt-3"]
+[cols="2a,3a,4a,^", options="header", width="100%", role="table-responsive-stacked-lg mt-3"]
 |===============================================================================
 |Size |Modifier |Markup |Render
@@ -405,13 +396,13 @@ iconify:medical-icon:i-ear-nose-throat[3x]
 ^|iconify:medical-icon:i-ear-nose-throat[3x]
 |5x
-|no modifier set
+|`md-red-900`
 |All `icons` can be found on the preview page at link:{iconify-medical-icons}[Medical Icons, {window}]
 [source, adoc, role="noclip"]
 ----
-iconify:medical-icon:i-ear-nose-throat[5x]
+iconify:medical-icon:i-ear-nose-throat[5x md-red-900]
 ----
-^|iconify:medical-icon:i-ear-nose-throat[5x]
+^|iconify:medical-icon:i-ear-nose-throat[5x md-red-900]
 |===============================================================================