j1-template 2020.0.20 → 2021.0.0

data/lib/starter_web/pages/public/learn/examples/floating_div.adoc

@@ -1,209 +0,0 @@
----
-title:                                  CSS Examples
-tagline:                                floating div
-description:                            floating div
-
-tags:                                   [ Page, Roundtrip ]
-index:                                  [ Start, Template, Whats, Up, Readme, TL;DR ]
-categories:                             [ pages ]
-
-permalink:                              /pages/public/learn/fsb/
-regenerate:                             false
-
-resources:                              [ lightbox ]
-resource_options:
----
-
-// Enable the Liquid Preprocessor
-// -----------------------------------------------------------------------------
-:page-liquid:
-
-
-// Set other global page attributes here
-// -----------------------------------------------------------------------------
-//:my-asciidoc-attribute:
-
-//  Load Liquid procedures
-// -----------------------------------------------------------------------------
-{% capture set_env_entry_document %}themes/{{site.template.name}}/procedures/global/set_env_entry_document.proc{%endcapture%}
-
-
-// Initialize entry document environmental attributes
-// -----------------------------------------------------------------------------
-{% include {{set_env_entry_document}} %}
-
-// Load tag, url and data attributes
-// -----------------------------------------------------------------------------
-// include::{includedir}/attributes.asciidoc[tag=tags]
-// include::{includedir}/attributes.asciidoc[tag=urls]
-// include::{includedir}/attributes.asciidoc[tag=data]
-
-// Set local page attributes
-// -----------------------------------------------------------------------------
-// :images-dir:                         {imagesdir}/path/to/page/images
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-// Include sub-documents
-// -----------------------------------------------------------------------------
-
-++++
-    <div id="adblock" class="row no-gutters adblock">
-      <div class="doc-example mb-3">
-        <button type="button" class="btn btn-secondary btn-raised">Primary</button>
-        <button type="button" class="btn btn-secondary btn-raised">Secondary</button>
-        <button type="button" class="btn btn-success btn-raised">Success</button>
-        <button type="button" class="btn btn-info btn-raised">Info</button>
-        <button type="button" class="btn btn-warning btn-raised">Warning</button>
-        <button type="button" class="btn btn-danger btn-raised">Danger</button>
-        <button type="button" class="btn btn-link btn-raised">Link</button>
-      </div>
-    </div>
-++++
-
-++++
-<div class="">
-  <div class="floating-div">
-    <p>This "floating div" could be a form, a call to action, an ad,
-      or whatever other content you want to float in sidebar as the user
-      scrolls up and down the page.
-    </p>
-  </div>
-</div>
-++++
-
-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
-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
-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
-and pages.
-
-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
-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
-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
-and pages.
-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
-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
-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
-and pages.
-
-++++
-<style>
-
-  .adblock {
-  }
-
-  .adblock-fixed {
-    position: fixed;
-  }
-
-  .sidebar {
-    width:33.33%;
-    float:left;
-    padding: 0 10px;
-  }
-
-/*
-  .floating-div {
-    background-color: #333;
-    padding: 10px 50px;
-    color:#EEE;
-    font-size: 20px;
-    margin-top:10px;
-    position: absolute;
-    right: -40px;
-  }
-*/
-  .floating-div {
-      background-color: #333;
-      /* padding: 10px 50px; */
-      color: #EEE;
-      font-size: 20px;
-      /* margin-top: 10px; */
-      /* position: absolute; */
-      /* right: -40px; */
-  }
-
-  .sticky {
-    position: fixed;
-    top: 150px;
-    right:-40px;
-    margin: 0;
-    width:calc(33.33% - 25px);
-  }
-
-  .abs {
-    position: absolute;
-    bottom: 10px;
-    right:10px;
-    width:calc(33.33% - 20px);
-  }
-</style>
-
-<script>
-  $(document).ready(function() {
-    var dependencies_met_core = setInterval(function() {
-      if (j1.getState() == 'finished') {
-        // variables
-        var main_content      = $('.js-toc-content');
-        var m                 = $(main_content).offset().top;
-        var topPosition       = $('.floating-div').offset().top - 10;
-        var floatingDivHeight = $('.floating-div').outerHeight();
-        var footer            = $('#j1_footer');
-        var footerFromTop     = $('#j1_footer').offset().top;
-        var absPosition       = footerFromTop - floatingDivHeight - 20;
-        var win               = $(window);
-        var floatingDiv       = $('.floating-div');
-
-        win.scroll(function() {
-          if (window.matchMedia('(min-width: 768px)').matches) {
-            if ((win.scrollTop() > topPosition) && (win.scrollTop() < absPosition)) {
-              floatingDiv.addClass('sticky');
-              floatingDiv.removeClass('abs');
-
-            } else if ((win.scrollTop() > topPosition) && (win.scrollTop() > absPosition)) {
-              floatingDiv.removeClass('sticky');
-              floatingDiv.addClass('abs');
-
-            } else {
-              floatingDiv.removeClass('sticky');
-              floatingDiv.removeClass('abs');
-            }
-          }
-        });
-        clearInterval(dependencies_met_core);
-      }
-    }, 25);
-  });
-</script>
-++++

