j1_template_mde 2018.4.17 → 2018.4.18

data/lib/starter_web/_data/layouts/home.yml

@@ -20,9 +20,6 @@
 # ------------------------------------------------------------------------------
 # Layout configuration settings
 
-# ------------------------------------------------------------------------------
-# Layout configuration settings
-
 # lanes|lane
 # -------------------------------------
 #   Set LANE specific configuration parameters for a page LAYOUT. The
@@ -58,14 +55,14 @@
 #   default:          no defaults
 #
 # comment
-# -------------------------------------
+# ------------------------------------------------------------------------------
 #   Each lane should be commented for easier reading the HTML source code.
 #
 #   values:                   string
 #   default:                  no defaults
 #
 # type
-# -------------------------------------
+# ------------------------------------------------------------------------------
 #   The (HTML) content of a lane can be included (from an include file) or
 #   loaded asychronously from a HTML data file by AJAX (get|load) calls.
 #   J1 template is using jQuery as an interface to AJAX calls.
@@ -74,7 +71,7 @@
 #   default:                  no defaults
 #
 # source
-# -------------------------------------
+# ------------------------------------------------------------------------------
 #   The parameter source defines a (site root relativ) path to the data
 #   source to be included or loaded.
 #
@@ -82,14 +79,14 @@
 #   default:                  no defaults
 #
 # file
-# -------------------------------------
+# ------------------------------------------------------------------------------
 #   Defines the data file to be included or loaded.
 #
 #   values:                   string
 #   default:                  no defaults
 #
 # id
-# -------------------------------------
+# ------------------------------------------------------------------------------
 #   Used for AJAX load calls (see parameter type). The id is used twice. First,
 #   id references a HTML fragment as part of the (HTML) data file (see parameter
 #   data below). Second, the id is used to identify the placeholder (div)
@@ -110,9 +107,9 @@
 
 lanes:
 
-# ------------------------------------------------------------------------------
-# MASTER header
-#
+  # ----------------------------------------------------------------------------
+  # MASTER header
+  #
   - lane:
       enabled:                          true
       region:                           body-header
@@ -121,83 +118,131 @@ lanes:
       path:                             modules/headers
       file:                             master_header_generator.html
 
-# ------------------------------------------------------------------------------
-# MASTER slider
-#
+  # ----------------------------------------------------------------------------
+  # MASTER slider
+  #
   - lane:
       enabled:                          false
+      id:                               master_slider
       region:                           body-header
       type:                             async
-      id:                               master_slider
       helper_classes:                   mb-0
 
-# ------------------------------------------------------------------------------
-#   PAGE CONTENT (region body-main)
-#
-#   NOTE:
-#     The CONTENT of a post or page may already rendered (page contains HTML
-#     data) or unrendered (page contains MARKUP data). In both cases, rendered
-#     or unrendered content, a valid FRONTMATTER is needed to pass the data.
-#
-#     The CONTENT generation for posts and pages depends on the data type,
-#     the MARKUP language (Markdown, Asciidoc) the page is using. The data
-#     type is specified by the file EXTENSION (e.g. ".md" for Markdown or
-#     ".adoc" for Asciidoc formatted content).
-#
-#     To enable Jekyll running the render phase, the respective processor
-#     (e.g.kramdown for MARKDOWN or asciidoctor for ASCIIDOC) needs to be
-#     loaded and configured (Gemfile and the side-wide configuration file
-#     _config.yml).
-#
-#   NOTE:
-#     The CONTENT of a PAGE is passed trough a (Liquid) wrapper procedure
-#     (page_content.html) to add or inject specific ADDITIONAL data like
-#     a TOC etc. that influences the resulting page.
-#
-#     To modify the wrapper, DO NOT CHANGE the template files. See with
-#     ***URL*** how to create your own wrapper (and OVERLOAD the J1 template
-#     system with the data you provided).
-#
-# ------------------------------------------------------------------------------
-
+  # ----------------------------------------------------------------------------
+  #   PAGE CONTENT (region body-main)
+  #
+  #   NOTE:
+  #     The CONTENT of a post or page may already rendered (page contains HTML
+  #     data) or unrendered (page contains MARKUP data). In both cases, rendered
+  #     or unrendered content, a valid FRONTMATTER is needed to pass the data.
+  #
+  #     The CONTENT generation for posts and pages depends on the data type,
+  #     the MARKUP language (Markdown, Asciidoc) the page is using. The data
+  #     type is specified by the file EXTENSION (e.g. ".md" for Markdown or
+  #     ".adoc" for Asciidoc formatted content).
+  #
+  #     To enable Jekyll running the render phase, the respective processor
+  #     (e.g.kramdown for MARKDOWN or asciidoctor for ASCIIDOC) needs to be
+  #     loaded and configured (Gemfile and the side-wide configuration file
+  #     _config.yml).
+  #
+  #   NOTE:
+  #     The CONTENT of a PAGE is passed trough a (Liquid) wrapper procedure
+  #     (page_content.html) to add or inject specific ADDITIONAL data like
+  #     a TOC etc. that influences the resulting page.
+  #
+  #     To modify the wrapper, DO NOT CHANGE the template files. See with
+  #     ***URL*** how to create your own wrapper (and OVERLOAD the J1 template
+  #     system with the data you provided).
+  #
+  # ----------------------------------------------------------------------------
 
