j1-template 2021.0.9 → 2021.0.10

data/lib/starter_web/_data/blocks/banner.yml

@@ -175,8 +175,8 @@ settings:
                     icon:               rocket
                     icon_color:         md_white
                     icon_size:          24px
-                    href:               /pages/public/learn/kickstarter/web_in_a_day/meet_and_greet/
-                    target:
+                    href:               "https://jekyll.one/pages/public/learn/kickstarter/web_in_a_day/meet_and_greet/"
+                    target:             blank
 
                 # - name:                 Patreon button
                 #   button:

data/lib/starter_web/_data/blocks/panel.yml

@@ -324,7 +324,7 @@ settings:
               enabled:                  true
               category:                 featured
 #             truncatewords:            30                                      # currently NOT used
-              max_posts:                6
+              max_posts:                3
               readmore_text:            Read
 
   # # ----------------------------------------------------------------------------

data/lib/starter_web/_data/modules/defaults/toccer.yml

@@ -161,8 +161,8 @@ defaults:
   throttleTimeout:                      150
   scrollSmooth:                         true
   scrollSmoothDuration:                 300
-  scrollSmoothOffset:                   -90                                     # TODO: to be removed, calculated dynamically
-  scrollContainer:                      null                                    # ??? scrollContainer
+  scrollSmoothOffset:                   10                                      # TODO: to checked, if set dynamically with toccer adapter
+  scrollContainer:                      null                                    # TODO: to checked, what this option does
 
 # ------------------------------------------------------------------------------
 # END config

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

@@ -66,15 +66,15 @@
     - title:                            Asciidoc Skeletons
       icon:                             television-guide
       dropdown:
-        - title:                        Book
-          href:                         /pages/public/skeleton/book/
-          icon:                         book-open-blank-variant
-        - title:                        Multi-Document
-          href:                         /pages/public/skeleton/multi/
-          icon:                         file-document-multiple-outline
         - title:                        Simple-Document
           href:                         /pages/public/skeleton/simple/
           icon:                         file-document-outline
+        - title:                        Multi-Document
+          href:                         /pages/public/skeleton/multi/
+          icon:                         file-document-multiple-outline
+        - title:                        Book
+          href:                         /pages/public/skeleton/book/
+          icon:                         book-open-blank-variant
 
 # ------------------------------------------------------------------------------
 # Menu BLOG

data/lib/starter_web/_includes/attributes.asciidoc

@@ -5,6 +5,9 @@
 // URLS, global references to internal|external web links (macro link:)
 // -----------------------------------------------------------------------------
 tag::urls[]
+
+:url-about-cookies--home:                         http://www.aboutcookies.org
+
 :url-animate-css--home:                           https://animate.style/
 :url-anime--home:                                 https://animejs.com/
 
@@ -96,6 +99,7 @@ tag::urls[]
 
 :url-cash--gh-repo:                               https://github.com/fabiospampinato/cash
 :url-clipboard--gh-repo:                          https://github.com/zenorocha/clipboard.js/
+
 :url-cors--gh-repo:                               https://github.com/expressjs/cors
 :url-cross-env--gh-repo:                          https://github.com/kentcdodds/cross-env
 :url-cross-var--gh-repo:                          https://github.com/elijahmanor/cross-var
@@ -146,14 +150,13 @@ tag::urls[]
 :url-j1--home:                                    https://jekyll.one/
 :url-j1--preview:                                 https://preview.jekyll.one/
 
