j1-template 2021.0.4 → 2021.0.9

data/assets/themes/j1/modules/mmenuLight/js/mmenu.min.js

@@ -1,14 +1,14 @@
 /*
  # -----------------------------------------------------------------------------
  #  ~/assets/themes/j1/modules/mmenu_light/js/mmenu.js
- #  Mobile Menu v3.0.5 implementation for J1 Template
+ #  Mobile Menu v3.0.8 implementation for J1 Template
  #
  #  Product/Info:
  #  https://jekyll.one
  #  https://github.com/FrDH/mmenu-light
  #
  #  Copyright (C) 2021 Juergen Adams
- #  Copyright (C) 2015-2020 Fred Heusschen
+ #  Copyright (C) 2015-2021 Fred Heusschen
  #
  #  J1 Template is licensed under the MIT License.
  #  See: https://github.com/jekyll-one-org/J1 Template/blob/master/LICENSE
@@ -19,7 +19,7 @@
 
 /*!
  * Mmenu Light
- * mmenujs.com/mmenu-light v3.0.5
+ * mmenujs.com/mmenu-light v3.0.8
  *
  * Copyright (c) Fred Heusschen
  * www.frebsite.nl

data/assets/themes/j1/modules/twemoji/css/picker/twemoji-picker.css

@@ -143,11 +143,11 @@ div.copied {
     left: 50%;
     width: 200px;
     text-align: center;
-    color: $grey-50;
-    background-color: $blue;
-//  border: 1px solid $indigo;
+    color: #FAFAFA;
+    background-color: #2196F3;
+    border: 1px solid #0D47A1;
     padding: 10px 15px;
     border-radius: 4px;
     margin-left: -100px;
-//  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
 }

data/assets/themes/j1/modules/twemoji/css/picker/twemoji-picker.min.css

@@ -16,4 +16,4 @@
  # For details, https://github.com/xLs51/Twemoji-Picker
  # -----------------------------------------------------------------------------
 */