-# <!-- [INFO   ] [j1.layout.content_writer.proc      ] [load region 'body-main' for layout: home] -->
-# ------------------------------------------------------------------------------
-# TEASER banner
-#
+  # ----------------------------------------------------------------------------
+  # TEASER banner
+  #
   - lane:
       enabled:                            true
+      id:                                 home_teaser_banner
       region:                             body-main
       type:                               async
-      id:                                 home_teaser_banner
-#     helper_classes:                     mt-3 mb-3
+      helper_classes:                     mt-5 mb-3
 
-# ------------------------------------------------------------------------------
-# INTRO panel
-#
+  # ----------------------------------------------------------------------------
+  # DIVIDER banner
+  #
   - lane:
       enabled:                            true
+      id:                                 divider-1
       region:                             body-main
       type:                               async
+
+  # ----------------------------------------------------------------------------
+  # INTRO panel
+  #
+  - lane:
+      enabled:                            true
       id:                                 home_intro_panel
+      region:                             body-main
+      type:                               async
       helper_classes:                     mt-4 mb-4
 
-# ------------------------------------------------------------------------------
-# PARALLAX banner
-#
+  # ----------------------------------------------------------------------------
+  # DIVIDER banner
+  #
   - lane:
-      enabled:                            true
+      enabled:                            false
+      id:                                 divider-2
       region:                             body-main
       type:                               async
+
+  # ----------------------------------------------------------------------------
+  # PARALLAX banner
+  #
+  - lane:
+      enabled:                            false
       id:                                 home_parallax_banner
+      region:                             body-main
+      type:                               async
       helper_classes:                     mb-3
 
-# ------------------------------------------------------------------------------
-# NEWS panel
-#
+  # ----------------------------------------------------------------------------
+  # IMAGE banner
+  #
   - lane:
       enabled:                            true
+      id:                                 home_image_banner
       region:                             body-main
       type:                               async
+      helper_classes:                     mb-3
+
+  # ----------------------------------------------------------------------------
+  # SERVICE panel
+  #
+  - lane:
+      enabled:                            true
+      id:                                 home_service_panel
+      region:                             body-main
+      type:                               async
+      helper_classes:                     mt-5 mb-5
+
+  # ----------------------------------------------------------------------------
+  # DIVIDER banner
+  #
+  - lane:
+      enabled:                            true
+      id:                                 divider-3
+      region:                             body-main
+      type:                               async
+
+  # ----------------------------------------------------------------------------
+  # NEWS panel
+  #
+  - lane:
+      enabled:                            true
       id:                                 home_news_panel
-      helper_classes:                     mb-0
+      region:                             body-main
+      type:                               async
+      helper_classes:                     mt-5 mb-5
+
+
+

data/lib/starter_web/_data/modules/j1_back2top.yml

@@ -107,8 +107,8 @@
 #   default:                        "#top"
 #
 enabled:                            true