-:url-j1-web-in-a-day--intro:                      /pages/public/learn/kickstarter/web_in_a_day/intro/
-:url-j1-web-in-a-day--meet-and-greet:             /pages/public/learn/kickstarter/web_in_a_day/meet_and_greet/
-:url-j1-web-in-a-day--preparations:               /pages/public/learn/kickstarter/web_in_a_day/preparations/
-:url-j1-web-in-a-day--first-awesome-web:          /pages/public/learn/kickstarter/web_in_a_day/first_awesome_web/
+:url-j1-web-in-a-day--meet-and-greet:             https://jekyll.one/pages/public/learn/kickstarter/web_in_a_day/meet_and_greet/
 
 :url-j1-quick-references--jekyll:                 /pages/protected/manuals/quick_references/jekyll/
 :url-j1-downloads--quickstart-intro:              /pages/public/learn/downloads/quickstart/intro/
 
+:url-j1-roundtrip--present-images:                /pages/public/learn/roundtrip/present_images/
+
 :url-j1-learn--whats-up:                          https://jekyll.one/pages/public/learn/whats_up/
 :url-j1-learn--present-images:                    https://jekyll.one/pages/public/learn/roundtrip/present_images/
 :url-j1-learn--present-videos:                    https://jekyll.one/pages/public/learn/roundtrip/present_videos/
@@ -236,6 +239,8 @@ tag::urls[]
 
 :url-owl-carousel-v1--home:                       http://www.landmarkmlp.com/js-plugin/owl.carousel/
 
+:url-owasp-attacks--csrf:                         https://owasp.org/www-community/attacks/csrf
+
 :url-parseurl--gh-repo:                           https://github.com/pillarjs/parseurl
 
 :url-platform--gh-repo:                           https://github.com/bestiejs/platform.js/
@@ -275,6 +280,9 @@ tag::urls[]
 :url-sass-lang--home:                             https://sass-lang.com/dart-sass
 :url-sass-lang--gh-repo:                          https://github.com/sass/dart-sass
 
+:url-jamstack--home:                              https://jamstack.org/
+:url-jamstack--generators:                        https://jamstack.org/generators/
+
 :url-shopify--home:                               https://www.shopify.com/
 
 :url-stackoverflow--usage-fonticons:              https://stackoverflow.com/questions/11135261/should-i-use-i-tag-for-icons-instead-of-span
@@ -384,7 +392,7 @@ end::tables[]
 // -----------------------------------------------------------------------------
 tag::products[]
 :j1-license:                                      MIT License
-:j1-version:                                      2021.0.9
+:j1-version:                                      2021.0.10
 end::products[]
 
 

data/lib/starter_web/_plugins/lunr_index.rb

@@ -341,6 +341,6 @@ end
 
 module Jekyll
   module J1LunrSearch
-    VERSION = '2021.0.9'
+    VERSION = '2021.0.10'
   end
 end

data/lib/starter_web/assets/images/modules/icons/d1/scalable/d1.svg

@@ -14,7 +14,7 @@
    version="1.1"
    inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)"
    sodipodi:docname="d1.svg"
-   inkscape:export-filename="C:\Temp\d10n-2021.0.9\assets\images\modules\icons\d1\d1-256x256.png"
+   inkscape:export-filename="C:\Temp\d10n-2021.0.10\assets\images\modules\icons\d1\d1-256x256.png"
    inkscape:export-xdpi="49.152"
    inkscape:export-ydpi="49.152">
   <title

data/lib/starter_web/collections/posts/public/featured/_posts/{0000-00-00-welcome-to-j1-template.adoc.erb → 0000-00-00-welcome-to-j1.adoc.erb}

@@ -68,6 +68,20 @@ A static site serves the content straight to the user as it is stored on
 the server-side. To put it in another way, in opposition to WordPress
 which use a database to load dynamic content, a static site will display
 the same content to every user as it will directly load the HTML files
+on the server.
+
+A static website uses server-side rendering to serve pre-built HTML, CSS,
+and JavaScript files to a web browser, in contrast to traditional dynamic
+sites that work by rendering the webpage at the time of the request.
+Static sites enable you to decouple your content repository and front-end
+interface, giving you greater flexibility in how your content is served.
+Cost-efficiency is another reason companies migrate to a static site because
+static files are lightweight and often faster and cheaper to serve.
+
+In the last few years, static sites have greatly increased in popularity.
+This surge is primarily due to advances in developer tools (languages and
+libraries) and a stronger desire among businesses to optimize website
+performance beyond the limits of a database-driven site.
 
 === What's different?
 
