jekyll-theme-mdui 0.4.8 → 0.4.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b86ddec4ee7849ba0d5a7cbc32d1d47c1f6f2e04
-  data.tar.gz: ffa79c6e84759c37039c4e2fc09dab8ab3038e3e
+  metadata.gz: '03707090b7e5731926fd544116dde58e0e507bf8'
+  data.tar.gz: 39de17442456bbe37f297389c94ee73da243194b
 SHA512:
-  metadata.gz: 35f9401c2924faf8ec858c36d7553f48b6c68378af1809973bd110c96621b6ad753d6a3483f93dc477e360ae05f36c8299ad0d0c7d084ccbb276966713d978e7
-  data.tar.gz: df41ac061fe8073e0c2e582d0a48d1400e3fd5c00acc5a92ba854a75872ac72395a4ddd5a19119ec39f3c8471dd904980c4ab52c59f4a75d1f981d989970205a
+  metadata.gz: 955559563a89595b101896c1cd009dcf93e3f3e21a8ca313f3df9508a81c0c9187b29aceb5eb589e66ee2dad5901ec32586fabd41f4fa950df7062d5e4b862d2
+  data.tar.gz: a21a1867623dc1389a3e94b47bb9ff6a48a526a62efcd82e3fef2568fb19a1a8bedc14dc35960502e223ac76e1ce856133decd950bba64c5483be96234a97545

data/README.md

@@ -18,7 +18,7 @@
 
 ## General
 