-active_color:                       j1_primary
-background_color:                   md_grey_800
+active_color:                       md_indigo
+background_color:                   md_grey_900
 icon:                               "f05d"
 icon_family:                        Material Design Icons
 startline:                          100

data/lib/starter_web/_data/modules/j1_banner.yml

@@ -11,245 +11,211 @@
 #  See: https://github.com/jekyll-one/j1_template_mde/blob/master/LICENSE
 # ------------------------------------------------------------------------------
 
-
-# -------------------------------------------------------------------------
+# ------------------------------------------------------------------------------
 # GLOBALS
-# -------------------------------------------------------------------------
+# ------------------------------------------------------------------------------
 global:
-  data_path:                        /assets/data/banner/index.html
+  data_path:                            /assets/data/banner/index.html
 
-# -------------------------------------------------------------------------
+# ------------------------------------------------------------------------------
 # BANNER
-# -------------------------------------------------------------------------
+# ------------------------------------------------------------------------------
 banners:
 
-  # ------------------------------------------------------------------
-  # TEASER banners
-  # ------------------------------------------------------------------
+  # ----------------------------------------------------------------------------
+  # HELPER banner
+  # ----------------------------------------------------------------------------
+  - banner:
+      enabled:                          true
+      id:                               divider-1
+      type:                             divider_banner
+
+  - banner:
+      enabled:                          true
+      id:                               divider-2
+      type:                             divider_banner
+
+  - banner:
+      enabled:                          true
+      id:                               divider-3
+      type:                             divider_banner
+
+  # ----------------------------------------------------------------------------
+  # TEASER banner
+  # ----------------------------------------------------------------------------
 
-  # --------------------------------------------------------
+  # ----------------------------------------------------------------------------
   # home_teaser_banner
   #
   - banner:
-
-      enabled:                      true
-      id:                           home_teaser_banner
-      type:                         teaser_banner
-      icon_family:                  MDI
-      style:                        light
-      lane_span:                    fixed
+      enabled:                          true
+      id:                               home_teaser_banner
+      type:                             teaser_banner
+      icon_family:                      MDI
+      style:                            light
+      background_color_1:               md_gray_50
+      background_color_2:               md_gray_50
+      lane_span:                        fixed
+      helper_classes:                   mt-4 mb-4
 
       boxes:
 
         - box:
 
-            enabled:                true
-            width:                  10
-            type:                   text
-            animate:                fadeInUp
-            title:                  All You need for your New Amazing Site
+            enabled:                    true
+            width:                      12
+            type:                       text
+            animate:                    fadeInUp
+            title:                      All You need for your New Amazing Site
             description: >
-                                    Jekyll meets Bootstrap - and makes a lot of friends.
-                                    J1 Template combines the best of open source software for
-                                    the Web and the Web site generator Jekyll. J1 is Open
-                                    Source and the modules packed as well - no pain for private
-                                    or professional use.
-                                    Explore this site to learn what's possible if you go the
-                                    Jekyll Way.<br/>
+                                        Jekyll meets Bootstrap - and makes a lot of friends.
+                                        J1 Template combines the best of open source software for
+                                        the Web and the Web site generator Jekyll. J1 is Open
+                                        Source and the modules packed as well - no pain for private
+                                        or professional use.
+                                        Explore this site to learn what's possible if you go the
+                                        Jekyll Way.<br/>
             tagline: >
-                                    <big><b>Create powerful modern Static Webs: Secure, Flexible and Fast</b>.</big>
+                                        <big><b>Create powerful modern Static Webs: Secure, Flexible and Fast</b>.</big>
             buttons:
 