@@ -76,6 +90,14 @@ generate the content of a page when a user requests it. For example,
 building a website using WordPress CMS will result in having a dynamic
 Website.
 
+Static sites can be written almost exclusively in HTML and serve a fixed
+set of data that renders the same for every site visitor. Static sites use
+server-side rendering to serve pre-built HTML, CSS, and JavaScript files to
+a web browser. Dynamic sites operate in a completely different way, by
+leveraging HTML and CSS as well as server-side scripting languages like PHP
+to build webpages on the fly and serve different content to each site
+visitor.
+
 === Why use a static site?
 
 What are the advantages of a static website over a dynamic site?
@@ -85,8 +107,7 @@ come the main advantages of using a static site over a dynamic
 one.
 
 Performance::
-The better performance and a crazy fast load time.
-
+*The better performance and a crazy fast load time*.
 One of the main advantages of using a static site is the fact that
 it is crazy fast to load. Indeed, when the user requests a page, there is
 no need to request a database and various files to generate the
@@ -99,8 +120,7 @@ that’s why having fast loading times will participate in making your
 website mobile-friendly.
 
 Security::
-Having a static website: say goodbye to hacking and security issues.
-
+*Having a static website: say goodbye to hacking and security issues*.
 Tired of getting WordPress notifications about security issues and
 updates every week? No worries, as a static site has no database, there
 are close to no hack possible compared to a WordPress website. Indeed,
@@ -110,8 +130,7 @@ static website is one the main reason why many famous brands switch to
 a static site instead of having their website on Drupal or WordPress.
 
 Hosting::
-Building a static site and hosting: you will save you money.
-
+*Building a static site and hosting: you will save you money*.
 Using a static site, you will only have most of the time only HTML and
 CSS files to host. This kind of files is super light which also means
 that you will not need a powerhouse hosting to have a static site up and
@@ -120,9 +139,8 @@ go down contrary to a dynamic site which should request the database
 each time for each user.
 
 Control::
-You're the master.
-
-Using a CMS means, giving control over your site to others. Simple like this.
+*You're the master*. Using a CMS means, giving control over your site to others.
+Simple like this.
 
 == Why use a site generator?
 
@@ -143,11 +161,9 @@ As the popularity of static sites is growing, there are plenty of static
 site generators available on the market. The more famous is Jekyll,
 Middleman and Hugo. Each one has its own specificities and may suits you
 better depending on the programming languages you already are familiar with.
-
 Which static site generator should I use?
 
 When I decided to go for a blog based on a static web, I personally
 choose Jekyll as for me. It's a well known static site generator, good support
-in case of trouble and the software gets regularly  updated.
-
-This blog is powered by Jekyll. For good reasons.
+in case of trouble and the software gets regularly updated. This website is
+powered by Jekyll. For good reasons.

data/lib/starter_web/collections/posts/public/featured/_posts/{2020-05-01-top-open-source-static-site-generators.adoc → 2020-05-01-top-site-generators.adoc}

@@ -1,6 +1,6 @@
 ---
-title:                                  Site generators
-tagline:                                OpenSource tools
+title:                                  Free site generators
+tagline:                                top site generators
 date:                                   2020-05-01 00:00:00
 
 tags:                                   [ Jekyll, Generators ]
@@ -55,7 +55,7 @@ excerpt__end
 
 // Load page attributes
 // -----------------------------------------------------------------------------
-{% include {{load_attributes}} scope="none" %}
+{% include {{load_attributes}} scope="global" %}
 
 
 // Page content
@@ -68,7 +68,7 @@ excerpt__end
 == Static Site Generators
 
 [role="mb-3"]