-[![Version](https://img.shields.io/badge/version-0.4.8-green.svg?style=flat-square)]()
+[![Version](https://img.shields.io/badge/version-0.4.9-green.svg?style=flat-square)]()
 [![Jekyll](https://img.shields.io/badge/Jekyll-3.4+-green.svg?style=flat-square)](https://jekyllrb.com/)
 [![Gem](https://img.shields.io/gem/dt/jekyll-theme-mdui.svg?style=flat-square)](https://rubygems.org/gems/jekyll-theme-mdui/)
 
@@ -46,8 +46,8 @@
 
 ## TODO
 
-- [ ] Editor - Online preview (!!!Need Help!!!)
 - [ ] Category - Better style
+- [ ] Tags - Better style
 - [ ] Site style - More custom options
 
 ## Note

data/_includes/comment/disqus.html

@@ -0,0 +1,75 @@
+{% if  site.data.site.lang == 'zh-CN' %}
+{% assign lang = site.data.lang[site.data.site.lang] %}
+{% else %}
+{% assign lang = site.data.lang.en-US %}
+{% endif %}
+<style>
+    #disqus_thread{
+        padding: 16px;
+        display: none;
+    }
+</style>
+{% if site.data.site.disqus.disqus_shortname != "" %}
+<div class="mdui-divider"></div>
+    {% if site.data.site.disqus.disqus_proxy == false %}
+    {% if site.data.site.disqus.disqus_button == true %}
+    <button id="load-disqus" class="mdui-btn mdui-btn-block mdui-center" onclick="disqus.load();" data="{{ site.data.site.disqus.disqus_shortname }}">{{lang.post.comments_load_button}}</button>
+    <div id="disqus_thread"></div>
+    <script>
+var disqus = {
+    load : 
+    function disqus(){
+        $('#disqus_thread').css('display','block');
+        if ($('#dsq-app4').attr('name') == 'dsq-app4'){
+            DISQUS.reset({
+                reload: true,
+                config: function () {  
+                }
+            });
+        }else{
+        var disqus_shortname = $("#load-disqus").attr("data");
+        if(typeof DISQUS !== 'object') {
+            (function () {
+                var s = document.createElement('script'); s.async = true;
+                s.type = 'text/javascript';
+                s.src = '//' + disqus_shortname + '.disqus.com/embed.js';
+                (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
+            }());
+        }
+        }
+        $('#load-disqus').remove(); 
+    }
+};
+    </script>
+    {% else %}
+    <div id="disqus_thread"></div>
+    <script>
+        function disqus(){
+        var disqus_shortname = '{{ site.data.site.disqus.disqus_shortname }}';
+        if(typeof DISQUS !== 'object') {
+            (function () {
+                var s = document.createElement('script'); s.async = true;
+                s.type = 'text/javascript';
+                s.src = '//' + disqus_shortname + '.disqus.com/embed.js';
+                (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
+            }());
+        }
+        if ($('#dsq-app4').attr('name') == 'dsq-app4'){
+        DISQUS.reset({
+            reload: true,
+            config: function () {  
+            }
+        });
+        }
+    }
+    disqus();
+    </script>
+    {% endif %}
+    {% endif %}
+{% if site.data.site.disqus.disqus_proxy %}
+<div class="mdui-divider"></div>
+<div id="disqusreadonly" style="padding-top: 16px;">
+</div>
+{% endif %}
+{% endif %}
+

data/_includes/component/nprogress.html

@@ -0,0 +1,25 @@
+<link rel="stylesheet" href="https://cdn.bootcss.com/nprogress/0.2.0/nprogress.min.css">
+<script src="https://cdn.bootcss.com/nprogress/0.2.0/nprogress.min.js"></script>
+<script>
+$(document).ready(function () {
+    NProgress.configure({
+    showSpinner: true
+});
+NProgress.start();
+$('#nprogress .bar').css({
+    'background': '{{site.data.site.uiux.nprogress_color}}'
+});
+$('#nprogress .peg').css({
+    'box-shadow': '0 0 10px {{site.data.site.uiux.nprogress_color}}, 0 0 15px {{site.data.site.uiux.nprogress_color}}'
+});
+$('#nprogress .spinner-icon').css({
+    'border-top-color': '{{site.data.site.uiux.nprogress_color}}',
+    'border-left-color': '{{site.data.site.uiux.nprogress_color}}'
+});
+setTimeout(function() {
+    NProgress.done();
+},{{site.data.site.uiux.nprogress_buffer}});
+    
+});
+
+</script>

data/_includes/component/sw.html

@@ -0,0 +1,7 @@
+<script>
+    if ('serviceWorker' in navigator) {
+        navigator.serviceWorker.register("{{ "/sw.js" | relative_url }}").then(function() {
+            console.log("Service Worker Registered");
+        });
+    }
+</script>

data/_includes/{qrcode.html → content/component/qrcode.html}

@@ -3,6 +3,12 @@
 {% else %}
 {% assign lang = site.data.lang.en-US %}
 {% endif %}
+<style>
+#k-qrcode{
+    padding-bottom: 0px;
+    width: 215px;
+}
+</style>
     <button class="mdui-btn mdui-btn-icon" mdui-tooltip="{content: '{{lang.post.qrcode }}', delay: 100}" mdui-menu="{target: '#k-qrcode',align:'right',covered:false}"><i class="mdui-icon material-icons">devices other</i></button>
     <ul  class="mdui-menu mdui-menu-cascade" id="k-qrcode">
         <li class="mdui-menu-item">

data/_includes/content/component/toc.html

@@ -0,0 +1,84 @@
+<style>
+    #k-toc-card{
+        background-color: transparent;
+        width: 260px;
+        list-style: none;
+        padding: 0;
+    }
+    #k-toc-card ul{
+        list-style: none;
+        padding: 0px;
+    }
+    .pin-top {
+        margin-top: 245px;
+    }
+    .pinned {
+        position: fixed;
+    }
+    #k-toc-card li{
+        max-width: 300px;
+        min-width: 200px;
+    }
+    #k-toc-card a{
+            text-align: left;
+    color: black;
+    display: block;
+    width: 100%;
+    text-decoration: none;
+    position: relative;
+    min-width: 88px;
+    height: 36px;
+    box-sizing: border-box;
+    padding: 0 16px;
+    margin: 0;
+    overflow: hidden;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 36px;
+    text-transform: uppercase;
+    letter-spacing: .04em;
+    white-space: nowrap;
+    vertical-align: middle;
+    -ms-touch-action: manipulation;
+    touch-action: manipulation;
+    zoom: 1;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    background: transparent;
+    border: none;
+    border-radius: 2px;
+    outline: none;
+    transition: all .2s cubic-bezier(.4, 0, .2, 1), box-shadow .2s cubic-bezier(.4, 0, 1, 1);
+    will-change: box-shadow;
+    -webkit-user-drag: none;
+    }
+    #k-toc-card a:hover {
+        background-color: rgba(0, 0, 0, .1);
+    }
+    #toc ul .toc-active {
+    border-left: 3px solid #448aff;
+    background-color: rgba(0, 0, 0, .2);
+}
+</style>
+<div id="k-toc-card" class="mdui-card mdui-shadow-0">
+    <div id="toc"></div>
+</div>
+<script>
+    Materialize={};Materialize.guid=(function(){function s4(){return Math.floor((1+Math.random())*65536).toString(16).substring(1)}return function(){return s4()+s4()+"-"+s4()+"-"+s4()+"-"+s4()+"-"+s4()+s4()+s4()}})();(function($){$.fn.pushpin=function(options){var defaults={top:0,bottom:Infinity,offset:0};if(options==="remove"){this.each(function(){if(id=$(this).data("pushpin-id")){$(window).off("scroll."+id);$(this).removeData("pushpin-id").removeClass("pin-top pinned pin-bottom").removeAttr("style")}});return false}options=$.extend(defaults,options);$index=0;return this.each(function(){var $uniqueId=Materialize.guid(),$this=$(this),$original_offset=$(this).offset().top;function removePinClasses(object){object.removeClass("pin-top");object.removeClass("pinned");object.removeClass("pin-bottom")}function updateElements(objects,scrolled){objects.each(function(){if(options.top<=scrolled&&options.bottom>=scrolled&&!$(this).hasClass("pinned")){removePinClasses($(this));$(this).css("top",options.offset);$(this).addClass("pinned")}if(scrolled<options.top&&!$(this).hasClass("pin-top")){removePinClasses($(this));$(this).css("top",0);$(this).addClass("pin-top")}if(scrolled>options.bottom&&!$(this).hasClass("pin-bottom")){removePinClasses($(this));$(this).addClass("pin-bottom");$(this).css("top",options.bottom-$original_offset)}})}$(this).data("pushpin-id",$uniqueId);updateElements($this,$(window).scrollTop());$(window).on("scroll."+$uniqueId,function(){var $scrolled=$(window).scrollTop()+options.offset;updateElements($this,$scrolled)})})}}(jQuery));
+    !function(a){a.fn.smoothScroller=function(b){b=a.extend({},a.fn.smoothScroller.defaults,b);var c=a(this);return a(b.scrollEl).animate({scrollTop:c.offset().top-a(b.scrollEl).offset().top-b.offset},b.speed,b.ease,function(){var a=c.attr("id");a.length&&(history.pushState?history.pushState(null,null,"#"+a):document.location.hash=a),c.trigger("smoothScrollerComplete")}),this},a.fn.smoothScroller.defaults={speed:400,ease:"swing",scrollEl:"body,html",offset:0},a("body").on("click","[data-smoothscroller]",function(b){b.preventDefault();var c=a(this).attr("href");0===c.indexOf("#")&&a(c).smoothScroller()})}(jQuery),function(a){var b={};a.fn.toc=function(b){var c,d=this,e=a.extend({},jQuery.fn.toc.defaults,b),f=a(e.container),g=a(e.selectors,f),h=[],i=e.activeClass,j=function(b,c){if(e.smoothScrolling&&"function"==typeof e.smoothScrolling){b.preventDefault();var f=a(b.target).attr("href");e.smoothScrolling(f,e,c)}a("li",d).removeClass(i),a(b.target).parent().addClass(i)},k=function(){c&&clearTimeout(c),c=setTimeout(function(){for(var b,c=a(window).scrollTop(),f=Number.MAX_VALUE,g=0,j=0,k=h.length;k>j;j++){var l=Math.abs(h[j]-c);f>l&&(g=j,f=l)}a("li",d).removeClass(i),b=a("li:eq("+g+")",d).addClass(i),e.onHighlight(b)},50)};return e.highlightOnScroll&&(a(window).bind("scroll",k),k()),this.each(function(){var b=a(this),c=a(e.listType);g.each(function(d,f){var g=a(f);h.push(g.offset().top-e.highlightOffset);var i=e.anchorName(d,f,e.prefix);if(f.id!==i){a("<span/>").attr("id",i).insertBefore(g)}var l=a("<a/>").text(e.headerText(d,f,g)).attr("href","#"+i).bind("click",function(c){a(window).unbind("scroll",k),j(c,function(){a(window).bind("scroll",k)}),b.trigger("selected",a(this).attr("href"))}),m=a("<li/>").addClass(e.itemClass(d,f,g,e.prefix)).append(l);c.append(m)}),b.html(c)})},jQuery.fn.toc.defaults={container:"body",listType:"<ul/>",selectors:"h1,h2,h3",smoothScrolling:function(b,c,d){a(b).smoothScroller({offset:c.scrollToOffset}).on("smoothScrollerComplete",function(){d()})},scrollToOffset:0,prefix:"toc",activeClass:"toc-active",onHighlight:function(){},highlightOnScroll:!0,highlightOffset:100,anchorName:function(c,d,e){if(d.id.length)return d.id;var f=a(d).text().replace(/[^a-z0-9]/gi," ").replace(/\s+/g,"-").toLowerCase();if(b[f]){for(var g=2;b[f+g];)g++;f=f+"-"+g}return b[f]=!0,e+"-"+f},headerText:function(a,b,c){return c.text()},itemClass:function(a,b,c,d){return d+"-"+c[0].tagName.toLowerCase()}}}(jQuery);
+</script>
+<script>
+    $('#toc').toc({
+        'selectors': 'h2',
+        'prefix': 'toc',
+        'highlightOffset': 64
+    });
+    var tocTop = $('.mdui-card-header').offset().top;
+    $('#k-toc-card').pushpin({
+      top: tocTop,
+      bottom: 99999,
+      offset: 200
+    });
+</script>

data/_includes/content/friends.html

@@ -0,0 +1,24 @@
+<style>
+.k-friend {
+    text-decoration: none;
+}
+</style>
+<div class="k-posts-list"></div>
+<div class="mdui-container">
+    <div class="mdui-row-sm-2 mdui-row-md-4">
+        {% for f in site.data.friends %}
+        <div class="mdui-col">
+            <a class="k-friend" href="{{f.url}}" target="_blank">
+            <div class="mdui-card mdui-hoverable">
+                <div class="mdui-card-header">
+                    <img class="mdui-card-header-avatar" src="{{f.image}}" />
+                    <div class="mdui-card-header-title">{{f.name}}</div>
+                    <div class="mdui-card-header-subtitle">{{f.describe}}</div>
+                </div>
+            </div>
+            </a>
+            <br>
+        </div>
+        {% endfor %}
+    </div>
+</div>

data/_includes/content/page_content.html

@@ -0,0 +1,51 @@
+<style>
+
+.k-post-media {
+    display:block
+    cursor: pointer;
+    max-height: 245px;
+    min-height: 245px;
+    background-position: 50% 50%;
+    background-size: cover;
+    background-color: white;
+}
+.k-post-media .mdui-card-primary-title a {
+    text-decoration: none;
+}
+</style>
+<div id="postpage" class="mdui-container">
+    <div class="k-posts-list"></div>
+    <div class="mdui-row">
+        <div class="mdui-col-sm-12 k-page-col mdui-col-md-9">
+            <div class="mdui-card">
+                <div class="mdui-card-media k-post-media" style="background-image: url({{page.img}});">
+                    <div class="mdui-card-media-covered mdui-card-media-covered-gradient">
+                        <div class="mdui-card-primary">
+                            <div class="mdui-card-primary-title"><a class="mdui-text-color-white-text">{{page.title}}</a></div>
+                        </div>
+                    </div>
+                </div>
+                <div class="mdui-card-header">
+                    <div class="mdui-card-menu">
+                    {% include content/component/qrcode.html %}
+                    {% include content/component/page_tags.html %}
+                    {% include content/component/sns_share.html %}
+                    </div>
+                    <img class="mdui-card-header-avatar" src="{{site.data.site.img.avatar}}" />
+                    <div class="mdui-card-header-title">{{site.author}}</div>
+                    <div class="mdui-card-header-subtitle">{{ page.date | date: "%b %-d, %Y" }}</div>
+                </div>
+                <div class="mdui-card-content mdui-typo">
+                    {{ content }}
+                </div>
+                {% include comment/disqus.html %}
+            </div>
+        </div>
+        <div class="mdui-col-md-3 mdui-hidden-sm-down">
+            {% include content/component/toc.html %}
+        </div>
+    </div>
+    <br>
+    <script>
+</script>
+</div>

data/_includes/content/paginator_button.html

@@ -0,0 +1,25 @@
+  {% if paginator.total_pages > 1 %}
+  <div class="mdui-row-xs-3">
+    <div class="mdui-col">
+        {% if paginator.previous_page %}
+        <a href="{{ paginator.previous_page_path | prepend: site.baseurl | replace: '//', '/' }}" class="mdui-btn mdui-btn-icon "><i class="mdui-icon material-icons">arrow_back</i></a>
+        {% else %}
+        <button disabled class="mdui-btn mdui-btn-icon "><i class="mdui-icon material-icons">arrow_back</i></button> 
+        {% endif%}
+    </div>
+
+    <div class="mdui-col  mdui-text-center">
+      <p style="width:100%">{{paginator.page}}/{{paginator.total_pages}}</p>
+    </div>
+
+    <div class="mdui-col">
+      {% if paginator.next_page %}
+        <a href="{{ paginator.next_page_path | prepend: site.baseurl | replace: '//', '/' }}" class="mdui-btn mdui-btn-icon mdui-float-right"><i class="mdui-icon material-icons">arrow_forward</i></a>
+        {% else %}
+        <button disabled class="mdui-btn mdui-btn-icon mdui-float-right"><i class="mdui-icon material-icons">arrow_forward</i></button>
+        {% endif %}
+    </div>
+
+  </div>
+</div>
+{% endif %}

data/_includes/content/paginator_post_list.html

@@ -0,0 +1,66 @@
+{% if  site.data.site.lang == 'zh-CN' %}
+{% assign lang = site.data.lang[site.data.site.lang] %}
+{% else %}
+{% assign lang = site.data.lang.en-US %}
+{% endif %}
+<style>
+  .k-list-card{
+    margin-bottom: 45px;
+  }
+.k-post-media {
+    display:block
+    cursor: pointer;
+    max-height: 245px;
+    min-height: 245px;
+    background-position: 50% 50%;
+    background-size: cover;
+    background-color: white;
+}
+.k-post-media .mdui-card-primary-title a {
+    text-decoration: none;
+}
+.k-post-categories {
+    line-height: 40px;
+}
+</style>
+  <div class="k-posts-list">
+    {% for post in paginator.posts %}
+    <div class="mdui-card k-list-card mdui-shadow-{{site.data.site.card.card_shadow}} {% if site.data.site.card.card_hoverable == true%}mdui-hoverable{% endif %}">
+      <div class="mdui-card-media mdui-ripple k-post-media" style="background-image:url({{post.img}})" src="{{post.img}}">
+        <div class="mdui-card-media-covered mdui-card-media-covered-gradient">
+          <div class="mdui-card-primary">
+            <div class="mdui-card-primary-title"><a class="mdui-text-color-white-text" href="{{post.url| prepend: site.baseurl}}#">{{post.title}}</a></div>
+          </div>
+        </div>
+      </div>
+      <div class="mdui-card-content mdui-text-color-black-secondary mdui-typo">
+        {{ post.excerpt | strip_html}} <a href="{{post.url | prepend: site.baseurl}}">{{lang.post.continue}}</a>
+      </div>
+      <div class="mdui-divider"></div>
+      <div class="mdui-card-header">
+        <div class="mdui-card-menu mdui-typo">
+          {% for p in site.pages %}
+          {% if p.layout == "category" %}
+          {% assign ca = p.url %}
+          {% endif %}
+          {% endfor %}
+          <a class="k-post-categories" href="{{ca | prepend: site.baseurl }}?category={{post.categories}}">{{post.categories}}</a>
+        </div>
+        <img class="mdui-card-header-avatar" src="{{site.data.site.img.avatar}}" />
+        <div class="mdui-card-header-title">{{site.author}}</div>
+        <div class="mdui-card-header-subtitle">{{ post.date | date: "%b %-d, %Y" }}</div>
+      </div>
+    </div>
+    {% endfor %}
+  </div>
+  <script>
+    Array.prototype.forEach.call(document.querySelectorAll(".mdui-card-media"), function(a) {
+        var b = a.querySelector("a");
+        if (!b) {
+            return
+        }
+        a.addEventListener("click", function() {
+            b.click();
+        })
+    });
+  </script>

data/_includes/content/tags_list.html

@@ -0,0 +1,100 @@
+{% capture tags %}
+  {% for tag in site.tags %}
+    {{ tag[0] }}
+  {% endfor %}
+{% endcapture %}
+
+{% assign sortedtags = tags | split:' ' | sort %}
+
+<style>
+    .k-tagcloud{
+    padding: 1px 9px;
+    margin: 9px 1px;
+    line-height: 40px;
+    text-decoration: none;
+    white-space: nowrap;
+    transition: .6s;
+    display: inline-block;
+    color: #363636;
+}
+.k-tagcloud:hover{
+    transition: .6s;
+    opacity: 1;
+    background: #fafafa;
+}
+</style>
+<div class="k-posts-list"></div>
+{% if site.data.site.uiux.meng == true %}
+  {% if site.data.meng.background.switch == true %}
+    <div class="mdui-card">
+  {% else %}
+    <div class="">
+  {% endif %}
+{% else %}
+<div class="">
+{% endif %}
+<div class="mdui-card-content">
+  
+
+{% for tag in sortedtags %}
+  {% assign index = site.tags[tag] | size %}
+  {% assign fontsize = 14 %}
+  {% assign color = 125 %}
+  {% for i in (1..index) %}
+  {% capture fontsize %}{{fontsize | plus:1.5}}{% endcapture %}
+  {% endfor %}
+  {% for i in (1..index) %}
+  {% capture color %}{{ color | minus :15}}{% endcapture %}
+  {% endfor %}
+      <a id="{{ tag }}" class="k-tagcloud mdui-ripple mdui-hoverable" style="font-size:{{fontsize}}px;color:rgb({{color}},{{color}},{{color}})">{{ tag }}</a>
+{% endfor %}
+</div>
+<div class="mdui-row">
+  <div class="mdui-col-sm-12">
+    <div id="taglist"></div>
+  </div>
+</div>
+</div>
+
+<script>
+$(function(){
+function getUrlParam(name) {
+    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
+    var r = window.location.search.substr(1).match(reg);
+    if (r != null) return unescape(r[2]); return null;
+}
+function getTagList(id){
+    $.ajax({
+        type: "GET",
+        url:"{{ "/tags.json" | relative_url }}",
+        dataType:"json",
+        cache: true,
+        success: function(data){
+            var content = "<ul class='mdui-list'>";
+            $.each(data,function(i,n){
+                if(n.id === id){
+                   var posts = n.post;
+                   $.each(posts,function(i,n){
+                       content+="<li class='mdui-list-item mdui-ripple'><a href='"+n.url+"'><div class='mdui-list-item-content'><div class='mdui-list-item-title mdui-list-item-one-line'>"+n.title+"</div><div class='mdui-list-item-text mdui-list-item-one-line'>"+n.excerpt+"</div></div></li>";
+                   });
+                }
+            });
+            content += "</ul>";
+            $('#taglist').html(content)
+        }
+    })
+}
+var tagid;
+var urltag = getUrlParam("tag");
+if(urltag!=null){
+        getTagList(urltag);
+}
+$(".k-tagcloud").on("click",function(e){
+    var $this = $(this);
+    tagid = $this.attr("id");
+    if(tagid!=null){
+        getTagList(tagid);
+    }
+});
+})
+</script>