-            - button:
-                text:               Start
-                class:              btn btn-success btn-raised btn-round btn-flex
-                icon:               rocket
-                icon_color:         md_white
-                icon_size:          lg
-                href:               /pages/public/start/kickstarter/web_in_a_day/intro/
-            - button:
-                text:               Download 
-                class:              btn btn-primary btn-raised btn-round btn-flex
-                icon:               download
-                icon_color:         md_white
-                icon_size:          lg
-                href:               /pages/public/start/downloads/linux_starter/
-            - button:
-                text:               Become a Patron
-                class:              btn btn-danger btn-raised btn-round btn-flex
-                icon:               patreon
-                icon_color:         md_white
-                icon_size:          lg
-                href:               https://www.patreon.com/join/jekyll_one
-                target:             blank 
-
-  # --------------------------------------------------------
-  # example_teaser_banner
+              - button:
+                  text:                 Start
+                  class:                btn-primary btn-raised btn-flex
+                  icon:                 rocket
+                  icon_color:           md_white
+                  icon_size:            lg
+                  href:                 /pages/public/start/kickstarter/web_in_a_day/intro/
+              - button:
+                  text:                 Download
+                  class:                btn-primary btn-raised btn-flex
+                  icon:                 download
+                  icon_color:           md_white
+                  icon_size:            lg
+                  href:                 /pages/public/start/downloads/linux_starter/
+              - button:
+                  text:                 Become a Patron
+                  class:                btn-danger btn-raised btn-flex
+                  icon:                 patreon
+                  icon_color:           md_white
+                  icon_size:            lg
+                  href:                 https://www.patreon.com/join/jekyll_one
+                  target:               blank
+
+# ----------------------------------------------------------------------------
+# IMAGE Banner
+# ----------------------------------------------------------------------------
+
+  # ----------------------------------------------------------------------------
+  # home_image_banner
   #
   - banner:
-
-      enabled:                      true
-      id:                           example_teaser_banner
-      type:                         teaser_banner
-      icon_family:                  FontAwesome
-      style:                        light
-      lane_span:                    fluid
+      enabled:                          true
+      id:                               home_image_banner
+      type:                             image_banner
+      background_color_1:               md_gray_300
+      background_color_2:               md_gray_50
+      lane_span:                        fluid
+      helper_classes:                   mt-4 mb-4
 
       boxes:
-
         - box:
+            enabled:                    true
+            gridify:                    false
+            size_y:                     450
+            darken:                     1
+            background_image:           /assets/images/master_header/ideas-start-here-1920x1200.png
 
-            enabled:                true
-            width:                  10
-            type:                   text
-            animate:                fadeInUp
-            title:                  Your Product - Your Teaser Slogan
-            description: >
-                                    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
-                                    eirmod tempor invidunt ut labore et dolore magna aliquyam erat. At vero
-                                    eos et accusam et justo duo dolores et ea rebum.
-                                    <br/><br/>
-            tagline: >
-                                    <b>Stet clita kasd gubergren, no sea takimata sanctus est.</b>
-            buttons:
-
-            - button:
-                text:               Action 1
-                class:              btn-raised btn-success
-                icon:               eye
-                icon_color:         md_white
-                icon_size:          large
-                href:               javascript:void(0)
-
-            - button:
-                text:               Action 2
-                class:              btn-raised btn-primary
-                icon:               eye
-                icon_color:         md_white
-                icon_size:          large
-                href:               javascript:void(0)
-
-  # ------------------------------------------------------------------
+  # ----------------------------------------------------------------------------
   # PARALLAX Banner
-  # ------------------------------------------------------------------
+  # ----------------------------------------------------------------------------
 
-  # --------------------------------------------------------
+  # ----------------------------------------------------------------------------
   # home_parallax_banner
   #
   - banner:
-
-      enabled:                      true
-      id:                           home_parallax_banner
-      type:                         parallax_banner
-      style:                        dark
-      lane_span:                    fluid
+      enabled:                          false
+      id:                               home_parallax_banner
+      type:                             parallax_banner
+      style:                            dark
+      background_color_1:               md_gray_300
+      background_color_2:               md_gray_50
+      lane_span:                        fluid
+      helper_classes:                   mt-4 mb-4
 
       boxes:
-
         - box:
-            enabled:                true
-            type:                   quote
+            enabled:                    true
+            type:                       quote
             cite_text: >