-image::/assets/images/collections/blog/featured/staticgen.jpg[{{page.title}}]
+image::/assets/images/collections/blog/featured/markus-spiske-2.jpg[{{page.title}}]
 
 A typical CMS driven website works by building each and every page dynamically.
 That means fetching the content from a database to pass them over to a template
@@ -80,10 +80,8 @@ This means each page is assembled on demand.
 For many, many websites dynamic page generation is entirely unnecessary and
 adds unwanted risks in terms of complexity, performance losses and security
 issues. After all, the content of most websites changes only, when the content
-authors make changes.
-
-Why the hell should a web page always assembled on demand if there are no
-changes?
+authors make changes. Why the hell should a web page always assembled on
+demand if there are no changes?
 
 NOTE: To be fair, most CMS are providing caching systems for web pages to
 prevent unnecessary creation processes. It is not easy to implement such
@@ -99,11 +97,8 @@ content, only selected pages will rebuild.
 This means overall, statically build web pages having no moving parts in the
 deployed website. This results in browser-side caching only, the performance
 goes up, and static sites are far more secure because they build already.
-
 To find out what OpenSource Static Site Generators are available today and
-their ranking in terms of popularity go for StaticGen You'll find the most
-complete list of generators!
-
-Check https://www.staticgen.com[StaticGen].
+their ranking in terms of popularity go for Jamstack You'll find the most
+complete list of generators used today.
 
-Have fun!
+Check with {url-jamstack--generators}[Jamstack, {browser-window--new}]!

data/lib/starter_web/collections/posts/public/featured/_posts/2020-06-01-about-cookies.adoc

@@ -61,7 +61,7 @@ excerpt__end
 
 // Load page attributes
 // -----------------------------------------------------------------------------
-{% include {{load_attributes}} scope="none" %}
+{% include {{load_attributes}} scope="global" %}
 
 
 // Page content
@@ -75,44 +75,35 @@ excerpt__end
 
 In short words. A cookie is a small piece of data that a website asks your
 browser to store on your computer or mobile device. The cookie allows the
-website to "remember" your actions or preferences over time.
-
-Most browsers support cookies, but users can set their browsers to decline
-them and can delete them whenever they like.
-
-Good to know.
-
-== For what reasons cookies are used
+website to "remember" your actions or preferences over time. All modern
+browsers support cookies, but users can set their browsers to decline them
+and can delete them whenever they like. Good to know.
 
 Websites mainly use cookies for:
 
 Identification::
-identify users
+Identify users
 
 General information storage::
-remember users' custom preferences
+Remember users' custom preferences
 
 Support::
-help users complete tasks without having to re‑enter information
+Help users complete tasks without having to re‑enter information
 when browsing from one page to another or when visiting the site later.
 
 Track behavioural::
 Cookies can also be used for online behavioural target advertising and to
 show adverts relevant to something that the user searched for in the past.
-
 The web server supplying the webpage can store a cookie on the user's
-computer or mobile device. An external web server that manages files
-included or referenced in the webpage is also able to store cookies.
+computer or mobile device.
 
 All these cookies are called http header cookies. Another way of storing
 cookies is through JavaScript code contained or referenced in that page.
-
 Each time the user requests a new page, the web server can receive the
 values of the cookies it previously set and return the page with content
 relating to these values. Similarly, JavaScript code is able to read a
 cookie belonging to its domain and perform an action accordingly.
 
-
 .How are they used
 [NOTE]
 ====
@@ -128,57 +119,67 @@ relating to these values. Similarly, JavaScript code is able to read a
 cookie belonging to its domain and perform an action accordingly.
 ====
 
-
 == Types of cookies
 
