j1-template 2021.0.16 → 2021.1.4

data/assets/data/footer.org.html

@@ -0,0 +1,249 @@
+---
+regenerate:                             true
+---
+{% capture cache %}
+
+{% comment %}
+ # -----------------------------------------------------------------------------
+ # ~/assets/data/footer.html
+ # Liquid procedure to generate HTML (data) portion of the page footer for
+ # (fragmented) AJAX load
+ #
+ # Product/Info:
+ # https://jekyll.one
+ #
+ # Copyright (C) 2021 Juergen Adams
+ #
+ # J1 Template is licensed under the MIT License.
+ # See: https://github.com/jekyll-one-org/J1 Template/blob/master/LICENSE
+ # -----------------------------------------------------------------------------
+ # Test data:
+ #    {{ variable | debug }}
+ # -----------------------------------------------------------------------------
+{% endcomment %}
+
+<!-- [INFO   ] [j1.assets.data.footer              ] [Footer generated: {{site.time}}] -->
+
+{% comment %} Liquid procedures
+-------------------------------------------------------------------------------- {% endcomment %}
+{% capture select_color       %}themes/{{site.template.name}}/procedures/global/select_color.proc{% endcapture %}
+{% capture select_icon_size   %}themes/{{site.template.name}}/procedures/global/select_icon_size.proc{% endcapture %}
+{% capture about_box          %}themes/{{site.template.name}}/blocks/footer/boxes/about_box.proc{% endcapture %}
+{% capture news_box           %}themes/{{site.template.name}}/blocks/footer/boxes/news_box.proc{% endcapture %}
+{% capture links_box          %}themes/{{site.template.name}}/blocks/footer/boxes/links_box.proc{% endcapture %}
+{% capture contacts_box       %}themes/{{site.template.name}}/blocks/footer/boxes/contacts_box.proc{% endcapture %}
+{% capture legal_statements   %}themes/{{site.template.name}}/blocks/footer/boxes/legal_statements.proc{% endcapture %}
+{% capture issue              %}themes/{{site.template.name}}/blocks/footer/boxes/issue.proc{% endcapture %}
+{% capture social_media_icons %}themes/{{site.template.name}}/blocks/footer/boxes/social_media_icons.proc{% endcapture %}
+
+{% comment %} Process YML config data
+================================================================================ {% endcomment %}
+
+{% comment %} Set config files
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign footer_config_defaults = site.data.blocks.defaults.footer %}
+{% assign footer_config_settings = site.data.blocks.footer %}
+
+{% comment %} Set config data
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign environment            = site.environment %}
+
+{% assign footer_config_defaults = footer_config_defaults.defaults %}
+{% assign footer_config_settings = footer_config_settings.settings %}
+
+{% comment %} Variables
+-------------------------------------------------------------------------------- {% endcomment %}
+
+{% assign production = false %}
+{% if environment == 'prod' or environment == 'production' %}
+  {% assign production = true %}
+{% endif %}
+
+{% comment %} Set HELPER variables
+-------------------------------------------------------------------------------- {% endcomment %}
+{% capture footer_config_file_name %}~/_data/modules/footer.yml{% endcapture %}
+
+<!-- [INFO   ] [j1.assets.data.footer.html             ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
+<!-- head>
+  <meta name="robots" content="noindex, nofollow" />
+</head -->
+
+{% comment %} Main
+================================================================================ {% endcomment %}
+{% for items in footer_config_settings %}
+  {% assign key             = items[0] %}
+  {% assign value           = items[1] %}
+  {% assign footer_config   = value %}
+
+  {% for items in footer_config %}
+    {% for footers in items %}
+
+      {% if debug %} footers: {{ footers }} {% endif %}
+
+      {% comment %} parse settings for MAIN keys
+      -------------------------------------------------------------------------- {% endcomment %}
+      {% for footer in footers %}
+        {% assign data_type = footer | is_type %}
+        {% if data_type == 'hash' %}
+          {% assign footer_settings = footer %}
+        {% endif %}
+      {% endfor %}
+
+      {% if debug %} <!-- footer_settings.boxes: {{ footer_settings.boxes }} --> {% endif %}
+
+
+      {% comment %} process current footer
+      -------------------------------------------------------------------------- {% endcomment %}
+      {% if footer_settings.enabled %}
+
+        {% assign enabled_boxes   = 0 %}
+        {% assign footer_options  = footer_config_defaults.footer | merge: footer_settings %}
+        {% if debug %} <!-- footer_options: {{ footer_options }} --> {% endif %}
+
+        {% comment %} Calculate number of enabled footer boxes
+        ------------------------------------------------------------------------ {% endcomment %}
+        {% for property in footer_options.boxes %}
+          {% if debug %} <!-- property:  {{property}} --> {% endif %}
+          {% if property.enabled %} {% assign enabled_boxes = enabled_boxes | plus:1 %} {% endif %}
+        {% endfor %}
+        {% assign footer_box_width_md = 12 | divided_by:enabled_boxes %}
+        <!-- [INFO   ] [j1.assets.data.footer              ] [Set footer box column width to: {{ footer_box_width_md }}] -->
+
+        <!-- div id="{{footer_config_defaults.container-id}}" class="{{footer_options.theme}}" -->
+        <div id="{{footer_config_defaults.container-id}}">
+          <div class="footer">
+
+            <div class="container">
+              <div class="row">
+
+              {% comment %} Collect footer config data
+              ------------------------------------------------------------------ {% endcomment %}
+              {% for box in footer_options.boxes %}
+
+                {% comment %} COLLECT|PLACE footer boxes
+                ---------------------------------------------------------------- {% endcomment %}
+                {% case box.type %}
+
+                {% comment %} PLACE AboutBox
+                ---------------------------------------------------------------- {% endcomment %}
+                {% when 'about' %}
+                  {% if box.enabled %}
+                    {% include {{about_box}} title=box.title tagline=box.tagline text=box.text justify=box.justify %}
+                  {% endif %}
+
+                  {% comment %} Reset element variable
+                  -------------------------------------------------------------- {% endcomment %}
+                  {% assign footer_options.boxes = nil %}
+
+                {% comment %} PLACE NewsBox
+                ---------------------------------------------------------------- {% endcomment %}
+                {% when 'news' %}
+                  {% if box.enabled %}
+                    {% include {{news_box}} title=box.title tagline=box.tagline category=box.category max_posts=box.max_posts posts=site.posts %}
+                  {% endif %}
+
+                  {% comment %} Reset element variable
+                  -------------------------------------------------------------- {% endcomment %}
+                  {% assign footer_options.boxes = nil %}
+
+                {% comment %} PLACE LinksBox
+                --------------------------------------------------------------- {% endcomment %}
+                {% when 'references' %}
+                  {% if box.enabled %}
+                    {% include {{links_box}} title=box.title tagline=box.tagline links=box.links %}
+                  {% endif %}
+
+                  {% comment %} Reset element variable
+                  -------------------------------------------------------------- {% endcomment %}
+                  {% assign footer_options.boxes = nil %}
+
+                {% comment %} PLACE ContactsBox
+                --------------------------------------------------------------- {% endcomment %}
+                {% when 'contact' %}
+                  {% if box.enabled %}
+                    {% include {{contacts_box}} %}
+                  {% endif %}
+
+                  {% comment %} Reset element variable
+                  -------------------------------------------------------------- {% endcomment %}
+                  {% assign footer_options.boxes = nil %}
+
+                {% else %}
+                  {% comment %} Collect EXCEPTION
+                  -------------------------------------------------------------- {% endcomment %}
+                  {% unless box.type == 'exception_container' %}
+                  <div id="exception_container">
+                    <div id="{{panel_settings.id}}" class="container-fluid no-padding">
+                      <div class="col-md-12 col-sm-12 col-xs-12 no-padding">
+                        <div class="box">
+                          <div class="content content-danger">
+                            <h2 class="notoc">
+                              <i class="mdi mdi-alarm-light mdi-3x mdi-md-red mr-1"></i>
+                              panel of type <big>{{panel_settings.type}}</big> not found
+                            </h2>
+                            <h4 class="notoc box-title">Check your configuration at {{panel_config_file_name}}</h4>
+                            <div class="box-description">
+                              Don't worry about this. Maybe you've a typo in the panel configuration.
+                              Check the panel config file for the unknown type. <br />
+                              Check for something wrong like:
+                              <div class="mt-2 mb-2">
+                                <b>id:       {{panel_settings.id}}</b>  <br />
+                                <b>type:     {{panel_settings.type}}</b> <br />
+                                <b>comment:  {{panel_settings.comment}}</b>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div> <!-- End panel {{panel_settings.id}} -->
+                  </div> <!-- End exception_container -->
+                  {% endunless %}
+
+                {% endcase %}
+
+                {% comment %} END footer boxes
+                ---------------------------------------------------------------- {% endcomment %}
+
+              {% endfor %}
+              </div>
+            </div>
+          </div>
+
+          {% comment %} COLLECT|PLACE copyright|issue date information
+          ---------------------------------------------------------------------- {% endcomment %}
+          <div class="copyright">
+            <div class="container">
+              <div class="row">
+                <!-- [INFO   ] [j1.assets.data.footer              ] [Enable horizontal list using id #inline] -->
+                <div class="col-md-10" id="inline">
+                {% include {{legal_statements}} legals=footer_options.legals %}
+                </div>
+                <div class="col-md-10" id="inline">
+                {% include {{issue}} %}
+                </div>
+                <div class="col-md-2">
+                {% include {{social_media_icons}} icons=footer_options.icons %}
+                </div>
+              </div>
+            </div>
+          </div>
+
+        </div>
+
+        {% comment %} Reset element variables (already processed)
+        ------------------------------------------------------------------------ {% endcomment %}
+        {% assign footer_settings = nil %}
+
+      {% endif %}
+
+    {% endfor %}
+  {% endfor %}
+{% endfor %}
+
+{% endcapture %}
+{% if production %}
+  {% capture _LINE_FEED %}{% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment %}{{ cache | strip_html_comments }}{% else %}{% capture _content %}{{ cache | strip_html_comments }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd p rt rp optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}</{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "<!-- -->" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "<pre" %}{% assign _content = "" %}{% for _pre_before in _pre_befores %}{% assign _pres = _pre_before | split: "</pre>" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "</pre>" %}<pre{{ _pres.first }}</pre>{% endif %}{% unless _pre_before contains "</pre>" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " <e;<e; </e>;</e>;</e> ;</e>" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %} <table id="compress_html_profile_{{ site.time | date: "%Y%m%d" }}" class="compress_html_profile"> <thead> <tr> <td>Step <td>Bytes <tbody> <tr> <td>raw <td>{{ cache | strip_html_comments | size }}{% if _profile_endings %} <tr> <td>endings <td>{{ _profile_endings }}{% endif %}{% if _profile_startings %} <tr> <td>startings <td>{{ _profile_startings }}{% endif %}{% if _profile_comments %} <tr> <td>comments <td>{{ _profile_comments }}{% endif %}{% if _profile_collapse %} <tr> <td>collapse <td>{{ _profile_collapse }}{% endif %}{% if _profile_clippings %} <tr> <td>clippings <td>{{ _profile_clippings }}{% endif %} </table>{% endif %}{% endif %}
+{% else %}
+  {{ cache | pretty_print | remove:'<html><body>' | remove:'</body></html>' | strip_empty_lines }}
+{% endif %}
+{% assign cache = nil %}

data/assets/data/galleries.json

@@ -50,8 +50,8 @@ regenerate:                             true
 -------------------------------------------------------------------------------- {% endcomment %}
 {% assign environment         = site.environment %}
 
-{% assign jg_config_defaults  = apps.defaults.justified_gallery.defaults %}
-{% assign jg_config_settings  = apps.justified_gallery.settings %}
+{% assign jg_config_defaults  = apps.defaults.justifiedGallery.defaults %}
+{% assign jg_config_settings  = apps.justifiedGallery.settings %}
 
 {% comment %} Set config options
 -------------------------------------------------------------------------------- {% endcomment %}

data/assets/data/gallery_customizer.html

@@ -35,8 +35,8 @@ regenerate:                             true
 -------------------------------------------------------------------------------- {% endcomment %}
 {% assign environment         = site.environment %}
 
-{% assign customizer_defaults = apps.defaults.gallery_customizer.defaults %}
-{% assign customizer_settings = apps.gallery_customizer.settings %}
+{% assign customizer_defaults = apps.defaults.justifiedGalleryCustomizer.defaults %}
+{% assign customizer_settings = apps.justifiedGalleryCustomizer.settings %}
 
 {% comment %} Set config options
 -------------------------------------------------------------------------------- {% endcomment %}
@@ -47,9 +47,17 @@ regenerate:                             true
   {% assign production = true %}
 {% endif %}
 
-{% comment %} Main
--------------------------------------------------------------------------------- {% endcomment %}
-<!-- [INFO   ] [j1.gallery_customizer              ] [Placement of the Drawer] -->
+<!-- [INFO   ] [j1.assets.data.banner.html             ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
+<head>
+  <meta name="robots" content="noindex, nofollow" />
+</head>
+
+<!-- div id="galleryCustomizer" -->
+<div id="{{customizer_options.xhr_data_element}}">
+
+  {% comment %} Main
+  -------------------------------------------------------------------------------- {% endcomment %}
+  <!-- [INFO   ] [j1.gallery_customizer              ] [Placement of the Drawer] -->
 
   <nav class="nav bmd-layout-container bmd-drawer-f-l">
 
@@ -160,7 +168,9 @@ regenerate:                             true
     </div>
 
   </nav>
-<!-- [INFO   ] [j1.gallery_customizer.html         ] [END: Drawer|Form] -->
+  <!-- [INFO   ] [j1.gallery_customizer.html         ] [END: Drawer|Form] -->
+
+</div>
 
 {% endcapture %}
 {% if production %}

data/assets/data/menu.html

@@ -137,6 +137,11 @@ regenerate:                             true
 {% include {{select_icon_size}} family=nav_menu_icon_family size=nav_menu_icon_size %}
 {% assign nav_menu_icon_size = size %}
 
+<!-- [INFO   ] [j1.assets.data.menu.html             ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
+<head>
+  <meta name="robots" content="noindex, nofollow" />
+</head>
+
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
 
@@ -144,9 +149,9 @@ regenerate:                             true
 <!-- div id="{{nav_menu_id}}" class="{{dropdown_collapse}}" -->
 <!-- div class="{{dropdown_collapse}}" -->
   {% if nav_menu_animation %}
-  <ul id="desktop_menu" class="nav navbar-nav navigator navbar-{{nav_bar_position}}" data-in="{{animate_in}}" data-out="{{animate_out}}">
+  <ul id="{{nav_menu_options.xhr_data_element}}" class="nav navbar-nav navigator navbar-{{nav_bar_position}}" data-in="{{animate_in}}" data-out="{{animate_out}}">
   {% else %}
-  <ul id="desktop_menu" class="nav navbar-nav navigator navbar-{{nav_bar_position}}" data-in="fadeIn" data-out="fadeOut">
+  <ul id="{{nav_menu_options.xhr_data_element}}" class="nav navbar-nav navigator navbar-{{nav_bar_position}}" data-in="fadeIn" data-out="fadeOut">
   {% endif %}
 
   {% for menu in navigator_menu_config %}

data/assets/data/mmenu.html

@@ -82,11 +82,15 @@ regenerate:                             true
 {% assign icon_size   = navigator_options.icon_size %}
 {% assign icon_color  = navigator_options.icon_color %}
 
+<!-- [INFO   ] [j1.assets.data.mmenu.html             ] [ set meta data (robots) to exclude HTML data files from index ] -->
+<head>
+  <meta name="robots" content="noindex, nofollow" />
+</head>
 
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
-
-  <!-- [DEBUG  ] [j1.modules.mmenu.html  ] [collect all nav links for the navigation ] -->
+  <!-- [INFO   ] [[j1.assets.data.mmenu.html        ] [collect all nav links for the mobile navigation ] -->
+  <!-- [INFO   ] [[j1.assets.data.mmenu.html        ] [id menu_mmenu set statically and MUST as configured  ] -->
   <ul id="menu_mmenu" class="partial" style="display:none">
 
   {% for menu in navigator_menu_config %}

data/assets/data/mmenu_sidebar.html

@@ -78,9 +78,13 @@ regenerate:                             true
 {% assign icon_size   = navigator_options.icon_size %}
 {% assign icon_color  = navigator_options.icon_color %}
 
+<!-- [INFO   ] [j1.assets.data.mmenu.html             ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
+<head>
+  <meta name="robots" content="noindex, nofollow" />
+</head>
+
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
-
 <!-- [INFO   ] [ j1.modules.navigator.mmenu_sidebar.html ] [Start processing: sidebar] -->
 <div id="{{sidebar_options.id}}" class="mm-side" style="display:none">
 {% for boxes in sidebar_options.boxes %}

data/assets/data/mmenu_toc.html

@@ -35,6 +35,10 @@ regenerate:                             true
   {% assign production = true %}
 {% endif %}
 
+<!-- [INFO   ] [j1.assets.data.mmenu_toc.html           ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
+<head>
+  <meta name="robots" content="noindex, nofollow" />
+</head>
 
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}

data/assets/data/panel.html

@@ -63,6 +63,10 @@ regenerate:                             true
   {% assign production = true %}
 {% endif %}
 
+<!-- [INFO   ] [j1.assets.data.panel.html             ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
+<head>
+  <meta name="robots" content="noindex, nofollow" />
+</head>
 
 {% comment %} Main
 ================================================================================ {% endcomment %}
@@ -94,7 +98,7 @@ regenerate:                             true
           {% assign tagline         = panel_settings.tagline|strip_newlines %}
           {% assign buttons         = panel_settings.buttons %}
           {% assign header          = panel_settings.header %}
-          {% assign properties  = panel_settings.properties %}
+          {% assign properties      = panel_settings.properties %}
           {% assign cards           = panel_settings.cards %}
         {% endif %}
       {% endfor %}
@@ -144,9 +148,9 @@ regenerate:                             true
         {% assign panel_options = panel_config_defaults.intro | merge: panel_settings %}
         {% if debug %}<!-- panel_options:  {{panel_options}} -->{% endif %}
         <!-- Panel {{panel_settings.id}} -->
-        <section id="{{panel_settings.id}}">
+        <section id="{{panel_settings.id}}" class="container">
           <!-- Main Container -->
-          <div class="container">
+          <div class="row {{panel_settings.properties}}">
 
             <!-- Heading -->
             <div class="row">
@@ -205,7 +209,7 @@ regenerate:                             true
 
               {% if card_type == 'text' and card_enabled %}
                 {% assign card_raised = 'raised-z5' %}
-                <article class="card raised-z5 mb-3">
+                <article class="card raised-z3 mb-3">
                   <div class="card-header bg-primary pt-2 pb-2">
                     <div class="d-flex flex-row align-items-center">
                       <div class="mr-3">
@@ -225,12 +229,12 @@ regenerate:                             true
                           </span>
                         {% endif %}
                       </div>
-                      <h3 class="m-0 md-white">{{card_title}}</h3>
+                      <h3 class="m-0">{{card_title}}</h3>
                     </div>
                   </div>
 
                   <div class="card-body g-min-height-200 r-text-300">{{card_text}}</div>
-                  <div class="card-footer r-text-200">
+                  <div class="card-footer r-text-200 text-lowercase">
                   {% for data in card_buttons %} {% for item in data %} {% for button in item[1] %}
                     {% assign key   = button[0] %}
                     {% assign value = button[1] %}
@@ -244,10 +248,12 @@ regenerate:                             true
                     {% if key == 'target' %}      {% assign button_target       = value %} {% endif %}
                   {% endfor %} {% endfor %}{% endfor %}
 
+                  <hr class="my-3">
+
                   {% if button_target == null %}
-                    <a class="card-link md-grey-800 font-weight-bold g-font-size-12 text-uppercase" href="{{button_href}}">{{button_text}}</a>
+                    <a class="card-link text-muted" href="{{button_href}}">{{button_text}}</a>
                   {% else %}
-                    <a class="card-link  md-grey-800 font-weight-bold g-font-size-12 text-uppercase" href="{{button_href}}" target="{{button_target}}">{{button_text}}</a>
+                    <a class="card-link  md-grey-600" href="{{button_href}}" target="{{button_target}}">{{button_text}}</a>
                   {% endif %}
                   </div>
 
@@ -396,8 +402,9 @@ regenerate:                             true
 
         {% assign panel_options = panel_config_defaults.news|merge: panel_settings %}
         {% if debug %}<!-- panel_options:  {{panel_options}} -->{% endif %}
-        <section id="{{panel_settings.id}}">
-          <div class="container">
+        <!-- Panel {{panel_settings.id}} -->
+        <section id="{{panel_settings.id}}" class="container">
+          <div class="row {{panel_settings.properties}}">
 
             {% if panel_options.title %}
             <!-- Heading -->
@@ -468,9 +475,9 @@ regenerate:                             true
                 {% if category == post_category and last_post_written != true %}
                   {% assign posts_written = posts_written|plus:1 %}
                   <!-- Post -->
-                    <article class="card raised-z5 mb-3">
+                    <article class="card raised-z3 mb-3">
                       {% if post.image %}
-                        <img class="img-fluid img__object--cover g-height-200" src="{{post.image}}" alt="{{post.title}}">
+                        <img class="img-fluid img-object--cover g-height-200" src="{{post.image}}" alt="{{post.title}}">
                         {% assign post_width = '80x' %}
                       {% else %}
                         <img class="mt-2" src="" alt="">
@@ -482,12 +489,13 @@ regenerate:                             true
                         {{post.excerpt|truncatewords:50|replace:'...',' ...'|remove:'<div class="paragraph">'|remove:'</div>'|remove:'<p>'|remove:'</p>'}}
                       </div>
                       <!-- End Body|Excerpt -->
-                      <div class="card-footer r-text-200">
+                      <div class="card-footer r-text-200 text-lowercase">
+                        <hr class="my-3">
                         <div class="card-footer-text">
-                          <i class="mdi mdi-calendar-blank mr-1"></i>
+                          <i class="mdi mdi-calendar-blank mdi-md-grey mr-1"></i>
                           {{post.date|date:"%Y %B, %e"}}
                         </div>
-                        <a class="card-link md-grey-800 font-weight-bold g-font-size-12 text-uppercase"
+                        <a class="card-link text-muted"
                            href="{{post.url}}">
                            {{readmore_text}} · {{post.tagline}}
                         </a>