data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/000_includes/documents/100_meet_and_greet_jekyll.asciidoc

@@ -1,31 +0,0 @@
-
-*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.
-
-It is highly recommended to read and work on this tutorial by everyone - 
-independly from what level of knowledge they begin. Jekyll is different in 
-compare to classic Content Management Systems (CMS) like Joomla, Wordpress 
-or Drupal. No surprise: Jekyll and J1 is different as well.
-
-It sounds much, spending a whole day to get Jekyll to know - yes, it is much.
-You'll find a lot of Blog articles like *Jekyll in 15 minutes*. But what can
-be *learned* in 15 minutes?
-
-To be fair, most of these blogs are intended to help *installing Jekyll* and
-get the very first steps managed out of the box. If you run Jekyll out of the 
-box, the resulting web site (from the build-in theme scaffold) might somewhat 
-disillusioned. You'll get a very simple site created based on Jekyll's theme 
-*minima*.
-
-To not waste time, get through the turorial and find out what is the *Jekyll Way*.
-And if this the way you want to go.
-
-Have a good time, a good day learning Jekyll.
-
-
-== Meet and greet Jekyll
-
-lorem:sentences[5] +
-lorem:sentences[3] +

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

@@ -1,69 +0,0 @@
-// ~/document_base_folder/000_includes
-//  Asciidoc attribute includes:                 attributes.asciidoc
-// -----------------------------------------------------------------------------
-
-
-// URLs - Internal references and/or sources on the Internet
-// -----------------------------------------------------------------------------
-tag::urls[]
-
-:bootstrap-home:                                  https://getbootstrap.com/
-:bs_doc_components_modal:                         https://getbootstrap.com/docs/4.3/components/modal/
-
-:bootswatch-home:                                 https://bootswatch.com/
-:bootswatch-api:                                  https://bootswatch.com/help/#api
-
-:mdb-home:                                        https://mdbootstrap.com/
-:mdb-bs-modals:                                   https://mdbootstrap.com/docs/jquery/modals/basic/
-:mdb-bs-modals-legacy:                            https://mdbootstrap.com/legacy/4.3.2/?page=javascript/modals
-
-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[]
-
-: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"
-
-end::data[]
-
-
-// Product - Document (e.g release) information
-// -----------------------------------------------------------------------------
-tag::product_info[]
-:license:                                         MIT License
-:revdate:                                         2020
-:revnumber:                                       2020.1.0
-end::product_info[]
-
-
-// Author - Author information
-// -----------------------------------------------------------------------------
-tag::authors[]
-:uri-author-juergen-adams:                        https://jekyll.one
-end::authors[]

data/lib/starter_web/pages/public/learn/roundtrip/510_mdb_preview/000_includes/documents/100_buttons.asciidoc