-A cookie can be classified by its lifespan and the domain to which it belongs.
-By lifespan, a cookie is either a:
+HTTP cookies are essential to the modern Internet but potentially a
+vulnerability to your privacy. As a necessary part of web browsing, cookies
+help web developers give you more personal, convenient website visits.
+Cookies let websites remember you, your website logins, shopping carts and
+more. But they can also be a treasure trove of private info for criminals
+to spy on.
+
+Since the data in cookies doesn't change, cookies themselves aren't harmful.
+They *can't infect* computers with viruses or other malware. However, some
+cyberattacks can hijack cookies and enable access to your browsing sessions.
+The danger lies in their ability to track individuals' browsing histories.
+Cookies generally can be classified by its *lifespan* and the *domain* to
+which it belongs.
+
+Cookies classified by *lifespan* are either a:
 
 Session cookie::
-which is erased when the user closes the browser or
+Session cookies gets automatically deleted when the user closes the web browser
+and all open window tabs.
 
 Persistent cookie::
-which remains on the user's computer/device for a pre-defined period of time.
+A persistent cookie *remains* on the user's computer/device for a pre-defined
+period of time.
 
-As for the domain to which it belongs, there are either:
+Cookies classified by the *domain* to which it belongs, are either of:
 
 First-party cookie::
-cookies which are set by the web server of the visited page and share the
-same domain
+First-party cookie cookies are set by the web server of the visited page
+and share the *same domain* you're visting. These are generally safer, as
+long as users are browsing reputable websites or ones that have not been
+compromised.
 
 Third-party cookies::
-cookies stored by a different domain to the visited page's domain.
-This can happen when the webpage references a file, such as JavaScript,
-located outside its domain.
-
+Third-party cookies are stored by a *different* domain to the visited page.
+This can happen when the webpage references a files located outside its domain.
+Third-party cookies let advertisers or analytics companies track the user's
+browsing history across the web on *any* sites that contain their ads.
 
-== How do a site use cookies?
 
-Adjust this part of the page according to your needs.
+== Security aspects on using cookies
 
-Explain which cookies you use in plain, jargon-free language. In particular:
-
-*	their purpose and the reason why they are being used, (e.g. to remember
-users' actions, to identify the user, for online behavioural advertising)
-*	if they are essential for the website or a given functionality to work
-or if they aim to enhance the performance of the website
-*	the types of cookies used (e.g. session or permanent, first or third-party)
-*	who controls/accesses the cookie-related information (website or third party)
-*	that the cookie will not be used for any purpose other than the one stated
-*	how consent can be withdrawn.
-
-You can use as example the top level "cookie notice" of the Commission homepage.
-If your site does not use any cookies, just declare it (e.g. The Information
-Providers Guide site does not use any cookies). If your site uses the same
-cookies as the Commission homepage, you can just link to the top level
-cookie notice.
+Without cookies the web would not work as it does today. However, since the
+mid 90ies when cookies were invented, the web changed quite a lot and so did
+the attack methods on web applications; as mentioned the internet is not a
+friendly place.
 
+A well-known attack method is known as Cross Site Request Forgery, or short
+*CSRF*. CSRF is an attack, a criminal act, that forces an end user to execute
+unwanted actions. Cookie may play a *role* in such scenarios but they are
+not generally *unsafe*. If you want you can read more about that in the
+CRSF Page on {url-owasp-attacks--csrf}[OWASP, {browser-window--new}].
 
 == How to control cookies
 
-You can control and/or delete cookies as you wish – for details,
-see http://www.aboutcookies.org[aboutcookies.org]. You can delete
+Users can take control, used or *not* used, or delete cookies. For more
+details, see {url-about-cookies--home}[aboutcookies.org]. You can delete
 all cookies that are already on your computer and you can set most
-browsers to prevent them from being placed. If you do this, however,
-you may have to manually adjust some preferences every time you visit
-a site and some services and functionalities may not work.
+browsers to prevent them from being placed.
+
+If you do this, however, you may have to manually adjust some preferences
+every time you visit a site and some services and functionalities may not
+work.