-ul.emoji-list *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ul.emoji-list li{font-size:36px;float:left;display:inline-block;padding:2px;margin:4px}img.emoji{cursor:pointer;height:1em;width:1em;margin:0 .05em 0 .1em;vertical-align:-0.1em}.twemoji-wrap{position:relative}.twemoji-wrap img{margin:0 .05em 0 .1em;vertical-align:-0.1em}.twemoji-textarea{background-color:#FFF;border:1px solid #ccc;border-radius:3px;height:100%;padding:6px 30px 6px 12px;overflow-y:auto}.twemoji-textarea[contentEditable=true]:empty:before{content:attr(placeholder);color:#9e9e9e}.twemoji-picker{background-color:#fff;border:1px solid #e7e7e7;border-radius:3px;box-shadow:0 1px 1px rgba(0,0,0,0.05);position:absolute;right:0;z-index:1}.twemoji-icon-picker{margin-top:.5rem;margin-bottom:.5rem}.twemoji-icon-picker img{//position:absolute;right:21px;top:6px}.twemoji-icon-picker img,.twemoji-picker img{cursor:pointer;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.twemoji-picker-category{background-color:#e7e7e7}.twemoji-picker-category img{padding:5px}.twemoji-picker-category .active,.twemoji-picker-category span:hover{border-bottom:2px solid #728691;line-height:22px}.twemoji-picker-category .close{cursor:pointer;float:right;font-size:25px;font-weight:700;line-height:1;margin-right:2px;opacity:.5}.twemoji-picker-category .close:hover{opacity:.3}.twemoji-list{//overflow-y:scroll;margin-top:1.5rem;margin-left:1.5rem;overflow-y:auto}.twemoji-list img{margin-top:2px;padding:5px}.twemoji-list img:hover{background-color:#e7e7e7}div.copied{position:fixed;top:100px;left:50%;width:200px;text-align:center;color:$grey-50;background-color:$blue;// border:1px solid $indigo;padding:10px 15px;border-radius:4px;margin-left:-100px;// box-shadow:0 0 10px rgba(0,0,0,0.2)}
+ul.emoji-list *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ul.emoji-list li{font-size:36px;float:left;display:inline-block;padding:2px;margin:4px}img.emoji{cursor:pointer;height:1em;width:1em;margin:0 .05em 0 .1em;vertical-align:-0.1em}.twemoji-wrap{position:relative}.twemoji-wrap img{margin:0 .05em 0 .1em;vertical-align:-0.1em}.twemoji-textarea{background-color:#FFF;border:1px solid #ccc;border-radius:3px;height:100%;padding:6px 30px 6px 12px;overflow-y:auto}.twemoji-textarea[contentEditable=true]:empty:before{content:attr(placeholder);color:#9e9e9e}.twemoji-picker{background-color:#fff;border:1px solid #e7e7e7;border-radius:3px;box-shadow:0 1px 1px rgba(0,0,0,0.05);position:absolute;right:0;z-index:1}.twemoji-icon-picker{margin-top:.5rem;margin-bottom:.5rem}.twemoji-icon-picker img{//position:absolute;right:21px;top:6px}.twemoji-icon-picker img,.twemoji-picker img{cursor:pointer;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.twemoji-picker-category{background-color:#e7e7e7}.twemoji-picker-category img{padding:5px}.twemoji-picker-category .active,.twemoji-picker-category span:hover{border-bottom:2px solid #728691;line-height:22px}.twemoji-picker-category .close{cursor:pointer;float:right;font-size:25px;font-weight:700;line-height:1;margin-right:2px;opacity:.5}.twemoji-picker-category .close:hover{opacity:.3}.twemoji-list{//overflow-y:scroll;margin-top:1.5rem;margin-left:1.5rem;overflow-y:auto}.twemoji-list img{margin-top:2px;padding:5px}.twemoji-list img:hover{background-color:#e7e7e7}div.copied{position:fixed;top:100px;left:50%;width:200px;text-align:center;color:#fafafa;background-color:#2196f3;border:1px solid #0d47a1;padding:10px 15px;border-radius:4px;margin-left:-100px;box-shadow:0 0 10px rgba(0,0,0,0.2)}

data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.js

@@ -16,18 +16,19 @@
  # For details, https://github.com/xLs51/Twemoji-Picker
  # -----------------------------------------------------------------------------
 */
-(function (e, c, g) {
+(function ($, window, undefined) {
   var b = 150;
   var d = {};
-  var a = "/assets/data/twa_v1.json";
-  e.TwemojiPicker = function (j, i) {
+  var twa_database = "/assets/data/twa_v1.json";
+
+  $.TwemojiPicker = function (element, options) {
     var h = this;
-    e.when(h._loadDatabase()).done(function (k) {
-      h.$el = e(j);
-      h._init(i)
+    $.when(this._loadDatabase()).done(function (e) {
+      h.$el = $(element);
+      h._init(options)
     })
   };
-  e.TwemojiPicker.defaults = {
+  $.TwemojiPicker.defaults = {
     init: null,
     size: 25,
     icon: "grinning",
@@ -41,9 +42,9 @@
     pickerWidth: null,
     placeholder: "",
   };
-  e.TwemojiPicker.prototype = {
+  $.TwemojiPicker.prototype = {
     _init: function (h) {
-      this.options = e.extend(true, {}, e.TwemojiPicker.defaults, h);
+      this.options = $.extend(true, {}, $.TwemojiPicker.defaults, h);
       this._initPicker();
       this._initCategory();
       this._initTwemoji();
@@ -52,8 +53,8 @@
       this._initEvents()
     },
     _loadDatabase: function f() {
-      return e.ajax({
-        url: a,
+      return $.ajax({
+        url: twa_database,
         success: function (h) {
           if (typeof h == "string") {
             d = JSON.parse(h)
@@ -87,16 +88,16 @@
       this.categoryName = ["people", "nature", "object", "place", "symbol"];
       this.$picker.append('<div class="twemoji-picker-category"></div>');
       this.$pickerCategory = this.$picker.find(".twemoji-picker-category");
-      e.each(this.categoryName, function (j, k) {
+      $.each(this.categoryName, function (j, k) {
         h.$pickerCategory.append('<span data-category="' + k + '">' + h.imageFromName(i[j]) + "</span>")
       });
       this.$pickerCategory.find("span:first").addClass("active")
     },
     _initTwemoji: function () {
       var h = this;
-      e.each(this.categoryName, function (j, k) {
+      $.each(this.categoryName, function (j, k) {
         h.$picker.append('<div class="twemoji-list ' + k + '"></div>');
-        e.each(d, function (i, l) {
+        $.each(d, function (i, l) {
           if (l.category === k) {
             h.$wrapper.find(".twemoji-picker ." + k).append('<span><img class="emoji" draggable="false" src="' + l.base64 + '" alt="' + l.value + '" title="' + l.name + '"></span>')
           }
@@ -146,27 +147,27 @@
     _initEvents: function () {
       var h = this;
       this.$textarea.on("keyup", function () {
-        h.copyTextArea(e(this).html())
+        h.copyTextArea($(this).html())
       });
       this.$iconPicker.on("click", function () {
-        var i = e(".twemoji-picker").height() + b;
-        e("#picker").height(i);
-        e(".toggle-button").toggleClass("mdi-toggle-switch-off mdi-toggle-switch");
+        var i = $(".twemoji-picker").height() + b;
+        $("#picker").height(i);
+        $(".toggle-button").toggleClass("mdi-toggle-switch-off mdi-toggle-switch");
         if (!h.openedPicker) {
           h.openPicker()
         } else {
           h.closePicker();
-          e("#picker").height(h.$pickerHeigth)
+          $("#picker").height(h.$pickerHeigth)
         }
       });
       this.$clearTextarea.on("click", function () {
         h.copyTextArea("");
-        e(h.$id).val("");
-        e(".twemoji-textarea > .emoji-span").remove()
+        $(h.$id).val("");
+        $(".twemoji-textarea > .emoji-span").remove()
       });
       this.$pickerCategory.find("span").on("click", function () {
-        var i = e(this).data("category");
-        h.openCategory(e(this), i)
+        var i = $(this).data("category");
+        h.openCategory($(this), i)
       });
       this.$pickerCategory.find(".close").on("click", function () {
         if (h.openedPicker) {
@@ -174,24 +175,24 @@
         }
       });
       this.$twemojiList.find("img").on("click", function () {
-        h.copyTwemoji(e(this))
+        h.copyTwemoji($(this))
       })
     },
-    copyText: function (j) {
-      var i = document.createElement("textarea");
-      i.setAttribute("style", "position:fixed;opacity:0;top:100px;left:100px");
-      i.value = j;
-      document.body.appendChild(i);
-      i.select();
-      document.execCommand("copy");
-      var h = document.createElement("div");
-      h.setAttribute("class", "copied");
-      h.appendChild(document.createTextNode("Copied to Clipboard"));
-      document.body.appendChild(h);
-      setTimeout(function () {
-        document.body.removeChild(i);
-        document.body.removeChild(h)
-      }, 1500)
+    copyText: function (text) {
+        var copyFrom = document.createElement('textarea');
+        copyFrom.setAttribute("style", "position:fixed;opacity:0;top:100px;left:100px;");
+        copyFrom.value = text;
+        document.body.appendChild(copyFrom);
+        copyFrom.select();
+        document.execCommand('copy');
+        var copied = document.createElement('div');
+        copied.setAttribute('class', 'copied');
+        copied.appendChild(document.createTextNode('Copied to Clipboard'));
+        document.body.appendChild(copied);
+        setTimeout(function () {
+            document.body.removeChild(copyFrom);
+            document.body.removeChild(copied);
+        }, 1500);
     },
     openPicker: function () {
       this.$picker.show();
@@ -226,7 +227,7 @@
       this.$el.text(i)
     },
     imageFromName: function (i, j) {
-      var h = e.grep(d, function (k) {
+      var h = $.grep(d, function (k) {
         return k.name == i
       });
       if (j) {
@@ -236,8 +237,8 @@
     },
     pasteAtCursor: function (m) {
       var l, h;
-      if (c.getSelection) {
-        l = c.getSelection();
+      if (window.getSelection) {
+        l = window.getSelection();
         if (l.getRangeAt && l.rangeCount) {
           h = l.getRangeAt(0);
           h.deleteContents();
@@ -264,10 +265,10 @@
       }
     }
   };
-  e.fn.twemojiPicker = function (i) {
-    var h = e.data(this, "twemojiPicker");
+  $.fn.twemojiPicker = function (i) {
+    var h = $.data(this, "twemojiPicker");
     this.each(function () {
-      h ? h._init() : h = e.data(this, "twemojiPicker", new e.TwemojiPicker(this, i))
+      h ? h._init() : h = $.data(this, "twemojiPicker", new $.TwemojiPicker(this, i))
     });
     return h
   }

data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.min.js

@@ -16,4 +16,4 @@
  # For details, https://github.com/xLs51/Twemoji-Picker
  # -----------------------------------------------------------------------------
 */
-(function(l,n,j){var h=150;var m={};var i="/assets/data/twa_v1.json";l.TwemojiPicker=function(a,b){var c=this;l.when(c._loadDatabase()).done(function(d){c.$el=l(a);c._init(b)})};l.TwemojiPicker.defaults={init:null,size:25,icon:"grinning",iconSize:25,height:100,width:null,category:["smile","cherry-blossom","video-game","oncoming-automobile","symbols"],categorySize:20,pickerPosition:null,pickerHeight:150,pickerWidth:null,placeholder:"",};l.TwemojiPicker.prototype={_init:function(a){this.options=l.extend(true,{},l.TwemojiPicker.defaults,a);this._initPicker();this._initCategory();this._initTwemoji();this._initText();this._initStyle();this._initEvents()},_loadDatabase:function k(){return l.ajax({url:i,success:function(a){if(typeof a=="string"){m=JSON.parse(a)}if(typeof a=="object"){m=a}}})},_initPicker:function(){var a=this;a.$id="#"+a.$el["0"].id;a.$pickerHeigth=a.options.height.replace("px","");a.$pickerHeigth=Number(a.$pickerHeigth);a.$wrapper=a.$el.wrap('<div class="twemoji-wrap"></div>').parent();a.$wrapper.append('<div class="twemoji-textarea" contentEditable="true" placeholder="'+a.options.placeholder+'"></div>');a.$wrapper.append('<div class="twemoji-textarea-duplicate"></div>');a.$wrapper.append('<div class="twemoji-icon-picker"> <span id="open-group" class="mr-2"><button type="button" name="open-group" class="btn btn-raised btn-flex btn-info mr-2"><i class="toggle-button mdi mdi-lg mr-1 mdi-toggle-switch-off"></i> Picker </button></span><span id="clear-textarea"><button type="button" name="clear-textarea" class="btn btn-raised btn-flex btn-secondary"><i class="mdi mdi-sticker-emoji mdi-lg mr-1"></i> Clear </button></span></div>');a.$wrapper.append('<div class="twemoji-picker"></div>');a.$el.hide();a.$textarea=a.$wrapper.find(".twemoji-textarea");a.$textareaDuplicate=a.$wrapper.find(".twemoji-textarea-duplicate").hide();a.$iconPicker=a.$wrapper.find("#open-group");a.$clearTextarea=a.$wrapper.find("#clear-textarea");a.$picker=a.$wrapper.find(".twemoji-picker").hide()},_initCategory:function(){var b=this;var a=this.options.category;this.categoryName=["people","nature","object","place","symbol"];this.$picker.append('<div class="twemoji-picker-category"></div>');this.$pickerCategory=this.$picker.find(".twemoji-picker-category");l.each(this.categoryName,function(d,c){b.$pickerCategory.append('<span data-category="'+c+'">'+b.imageFromName(a[d])+"</span>")});this.$pickerCategory.find("span:first").addClass("active")},_initTwemoji:function(){var a=this;l.each(this.categoryName,function(c,b){a.$picker.append('<div class="twemoji-list '+b+'"></div>');l.each(m,function(e,d){if(d.category===b){a.$wrapper.find(".twemoji-picker ."+b).append('<span><img class="emoji" draggable="false" src="'+d.base64+'" alt="'+d.value+'" title="'+d.name+'"></span>')}})});this.$twemojiList=this.$picker.find(".twemoji-list");this.$twemojiList.not(":first").hide()},_initText:function(){if(this.options.init){var a=this.options.init;var b=/:([\w-]+):/g;var c;while(c==b.exec(a)){a=a.replace(c[0],this.imageFromName(c[1],true))}this.$textarea.html(a);this.copyTextArea(this.$textarea.html())}},_initStyle:function(){this.$wrapper.css({width:this.options.width?this.options.width:"100%",height:this.options.height?this.options.height:"",});this.$wrapper.find("img").css({width:this.options.size,height:this.options.size,});this.$iconPicker.css({width:this.options.iconSize,height:this.options.iconSize,});this.$pickerCategory.find("img").css({width:this.options.categorySize,height:this.options.categorySize,});this.$twemojiList.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",height:this.options.pickerHeight,});this.$picker.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",top:this.options.pickerPosition==="top"?"-"+this.$picker.outerHeight()+"px":"",})},_initEvents:function(){var a=this;this.$textarea.on("keyup",function(){a.copyTextArea(l(this).html())});this.$iconPicker.on("click",function(){var b=l(".twemoji-picker").height()+h;l("#picker").height(b);l(".toggle-button").toggleClass("mdi-toggle-switch-off mdi-toggle-switch");if(!a.openedPicker){a.openPicker()}else{a.closePicker();l("#picker").height(a.$pickerHeigth)}});this.$clearTextarea.on("click",function(){a.copyTextArea("");l(a.$id).val("");l(".twemoji-textarea > .emoji-span").remove()});this.$pickerCategory.find("span").on("click",function(){var b=l(this).data("category");a.openCategory(l(this),b)});this.$pickerCategory.find(".close").on("click",function(){if(a.openedPicker){a.closePicker()}});this.$twemojiList.find("img").on("click",function(){a.copyTwemoji(l(this))})},copyText:function(a){var b=document.createElement("textarea");b.setAttribute("style","position:fixed;opacity:0;top:100px;left:100px");b.value=a;document.body.appendChild(b);b.select();document.execCommand("copy");var c=document.createElement("div");c.setAttribute("class","copied");c.appendChild(document.createTextNode("Copied to Clipboard"));document.body.appendChild(c);setTimeout(function(){document.body.removeChild(b);document.body.removeChild(c)},1500)},openPicker:function(){this.$picker.show();this.openedPicker=true},closePicker:function(){this.$picker.hide();this.openedPicker=false},openCategory:function(b,a){this.$pickerCategory.find("span").removeClass("active");b.addClass("active");this.$twemojiList.not(".twemoji-picker ."+a).hide();this.$twemojiList.filter(".twemoji-picker ."+a).show()},copyTwemoji:function(a){var d=a.attr("alt");var b=a.attr("src");var c=a.attr("title");var e="emoji:"+c+"[]";this.copyText(e);this.$textarea.focus();this.pasteAtCursor('<span class="emoji-span"><img class="emoji" src="'+b+'" title="'+c+'" alt="'+d+'" width="'+this.options.size+'" height="'+this.options.size+'"> '+e+"</span> ");this.copyTextArea(this.$textarea.html())},copyTextArea:function(a){var c=this.$textareaDuplicate.html(a);c.find("img").replaceWith(function(){return this.alt});var b=c.html();this.$el.text(b)},imageFromName:function(b,a){var c=l.grep(m,function(d){return d.name==b});if(a){return'<img class="emoji" src="'+c[0].base64+'" alt="'+c[0].value+'" width="'+this.options.size+'" height="'+this.options.size+'">'}return'<img class="emoji" draggable="false" src="'+c[0].base64+'" alt="'+b+'">'},pasteAtCursor:function(a){var b,f;if(n.getSelection){b=n.getSelection();if(b.getRangeAt&&b.rangeCount){f=b.getRangeAt(0);f.deleteContents();var e=document.createElement("div");e.innerHTML=a;var g=document.createDocumentFragment(),c,d;while((c=e.firstChild)){d=g.appendChild(c)}f.insertNode(g);if(d){f=f.cloneRange();f.setStartAfter(d);f.collapse(true);b.removeAllRanges();b.addRange(f)}}}else{if(document.selection&&document.selection.type!="Control"){document.selection.createRange().pasteHTML(a)}}}};l.fn.twemojiPicker=function(a){var b=l.data(this,"twemojiPicker");this.each(function(){b?b._init():b=l.data(this,"twemojiPicker",new l.TwemojiPicker(this,a))});return b}})(jQuery,window);
+(function(i,g,k){var c=150;var j={};var e="/assets/data/twa_v1.json";i.TwemojiPicker=function(b,a){var d=this;i.when(this._loadDatabase()).done(function(f){d.$el=i(b);d._init(a)})};i.TwemojiPicker.defaults={init:null,size:25,icon:"grinning",iconSize:25,height:100,width:null,category:["smile","cherry-blossom","video-game","oncoming-automobile","symbols"],categorySize:20,pickerPosition:null,pickerHeight:150,pickerWidth:null,placeholder:"",};i.TwemojiPicker.prototype={_init:function(a){this.options=i.extend(true,{},i.TwemojiPicker.defaults,a);this._initPicker();this._initCategory();this._initTwemoji();this._initText();this._initStyle();this._initEvents()},_loadDatabase:function h(){return i.ajax({url:e,success:function(a){if(typeof a=="string"){j=JSON.parse(a)}if(typeof a=="object"){j=a}}})},_initPicker:function(){var a=this;a.$id="#"+a.$el["0"].id;a.$pickerHeigth=a.options.height.replace("px","");a.$pickerHeigth=Number(a.$pickerHeigth);a.$wrapper=a.$el.wrap('<div class="twemoji-wrap"></div>').parent();a.$wrapper.append('<div class="twemoji-textarea" contentEditable="true" placeholder="'+a.options.placeholder+'"></div>');a.$wrapper.append('<div class="twemoji-textarea-duplicate"></div>');a.$wrapper.append('<div class="twemoji-icon-picker"><span id="open-group" class="mr-2" style="width: 2rem; height: 2rem;"><button type="button" name="open-group" class="btn btn-raised btn-flex btn-primary mr-2"><i class="toggle-button mdi mdi-lg mr-1 mdi-toggle-switch-off"></i> Picker <div class="ripple-container"></div></button></span><span id="clear-textarea" style="width: 2rem; height: 2rem;"><button type="button" name="clear-textarea" class="btn btn-raised btn-flex btn-primary"><i class="mdi mdi-close mdi-lg mr-1"></i> Clear </button></span></div>');a.$wrapper.append('<div class="twemoji-picker"></div>');a.$el.hide();a.$textarea=a.$wrapper.find(".twemoji-textarea");a.$textareaDuplicate=a.$wrapper.find(".twemoji-textarea-duplicate").hide();a.$iconPicker=a.$wrapper.find("#open-group");a.$clearTextarea=a.$wrapper.find("#clear-textarea");a.$picker=a.$wrapper.find(".twemoji-picker").hide()},_initCategory:function(){var b=this;var a=this.options.category;this.categoryName=["people","nature","object","place","symbol"];this.$picker.append('<div class="twemoji-picker-category"></div>');this.$pickerCategory=this.$picker.find(".twemoji-picker-category");i.each(this.categoryName,function(f,d){b.$pickerCategory.append('<span data-category="'+d+'">'+b.imageFromName(a[f])+"</span>")});this.$pickerCategory.find("span:first").addClass("active")},_initTwemoji:function(){var a=this;i.each(this.categoryName,function(d,b){a.$picker.append('<div class="twemoji-list '+b+'"></div>');i.each(j,function(m,f){if(f.category===b){a.$wrapper.find(".twemoji-picker ."+b).append('<span><img class="emoji" draggable="false" src="'+f.base64+'" alt="'+f.value+'" title="'+f.name+'"></span>')}})});this.$twemojiList=this.$picker.find(".twemoji-list");this.$twemojiList.not(":first").hide()},_initText:function(){if(this.options.init){var a=this.options.init;var b=/:([\w-]+):/g;var d;while(d==b.exec(a)){a=a.replace(d[0],this.imageFromName(d[1],true))}this.$textarea.html(a);this.copyTextArea(this.$textarea.html())}},_initStyle:function(){this.$wrapper.css({width:this.options.width?this.options.width:"100%",height:this.options.height?this.options.height:"",});this.$wrapper.find("img").css({width:this.options.size,height:this.options.size,});this.$iconPicker.css({width:this.options.iconSize,height:this.options.iconSize,});this.$pickerCategory.find("img").css({width:this.options.categorySize,height:this.options.categorySize,});this.$twemojiList.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",height:this.options.pickerHeight,});this.$picker.css({width:this.options.pickerWidth?this.options.pickerWidth:"100%",top:this.options.pickerPosition==="top"?"-"+this.$picker.outerHeight()+"px":"",})},_initEvents:function(){var a=this;this.$textarea.on("keyup",function(){a.copyTextArea(i(this).html())});this.$iconPicker.on("click",function(){var b=i(".twemoji-picker").height()+c;i("#picker").height(b);i(".toggle-button").toggleClass("mdi-toggle-switch-off mdi-toggle-switch");if(!a.openedPicker){a.openPicker()}else{a.closePicker();i("#picker").height(a.$pickerHeigth)}});this.$clearTextarea.on("click",function(){a.copyTextArea("");i(a.$id).val("");i(".twemoji-textarea > .emoji-span").remove()});this.$pickerCategory.find("span").on("click",function(){var b=i(this).data("category");a.openCategory(i(this),b)});this.$pickerCategory.find(".close").on("click",function(){if(a.openedPicker){a.closePicker()}});this.$twemojiList.find("img").on("click",function(){a.copyTwemoji(i(this))})},copyText:function(d){var b=document.createElement("textarea");b.setAttribute("style","position:fixed;opacity:0;top:100px;left:100px;");b.value=d;document.body.appendChild(b);b.select();document.execCommand("copy");var a=document.createElement("div");a.setAttribute("class","copied");a.appendChild(document.createTextNode("Copied to Clipboard"));document.body.appendChild(a);setTimeout(function(){document.body.removeChild(b);document.body.removeChild(a)},1500)},openPicker:function(){this.$picker.show();this.openedPicker=true},closePicker:function(){this.$picker.hide();this.openedPicker=false},openCategory:function(b,a){this.$pickerCategory.find("span").removeClass("active");b.addClass("active");this.$twemojiList.not(".twemoji-picker ."+a).hide();this.$twemojiList.filter(".twemoji-picker ."+a).show()},copyTwemoji:function(a){var f=a.attr("alt");var b=a.attr("src");var d=a.attr("title");var m="emoji:"+d+"[]";this.copyText(m);this.$textarea.focus();this.pasteAtCursor('<span class="emoji-span"><img class="emoji" src="'+b+'" title="'+d+'" alt="'+f+'" width="'+this.options.size+'" height="'+this.options.size+'"> '+m+"</span> ");this.copyTextArea(this.$textarea.html())},copyTextArea:function(a){var d=this.$textareaDuplicate.html(a);d.find("img").replaceWith(function(){return this.alt});var b=d.html();this.$el.text(b)},imageFromName:function(b,a){var d=i.grep(j,function(f){return f.name==b});if(a){return'<img class="emoji" src="'+d[0].base64+'" alt="'+d[0].value+'" width="'+this.options.size+'" height="'+this.options.size+'">'}return'<img class="emoji" draggable="false" src="'+d[0].base64+'" alt="'+b+'">'},pasteAtCursor:function(a){var b,p;if(g.getSelection){b=g.getSelection();if(b.getRangeAt&&b.rangeCount){p=b.getRangeAt(0);p.deleteContents();var o=document.createElement("div");o.innerHTML=a;var q=document.createDocumentFragment(),d,f;while((d=o.firstChild)){f=q.appendChild(d)}p.insertNode(q);if(f){p=p.cloneRange();p.setStartAfter(f);p.collapse(true);b.removeAllRanges();b.addRange(p)}}}else{if(document.selection&&document.selection.type!="Control"){document.selection.createRange().pasteHTML(a)}}}};i.fn.twemojiPicker=function(a){var b=i.data(this,"twemojiPicker");this.each(function(){b?b._init():b=i.data(this,"twemojiPicker",new i.TwemojiPicker(this,a))});return b}})(jQuery,window);

data/lib/j1/commands/generate.rb

@@ -140,12 +140,13 @@ module J1
             system_path = result[1]
             if options['system']
               J1.logger.info "Install patches on path #{system_path} ..."
+              dest = system_path + '/gems/' + patch_gem + '/lib'
             else
               J1.logger.info "Install patches on path #{user_path} ..."
-              src = patch_source_path
               dest = user_path + '/gems/' + patch_gem + '/lib'
-              FileUtils.cp_r(src, dest)
             end
+            src = patch_source_path
+            FileUtils.cp_r(src, dest)
           end
         end
 

data/lib/j1/version.rb

@@ -1,3 +1,3 @@
 module J1
-  VERSION = '2021.0.4'
+  VERSION = '2021.0.9'
 end

data/lib/j1_app/j1_auth_manager/auth_manager.rb

@@ -325,7 +325,22 @@ module J1App
       unless env['HTTP_COOKIE'] == nil
         j1_mw_auth_mgr.info 'read current user state data from cookie'
         user_session_data = readCookie('j1.user.session')
+        j1_mw_auth_mgr.info 'update user session data for mode: app'
+        user_session_data['mode']       ='app'
+        timestamp                       = Time.now.strftime("%Y-%m-%d %H:%M:%S")
+        user_session_data['timestamp']  = timestamp
+        user_session_data['writer']     = 'middleware'
+        session_json                    = user_session_data.to_json
+        j1_mw_auth_mgr.info 'write user session data to cookie: ' + "#{session_json}"
+        writeCookie('j1.user.session', session_json)
       else
+        j1_mw_auth_mgr.info 'create user session data for mode: app'
+        timestamp                       = Time.now.strftime("%Y-%m-%d %H:%M:%S")
+        user_session_data['timestamp']  = timestamp
+        user_session_data['writer']     = 'middleware'
+        session_json                    = user_session_data.to_json
+        j1_mw_auth_mgr.info 'write user session data to cookie: ' + "#{session_json}"
+        writeCookie('j1.user.session', session_json)
         requested_page = env['REQUEST_URI']
         app_session_data['requested_page'] = "#{env['REQUEST_URI']}"
       end

data/lib/starter_web/Gemfile

@@ -1,5 +1,5 @@
 # ------------------------------------------------------------------------------
-# ~/Gemfile (runtime)
+# ~/Gemfile (run-time)
 # Provides package information to bundle all Ruby gem needed
 # for Jekyll and J1 template (managed by Ruby Gem Bundler)
 #
@@ -52,9 +52,9 @@ ruby RUBY_VERSION
 #
 gem 'jekyll', '~> 4.2'
 
-# Theme Rubies, default: J1 Template (NOT used for the development system)
+# Theme Rubies, default: J1 Template
 #
-gem 'j1-template', '= 2021.0.4'
+gem 'j1-template', '~> 2021.0.9'
 
 # ------------------------------------------------------------------------------
 # PRODUCTION: Gem needed for the Jekyll and J1 prod environment
@@ -106,19 +106,22 @@ gem 'wdm', '>= 0.1.1' if Gem.win_platform?
 # ------------------------------------------------------------------------------
 # Jekyll Plugins
 # If any (additional) plugins are used, they goes here:
+# ------------------------------------------------------------------------------
+# NOTE: asciidoctor v2.x (automatically loaded via ???) creates corrupted
+#  asciidoctor-rouge output. Currently, older/latest version v1.x is used
 #
 group :jekyll_plugins do
-  gem 'asciidoctor', '= 1.5.8'
-# gem 'asciidoctor-pdf', '>= 1.5.0.alpha.16'
-  gem 'asciidoctor-rouge', '>= 0.3'
-  gem 'jekyll-asciidoc', '>= 2.1.0'
-# gem 'jekyll-algolia', '~> 1.0'
-# gem 'jekyll-feed', ">= 0.9"
-# gem 'jekyll-gist', '>= 1.5.0'
+  gem 'asciidoctor', '= 1.5.8'                                                  # See notes!!!
+# gem 'asciidoctor-pdf', '>= 1.5.4'                                             # Needed ???
+  gem 'asciidoctor-rouge', '>= 0.4.0'
+  gem 'jekyll-asciidoc', '>= 3.0.0'
+# gem 'jekyll-algolia', '~> 1.6'                                                # Needed ??? Supported ???
+# gem 'jekyll-feed', ">= 0.15.1"
+# gem 'jekyll-gist', '>= 1.5.0'                                                 # Needed ???, Gist supported asciidoc-extention
 # gem 'jekyll-sitemap', '>= 1.2.0'
-# gem 'jekyll-redirect-from', '>= 0.13.0'
+# gem 'jekyll-redirect-from', '>= 0.16.0'                                       # Needed ???
+# gem 'jekyll-sass-converter', '>= 2.1.0'                                       # Needed ??? Supported ???
   gem 'j1-paginator', '>= 2020.0.2'
-  gem 'jekyll-sass-converter', '>= 1.5.1'
 end
 
 # ------------------------------------------------------------------------------
@@ -166,7 +169,6 @@ end
 # gem 'passenger', '>= 5.3'
 gem "puma", '>= 4.3.1'
 
-
 # ------------------------------------------------------------------------------
 # If J1 is transformed into a (Rack and Sinatra based) Web
 # application, the site can be secured using user authentication
@@ -179,18 +181,17 @@ gem 'rack-protection', '~> 2.0'
 gem 'rack-ssl-enforcer', '~> 0.2'
 gem 'rest-client', '~> 2.0'
 
-gem 'omniauth', '>= 1.3'
-gem 'omniauth-oauth2', '~> 1.4'
+gem 'omniauth', '>= 2.0'
+gem 'omniauth-oauth2', '~> 1.7'
 
 gem 'sinatra', '~> 2.0'
-# gem 'sinatra-cross_origin', '~> 0.3.1'
+gem 'sinatra-cross_origin', '~> 0.3.1'
 
 gem 'warden', '~> 1.2'
 
 # ------------------------------------------------------------------------------
 # Gem needed for J1 logger based on log4r (middleware)
 #
-#gem 'log4r', '~> 1.1.10'
 gem 'log4r', '~> 1.1', '>= 1.1.10'
 gem 'uuid', '~> 2.3', '>= 2.3.8'
 gem 'date', '~> 2.0'

data/lib/starter_web/_config.yml

@@ -1,6 +1,6 @@
 # ------------------------------------------------------------------------------
 # ~/_config.yml
-# Global Jekyll site configuration
+# Global Jekyll site configuration (runtime)
 #
 # Product/Info:
 # https://jekyll.one
@@ -45,7 +45,7 @@
 # Sets the build environment of the website
 #
 #   values:                             development|production
-#   default:                            development
+#   default:                            production
 #
 environment:                            production
 
@@ -53,7 +53,7 @@ environment:                            production
 # ------------------------------------------------------------------------------
 #   Sets the build version of J1 Template Gem
 #
-version:                                2021.0.4
+version:                                2021.0.9
 
 # version
 # ------------------------------------------------------------------------------
@@ -223,9 +223,11 @@ doctype:                                html
 #   values:                             boolean (true|false)
 #   default:                            false
 #
-title:                                  J1 Template
-slogan:                                 Starter Web
-description:                            Made for Jekyll · Made for Your Web
+title:                                  J1
+slogan:                                 starter
+description: >
+                                        Made for Jekyll · Made for Your Web
+
 keywords:                               Jekyll, One, Template, Ruby, Asciidoctor,
                                         Asciidoc, Bootstrap, Javascript,
                                         JS, JS3, CSS, CSS3, HTML5, Material, Design
@@ -386,7 +388,7 @@ exclude:                                [
                                           '.sass-cache', '.vscode',
                                           '.idea', '*.ignore',
                                           '*.bat', '*.sh', '*.tmp', 'dot.*',
-                                          '*.txt', '*.log', '*.ppt*',
+                                          '*.txt', '*.log', '*.ppt*', '*.pdf',
                                           '*.zip', '*.7z', '*.tgz', '*.tar',
                                           '*.a2p', '*.asciidoc'
                                         ]

data/lib/starter_web/_data/apps/light_gallery.yml

@@ -49,7 +49,7 @@ settings:
   # PAGER plugin
   #
   pager:
-    enabled:                        false
+    enabled:                        true
 
   # ----------------------------------------------------------------------------
   # SHARE plugin

data/lib/starter_web/_data/asciidoc2pdf/themes/j1-theme.yml

@@ -19,46 +19,48 @@
 # ------------------------------------------------------------------------------
 font:
   catalog:
-    # Noto Serif supports Latin, Latin-1 Supplement, Latin Extended-A, Greek, Cyrillic, Vietnamese & an assortment of symbols
+    # Noto Serif supports Latin, Latin-1 Supplement, Latin Extended-A,
+    # Greek, Cyrillic, Vietnamese & an assortment of symbols
     Noto Serif:
-      normal: GEM_FONTS_DIR/notoserif-regular-subset.ttf
-      bold: GEM_FONTS_DIR/notoserif-bold-subset.ttf
-      italic: GEM_FONTS_DIR/notoserif-italic-subset.ttf
-      bold_italic: GEM_FONTS_DIR/notoserif-bold_italic-subset.ttf
+      normal:                           GEM_FONTS_DIR/notoserif-regular-subset.ttf
+      bold:                             GEM_FONTS_DIR/notoserif-bold-subset.ttf
+      italic:                           GEM_FONTS_DIR/notoserif-italic-subset.ttf
+      bold_italic:                      GEM_FONTS_DIR/notoserif-bold_italic-subset.ttf
     # M+ 1mn supports ASCII and the circled numbers used for conums
     M+ 1mn:
-      normal: GEM_FONTS_DIR/mplus1mn-regular-subset.ttf
-      bold: GEM_FONTS_DIR/mplus1mn-bold-subset.ttf
-      italic: GEM_FONTS_DIR/mplus1mn-italic-subset.ttf
-      bold_italic: GEM_FONTS_DIR/mplus1mn-bold_italic-subset.ttf
+      normal:                           GEM_FONTS_DIR/mplus1mn-regular-subset.ttf
+      bold:                             GEM_FONTS_DIR/mplus1mn-bold-subset.ttf
+      italic:                           GEM_FONTS_DIR/mplus1mn-italic-subset.ttf
+      bold_italic:                      GEM_FONTS_DIR/mplus1mn-bold_italic-subset.ttf
     # j1 is using roboto for default
     Roboto:
-      normal: ../fonts/Roboto-Regular.ttf
-      bold: ../fonts/Roboto-Bold.ttf
-      italic: ../fonts/Roboto-Italic.ttf
-      bold_italic: ../fonts/Roboto-BoldItalic.ttf
+      normal:                           ../fonts/Roboto-Regular.ttf
+      bold:                             ../fonts/Roboto-Bold.ttf
+      italic:                           ../fonts/Roboto-Italic.ttf
+      bold_italic:                      ../fonts/Roboto-BoldItalic.ttf
 
 page:
-  background_color: FFFFFF
-  layout: portrait
-# layout: landscape
-  initial_zoom: FitH
-  margin: [0.5in, 0.67in, 0.67in, 0.67in]
-  # margin_inner and margin_outer keys are used for recto/verso print margins when media=prepress
-  margin_inner: 0.75in
-  margin_outer: 0.59in
-  size: A4
+  background_color:                     FFFFFF
+  layout:                               portrait                                # landscape
+  initial_zoom:                         FitH
+  margin:                               [0.5in, 0.67in, 0.67in, 0.67in]
+  # margin_inner and margin_outer keys are used for recto/verso print
+  # margins when media=prepress
+  margin_inner:                         0.75in
+  margin_outer:                         0.59in
+  size:                                 A4
+
 base:
-  align: justify
+  align:                                justify
   # color as hex string (leading # is optional)
-  font_color: 333333
+  font_color:                           333333
   # color as RGB array
   #font_color: [51, 51, 51]
   # color as CMYK array (approximated)
   #font_color: [0, 0, 0, 0.92]
   #font_color: [0, 0, 0, 92%]
   # font_family: Noto Serif
-  font_family: Roboto
+  font_family:                          Roboto
   # choose one of these font_size/line_height_length combinations
   #font_size: 14
   #line_height_length: 20
@@ -66,250 +68,285 @@ base:
   #line_height_length: 18
   #font_size: 11.2
   #line_height_length: 16
-  font_size: 10.5
+  font_size:                            10.5
   #line_height_length: 15
   # correct line height for Noto Serif metrics
   line_height_length: 12
   #font_size: 11.25
   #line_height_length: 18
-  line_height: $base_line_height_length / $base_font_size
-  font_size_large: round($base_font_size * 1.25)
-  font_size_small: round($base_font_size * 0.85)
-  font_size_min: $base_font_size * 0.75
-  font_style: normal
-  border_color: EEEEEE
-  border_radius: 4
-  border_width: 0.5
+  line_height:                          $base_line_height_length / $base_font_size
+  font_size_large:                      round($base_font_size * 1.25)
+  font_size_small:                      round($base_font_size * 0.85)
+  font_size_min:                        $base_font_size * 0.75
+  font_style:                           normal
+  border_color:                         EEEEEE
+  border_radius:                        4
+  border_width:                         0.5
+
 role:
   line-through:
-    text_decoration: line-through
+    text_decoration:                    line-through
   underline:
-    text_decoration: underline
+    text_decoration:                    underline
   big:
-    font_size: $base_font_size_large
+    font_size:                          $base_font_size_large
   small:
-    font_size: $base_font_size_small
+    font_size:                          $base_font_size_small
   subtitle:
-    font_color: 999999
-    font_size: 0.8em
-    font_style: normal_italic
+    font_color:                         999999
+    font_size:                          0.8em
+    font_style:                         normal_italic
+
 # FIXME vertical_rhythm is weird; we should think in terms of ems
 #vertical_rhythm: $base_line_height_length * 2 / 3
 # correct line height for Noto Serif metrics (comes with built-in line height)
-vertical_rhythm: $base_line_height_length
-horizontal_rhythm: $base_line_height_length
+vertical_rhythm:                        $base_line_height_length
+horizontal_rhythm:                      $base_line_height_length
+
 link:
-  font_color: 428BCA
+  font_color:                           428BCA
+
 # literal is currently used for inline monospaced in prose and table cells
 literal:
-  font_color: B12146
-  font_family: M+ 1mn
+  font_color:                           B12146
+  font_family:                          M+ 1mn
+
 button:
-  content: "[\u2009%s\u2009]"
-  font_style: bold
+  content:                              "[\u2009%s\u2009]"
+  font_style:                           bold
+
 key:
-  background_color: F5F5F5
-  border_color: CCCCCC
-  border_offset: 2
-  border_radius: 2
-  border_width: 0.5
-  font_family: $literal_font_family
-  separator: "\u202f+\u202f"
+  background_color:                     F5F5F5
+  border_color:                         CCCCCC
+  border_offset:                        2
+  border_radius:                        2
+  border_width:                         0.5
+  font_family:                          $literal_font_family
+  separator:                            "\u202f+\u202f"
+
 mark:
-  background_color: FFFF00
-  border_offset: 1
+  background_color:                     FFFF00
+  border_offset:                        1
+
 menu:
-  caret_content: " <font size=\"1.15em\" color=\"#B12146\">\u203a</font> "
+  caret_content:                        " <font size=\"1.15em\" color=\"#B12146\">\u203a</font> "
+
 heading:
-  align: left
+  align:                                left
 # font-family: Roboto-Bold
-  font_color: $base_font_color
-  font_style: bold
+  font_color:                           $base_font_color
+  font_style:                           bold
   # h1 is used for part titles (book doctype) or the doctitle (article doctype)
-  h1_font_size: floor($base_font_size * 2.6)
+  h1_font_size:                         floor($base_font_size * 2.6)
   # h2 is used for chapter titles (book doctype only)
-  h2_font_size: floor($base_font_size * 2.15)
-  h3_font_size: round($base_font_size * 1.7)
-  h4_font_size: $base_font_size_large
-  h5_font_size: $base_font_size
-  h6_font_size: $base_font_size_small
+  h2_font_size:                         floor($base_font_size * 2.15)
+  h3_font_size:                         round($base_font_size * 1.7)
+  h4_font_size:                         $base_font_size_large
+  h5_font_size:                         $base_font_size
+  h6_font_size:                         $base_font_size_small
   #line_height: 1.4
   # correct line height for Noto Serif metrics (comes with built-in line height)
-  line_height: 1
-  margin_top: $vertical_rhythm * 0.4
-  margin_bottom: $vertical_rhythm * 0.9
-  min_height_after: $base_line_height_length * 1.5
+  line_height:                          1
+  margin_top:                           $vertical_rhythm * 0.4
+  margin_bottom:                        $vertical_rhythm * 0.9
+  min_height_after:                     $base_line_height_length * 1.5
+
 title_page:
-  align: right
+  align:                                right
   logo:
-    top: 10%
+    top:                                10%
   title:
-    top: 55%
-    font_size: $heading_h1_font_size
-    font_color: $role_subtitle_font_color
-    line_height: 0.9
+    top:                                55%
+    font_size:                          $heading_h1_font_size
+    font_color:                         $role_subtitle_font_color
+    line_height:                        0.9
   subtitle:
-    font_size: $heading_h3_font_size
-    font_style: bold_italic
-    line_height: 1
+    font_size:                          $heading_h3_font_size
+    font_style:                         bold_italic
+    line_height:                        1
   authors:
-    margin_top: $base_font_size * 1.25
-    font_size: $base_font_size_large
-    font_color: 181818
+    margin_top:                         $base_font_size * 1.25
+    font_size:                          $base_font_size_large
+    font_color:                         181818
   revision:
-    margin_top: $base_font_size * 1.25
+    margin_top:                         $base_font_size * 1.25
+
 block:
-  margin_bottom: $vertical_rhythm
+  margin_bottom:                        $vertical_rhythm
+
 caption:
-  align: left
-  font_size: $base_font_size * 0.95
-  font_style: italic
+  align:                                left
+  font_size:                            $base_font_size * 0.95
+  font_style:                           italic
   # FIXME perhaps set line_height instead of / in addition to margins?
-  margin_inside: $vertical_rhythm / 3
+  margin_inside:                        $vertical_rhythm / 3
   #margin_inside: $vertical_rhythm / 4
-  margin_outside: 0
+  margin_outside:                       0
+
 lead:
-  font_size: $base_font_size_large
-  line_height: 1.4
+  font_size:                            $base_font_size_large
+  line_height:                          1.4
+
 abstract:
-  font_color: 5C6266
-  font_size: $lead_font_size
-  line_height: $lead_line_height
-  font_style: italic
-  first_line_font_style: bold
+  font_color:                           5C6266
+  font_size:                            $lead_font_size
+  line_height:                          $lead_line_height
+  font_style:                           italic
+  first_line_font_style:                bold
   title:
-    align: center
-    font_color: $heading_font_color
-    font_size: $heading_h4_font_size
-    font_style: $heading_font_style
+    align:                              center
+    font_color:                         $heading_font_color
+    font_size:                          $heading_h4_font_size
+    font_style:                         $heading_font_style
+
 admonition:
-  column_rule_color: $base_border_color
-  column_rule_width: $base_border_width
-  padding: [0, $horizontal_rhythm, 0, $horizontal_rhythm]
+  column_rule_color:                    $base_border_color
+  column_rule_width:                    $base_border_width
+  padding:                              [0, $horizontal_rhythm, 0, $horizontal_rhythm]
   #icon:
   #  tip:
   #    name: far-lightbulb
   #    stroke_color: 111111
   #    size: 24
   label:
-    text_transform: uppercase
-    font_style: bold
+    text_transform:                     uppercase
+    font_style:                         bold
+
 blockquote:
-  font_size: $base_font_size_large
-  border_color: $base_border_color
-  border_width: 0
-  border_left_width: 5
+  font_size:                            $base_font_size_large
+  border_color:                         $base_border_color
+  border_width:                         0
+  border_left_width:                    5
   # FIXME disable negative padding bottom once margin collapsing is implemented
-  padding: [0, $horizontal_rhythm, $block_margin_bottom * -0.75, $horizontal_rhythm + $blockquote_border_left_width / 2]
+  padding:                              [0, $horizontal_rhythm, $block_margin_bottom * -0.75, $horizontal_rhythm + $blockquote_border_left_width / 2]
   cite:
-    font_size: $base_font_size_small
-    font_color: $role_subtitle_font_color
+    font_size:                          $base_font_size_small
+    font_color:                         $role_subtitle_font_color
+
 verse:
-  font_size: $blockquote_font_size
-  border_color: $blockquote_border_color
-  border_width: $blockquote_border_width
-  border_left_width: $blockquote_border_left_width
-  padding: $blockquote_padding
+  font_size:                            $blockquote_font_size
+  border_color:                         $blockquote_border_color
+  border_width:                         $blockquote_border_width
+  border_left_width:                    $blockquote_border_left_width
+  padding:                              $blockquote_padding
   cite:
-    font_size: $blockquote_cite_font_size
-    font_color: $blockquote_cite_font_color
+    font_size:                          $blockquote_cite_font_size
+    font_color:                         $blockquote_cite_font_color
+
 # code is used for source blocks (perhaps change to source or listing?)
 code:
-  font_color: $base_font_color
-  font_family: $literal_font_family
-  font_size: ceil($base_font_size)
-  padding: $code_font_size
-  line_height: 1.25
-  # line_gap is an experimental property to control how a background color is applied to an inline block element
-  line_gap: 3.8
-  background_color: F5F5F5
-  border_color: CCCCCC
-  border_radius: $base_border_radius
-  border_width: 0.75
+  font_color:                           $base_font_color
+  font_family:                          $literal_font_family
+  font_size:                            ceil($base_font_size)
+  padding:                              $code_font_size
+  line_height:                          1.25
+  # line_gap is an experimental property to control how a background
+  # color is applied to an inline block element
+  line_gap:                             3.8
+  background_color:                     F5F5F5
+  border_color:                         CCCCCC
+  border_radius:                        $base_border_radius
+  border_width:                         0.75
+
 conum:
-  font_family: $literal_font_family
-  font_color: $literal_font_color
-  font_size: $base_font_size
-  line_height: 4 / 3
-  glyphs: circled
+  font_family:                          $literal_font_family
+  font_color:                           $literal_font_color
+  font_size:                            $base_font_size
+  line_height:                          4 / 3
+  glyphs:                               circled
+
 example:
-  border_color: $base_border_color
-  border_radius: $base_border_radius
-  border_width: 0.75
-  background_color: $page_background_color
-  # FIXME reenable padding bottom once margin collapsing is implemented
-  padding: [$vertical_rhythm, $horizontal_rhythm, 0, $horizontal_rhythm]
+  border_color:                         $base_border_color
+  border_radius:                        $base_border_radius
+  border_width:                         0.75
+  background_color:                     $page_background_color
+  # FIXME reenable padding bottom once margin collapsing
+  # is implemented
+  padding:                              [$vertical_rhythm, $horizontal_rhythm, 0, $horizontal_rhythm]
+
 image:
-  align: left
+  align:                                left
+
 prose:
-  margin_bottom: $block_margin_bottom
+  margin_bottom:                        $block_margin_bottom
+
 sidebar:
-  background_color: EEEEEE
-  border_color: E1E1E1
-  border_radius: $base_border_radius
-  border_width: $base_border_width
+  background_color:                     EEEEEE
+  border_color:                         E1E1E1
+  border_radius:                        $base_border_radius
+  border_width:                         $base_border_width
   # FIXME reenable padding bottom once margin collapsing is implemented
-  padding: [$vertical_rhythm, $vertical_rhythm * 1.25, 0, $vertical_rhythm * 1.25]
+  padding:                              [$vertical_rhythm, $vertical_rhythm * 1.25, 0, $vertical_rhythm * 1.25]
   title:
-    align: center
-    font_color: $heading_font_color
-    font_size: $heading_h4_font_size
-    font_style: $heading_font_style
+    align:                              center
+    font_color:                         $heading_font_color
+    font_size:                          $heading_h4_font_size
+    font_style:                         $heading_font_style
+
 thematic_break:
-  border_color: $base_border_color
-  border_style: solid
-  border_width: $base_border_width
-  margin_top: $vertical_rhythm * 0.5
-  margin_bottom: $vertical_rhythm * 1.5
+  border_color:                         $base_border_color
+  border_style:                         solid
+  border_width:                         $base_border_width
+  margin_top:                           $vertical_rhythm * 0.5
+  margin_bottom:                        $vertical_rhythm * 1.5
+
 description_list:
-  term_font_style: bold
-  term_spacing: $vertical_rhythm / 4
-  description_indent: $horizontal_rhythm * 1.25
+  term_font_style:                      bold
+  term_spacing:                         $vertical_rhythm / 4
+  description_indent:                   $horizontal_rhythm * 1.25
+
 outline_list:
-  indent: $horizontal_rhythm * 1.5
+  indent:                               $horizontal_rhythm * 1.5
   #marker_font_color: 404040
-  # NOTE outline_list_item_spacing applies to list items that do not have complex content
-  item_spacing: $vertical_rhythm / 2
+  # NOTE outline_list_item_spacing applies to list items that
+  # do not have complex content
+  item_spacing:                         $vertical_rhythm / 2
+
 table:
-  background_color: $page_background_color
-  border_color: DDDDDD
-  border_width: $base_border_width
-  cell_padding: 3
+  background_color:                     $page_background_color
+  border_color:                         DDDDDD
+  border_width:                         $base_border_width
+  cell_padding:                         3
   head:
-    font_style: bold
-    border_bottom_width: $base_border_width * 2.5
+    font_style:                         bold
+    border_bottom_width:                $base_border_width * 2.5
   body:
-    stripe_background_color: F9F9F9
+    stripe_background_color:            F9F9F9
   foot:
-    background_color: F0F0F0
+    background_color:                   F0F0F0
+
 toc:
-  indent: $horizontal_rhythm
-  line_height: 1.4
+  indent:                               $horizontal_rhythm
+  line_height:                          1.4
   dot_leader:
     #content: ". "
-    font_color: A9A9A9
+    font_color:                         A9A9A9
     #levels: 2 3
+
 footnotes:
-  font_size: round($base_font_size * 0.75)
-  item_spacing: $outline_list_item_spacing / 2
+  font_size:                            round($base_font_size * 0.75)
+  item_spacing:                         $outline_list_item_spacing / 2
+
 header:
-  font_size: $base_font_size_small
-  line_height: 1
-  vertical_align: middle
+  font_size:                            $base_font_size_small
+  line_height:                          1
+  vertical_align:                       middle
+
 footer:
-  font_size: $base_font_size_small
-  # NOTE if background_color is set, background and border will span width of page
-  border_color: DDDDDD
+  font_size:                            $base_font_size_small
+  # NOTE if background_color is set, background and border
+  # will span width of page
+  border_color:                         DDDDDD
   border_width: 0.25
-  height: $base_line_height_length * 2.5
+  height:                               $base_line_height_length * 2.5
   line_height: 1
-  padding: [$base_line_height_length / 2, 1, 0, 1]
-  vertical_align: top
+  padding:                              [$base_line_height_length / 2, 1, 0, 1]
+  vertical_align:                       top
   recto:
     #columns: "<50% =0% >50%"
     right:
-      content: '{page-number}'
+      content:                          '{page-number}'
   verso:
     #columns: $footer_recto_columns
     left:
-      content: $footer_recto_right_content
+      content:                          $footer_recto_right_content