@@ -1,170 +0,0 @@
-## Buttons
-
-See: https://fezvrasta.github.io/bootstrap-material-design/docs/4.0/material-design/buttons/[MD Buttons, window="_blank"]
-
-Buttons communicate the action that will occur when the user touches them.
-
-### Flat buttons
-
-Flat buttons are text-only buttons. They may be used in dialogs, toolbars,
-or inline. They do not lift, but fill with color on press.
-
-Outline buttons, i.e. `.btn-outline-*`, are the equivalent of Material flat
-buttons. For more details, please refer to Components/Buttons documentation.
-
-++++
-<div class="doc-example">
-  <button type="button" class="btn btn-primary">Primary</button>
-  <button type="button" class="btn btn-secondary">Secondary</button>
-  <button type="button" class="btn btn-success">Success</button>
-  <button type="button" class="btn btn-info">Info</button>
-  <button type="button" class="btn btn-warning">Warning</button>
-  <button type="button" class="btn btn-danger">Danger</button>
-  <button type="button" class="btn btn-link">Link</button>
-</div>
-++++
-
-[source, html]
-----
-  <button type="button" class="btn btn-primary">Primary</button>
-  <button type="button" class="btn btn-secondary">Secondary</button>
-  <button type="button" class="btn btn-success">Success</button>
-  <button type="button" class="btn btn-info">Info</button>
-  <button type="button" class="btn btn-warning">Warning</button>
-  <button type="button" class="btn btn-danger">Danger</button>
-  <button type="button" class="btn btn-link">Link</button>
-----
-
-### Raised buttons
-
-Raised buttons are rectangular-shaped buttons. They may be used inline. They
-lift and display ink reactions on press.
-
-Default buttons, i.e. `.btn`, are the equivalent of Material raised buttons.
-For more details, please refer to Components/Buttons documentation.
-
-++++
-<div class="doc-example">
-  <button type="button" class="btn btn-raised btn-primary">Primary</button>
-  <button type="button" class="btn btn-raised btn-secondary">Secondary</button>
-  <button type="button" class="btn btn-raised btn-success">Success</button>
-  <button type="button" class="btn btn-raised btn-info">Info</button>
-  <button type="button" class="btn btn-raised btn-warning">Warning</button>
-  <button type="button" class="btn btn-raised btn-danger">Danger</button>
-  <button type="button" class="btn btn-raised btn-link">Link</button>
-</div>
-++++
-
-[source, html]
-----
-  <button type="button" class="btn btn-raised btn-primary">Primary</button>
-  <button type="button" class="btn btn-raised btn-secondary">Secondary</button>
-  <button type="button" class="btn btn-raised btn-success">Success</button>
-  <button type="button" class="btn btn-raised btn-info">Info</button>
-  <button type="button" class="btn btn-raised btn-warning">Warning</button>
-  <button type="button" class="btn btn-raised btn-danger">Danger</button>
-  <button type="button" class="btn btn-raised btn-link">Link</button>
-----
-
-### Floating action buttons
-
-A floating action button represents the primary action in an application,
-it is used for a promoted action.
-
-++++
-<div class="doc-example">
-  <button type="button" class="btn bmd-btn-fab">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-</div>
-++++
-
-[source, html]
-----
-  <button type="button" class="btn bmd-btn-fab">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-----
-
-#### Colors
-
-++++
-<div class="doc-example">
-  <button type="button" class="btn bmd-btn-fab btn-primary my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-secondary my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-danger my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-info my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-success my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-warning my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-dark my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-light my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-</div>
-++++
-
-[source, html]
-----
-  <button type="button" class="btn bmd-btn-fab btn-primary my-1">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-secondary my-2">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  ...
-  <button type="button" class="btn bmd-btn-fab btn-dark my-7">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-  <button type="button" class="btn bmd-btn-fab btn-light my-8">
-    <i class="mdi mdi-plus mdi-2x"></i>
-  </button>
-----
-
-#### Sizes
-
-A smaller sized, i.e. mini floating action button, is also available.
-
-++++
-<div class="doc-example">
-  <button type="button" class="btn btn-danger bmd-btn-fab bmd-btn-fab-sm">
-    <i class="mdi mdi-plus mdi-sm"></i>
-  </button>
-</div>
-++++
-
-[source, html]
-----
-  <button type="button" class="btn btn-danger bmd-btn-fab bmd-btn-fab-sm">
-    <i class="mdi mdi-plus mdi-sm"></i>
-  </button>
-----
-
-## Recommended button placement
-
-Cards::
-  Buttons are best placed on the left side of a card to increase their
-  visibility. However, as cards have flexible layouts, buttons may be
-  placed in a location suited to the content and context, while
-  maintaining consistency within the product.
-
-Forms::
-  Button alignment on screen: Left. Place the affirmative button on the
-  left, the dismissive button on the right.
-
-Standard dialogs::
-  Button alignment on screen: right. Place the affirmative button on the
-  right, the dismissive button on the left.