-                                    <b>Making</b> is like <b>Wanting</b>,
-                                    <br> but even <b><span class="color-red">Better</span></b>
-            cite:                   J1 Team
-            text_color:             rgba_lighten_900
-            cite_color:             rgba_lighten
-            gridify:                true
-            darken:                 7
-            background_image:       /assets/images/quotes/people.png
-            background_position_x:  50%
-            background_position_y:  45px
-
-  # --------------------------------------------------------
+                                        Making is like Wanting,
+                                        <br> but even <span style="color:red">Better</span>
+            cite:                       J1 Team
+            text_color:                 rgba_lighten_900
+            cite_color:                 rgba_lighten
+            gridify:                    true
+            size_y:                     300
+            darken:                     7
+            background_image:           /assets/images/quotes/people.png
+
+  # ----------------------------------------------------------------------------
   # home_parallax_banner
   #
   - banner:
-
-      enabled:                      true
-      id:                           parallax_banner_einstein
-      type:                         parallax_banner
-      style:                        dark
-      lane_span:                    fluid
-
-      boxes:
-
-        - box:
-            enabled:                true
-            type:                   quote
-            cite_text: >
-                                    Everything should be made as <b><span class="color-red">simple</span></b>
-                                    as possible,<br>
-                                    but not <b><span class="color-red">simpler</span></b>
-            cite:                   Albert Einstein
-            text_color:             rgba_lighten_900
-            cite_color:             rgba_lighten
-            gridify:                true
-            darken:                 7
-            background_image:       /assets/images/quotes/albert_einstein.png
-            background_position_x:  50%
-            background_position_y:  45px
-
-
-  # --------------------------------------------------------
-  # example_quote_parallax
-  #
-  - banner:
-
-      enabled:                      true
-      id:                           example_parallax_banner
-      type:                         parallax_banner
-      style:                        dark
-      lane_span:                    fluid
+      enabled:                          false
+      id:                               parallax_banner_einstein
+      type:                             parallax_banner
+      style:                            dark
+      lane_span:                        fluid
+      helper_classes:                   mt-4 mb-4
 
       boxes:
-
         - box:
-            enabled:                true
-            type:                   quote
+            enabled:                    true
+            type:                       quote
             cite_text: >
-                                    <b>Making</b> is like <b>Wanting</b>,
-                                    <br> but even <b><span class="color-red">Better</span></b>
-            cite:                   J1 Team
-            text_color:             rgba_lighten_900
-            cite_color:             rgba_lighten
-            gridify:                true
-            darken:                 3
-            background_image:       /assets/images/quotes/default.png
-            background_position_x:  50%
-            background_position_y:  45px
-
-  # ------------------------------------------------------------------
+                                        Everything should be made as <b><span class="color-red">simple</span></b>
+                                        as possible,<br>
+                                        but not <b><span class="color-red">simpler</span></b>
+            cite:                       Albert Einstein
+            text_color:                 rgba_lighten_900
+            cite_color:                 rgba_lighten
+            gridify:                    true
+            darken:                     7
+            background_image:           /assets/images/quotes/albert_einstein.png
+
+  # ----------------------------------------------------------------------------
   # NEWS banner
-  # ------------------------------------------------------------------
+  # ----------------------------------------------------------------------------
 
-  # --------------------------------------------------------
+  # ----------------------------------------------------------------------------
   # home_news_banner
   #
   - banner:
-
-      enabled:                      true
-      id:                           home_news_banner
-      type:                         news_banner
-      style:                        light
-      lane_span:                    fixed
+      enabled:                          true
+      id:                               home_news_banner
+      type:                             news_banner
+      style:                            light
+      background_color_1:               md_gray_300
+      background_color_2:               md_gray_50
+      lane_span:                        fixed
+      helper_classes:                   mt-4 mb-4
 
       boxes:
-
         - box:
-            enabled:                true
-            type:                   header
-            title:                  Latest News
+            enabled:                    true
+            type:                       header
+            title:                      Latest News
 
         - box:
-            enabled:                true
-            type:                   preview
+            enabled:                    true
+            type:                       preview
             title:
-            category:               featured
+            category:                   featured
 
         - box:
-            enabled:                true
-            type:                   recent_news
-            title:                  More Articles
-            category:               featured
-            max_posts:              5
+            enabled:                    true
+            type:                       recent_news
+            title:                      More Articles
+            category:                   featured
+            max_posts:                  5