+ <%- partial('share', { scope: 'page' }) %>
+
+<%
+ // 使用 sns 直接分享接口
+ // 微信使用 http://s.jiathis.com/qrcode.php?url=xxx
+ var sUrl = url.replace(/index\.html$/, '')
+ var sTitle = page.title ? '《'+ page.title +'》 — ' + config.title : config.title
+ var sDesc = truncate(strip_html(page.excerpt || config.description), { length: 80})
+ var sPic = page.photos && page.photos.length ? page.photos[0] : url_for(config.avatar)
+%>
+
+
+
+<% if(scope === 'global') { %>
+
+
+
扫一扫，分享到微信
+
+
+<% } %>
diff --git a/package.json b/package.json
index dc9ad4c1..a8734102 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
{
"name": "hexo-theme-material-indigo",
- "version": "1.1.12",
+ "version": "1.2.0",
"private": true
}
diff --git a/source/css/_partial/layout.less b/source/css/_partial/layout.less
index 31b51c39..5bce4309 100644
--- a/source/css/_partial/layout.less
+++ b/source/css/_partial/layout.less
@@ -177,8 +177,7 @@
&.in {
visibility: visible;
pointer-events: auto;
- opacity: .5;
- filter: alpha(opacity=50);
+ opacity: .3;
}
}
diff --git a/source/css/_partial/page.less b/source/css/_partial/page.less
index 5bb1828d..f6684470 100644
--- a/source/css/_partial/page.less
+++ b/source/css/_partial/page.less
@@ -23,7 +23,7 @@
.page-content {
margin-bottom: 30px;
border-bottom: 2px solid @borderColor;
-
+
> blockquote,
> pre,
img,
@@ -131,7 +131,7 @@
text-align: center;
.card(3px)
}
-
+
> h6 {
position: absolute;
top: 50%;
@@ -175,13 +175,13 @@
.page-about-me {
position: relative;
padding: 30px 35px!important;
-
+
.avatar {
margin-right: 35px;
width: 100px;
height: 100px;
box-shadow: @boxShadow;
-
+
img {
border-radius: 50%;
}
@@ -204,10 +204,51 @@
}
.page-about-me {
padding: 15px 20px!important;
- .avatar {
+ .avatar {
margin-right: 20px;
width: 60px;
height: 60px;
}
}
-}
\ No newline at end of file
+}
+
+.page-modal {
+ display: none;
+ position: fixed;
+ top: 24%;
+ left: 50%;
+ z-index: 120;
+ padding: 30px;
+ text-align: center;
+ color: @secondaryTextColor;
+ background: #fff;
+ border-radius: 4px;
+ box-shadow: @boxShadow;
+ opacity: 0;
+ .transform(translate(-50%, -200%));
+
+ &.ready {
+ visibility: hidden;
+ display: block;
+ .transform(translate(-50%, -100%));
+ .transition(.3s);
+ }
+
+ &.in {
+ visibility: visible;
+ opacity: 1;
+ .transform(translate(-50%, 0));
+ }
+
+ .close {
+ position: absolute;
+ right: 15px;
+ top: 15px;
+ color: rgba(0, 0, 0, .2);
+ font-size: 16px;
+ line-height: 20px;
+ &:hover, &:active {
+ color: rgba(0, 0, 0, .4);
+ }
+ }
+}
diff --git a/source/css/_partial/reward.less b/source/css/_partial/reward.less
index 2f60f116..c6c0c900 100644
--- a/source/css/_partial/reward.less
+++ b/source/css/_partial/reward.less
@@ -1,9 +1,9 @@
-.post-reward {
+.page-reward {
margin: 60px 0;
text-align: center;
}
-.post-reward-btn {
+.page-reward-btn {
width: 56px;
height: 56px;
line-height: 56px;
@@ -17,44 +17,6 @@
}
}
-.reward-lay {
- display: none;
- position: fixed;
- top: 24%;
- left: 50%;
- z-index: 120;
- padding: 30px;
- text-align: center;
- color: @secondaryTextColor;
- background: #fff;
- border-radius: 4px;
- box-shadow: @boxShadow;
- opacity: 0;
- .transform(translate(-50%, -200%));
-
- &.ready {
- visibility: hidden;
- display: block;
- .transform(translate(-50%, -100%));
- .transition(.4s);
- }
- &.in {
- visibility: visible;
- opacity: 1;
- .transform(translate(-50%, 0));
- }
-}
-.reward-off {
- position: absolute;
- right: 15px;
- top: 15px;
- color: rgba(0, 0, 0, .2);
- font-size: 16px;
- line-height: 20px;
- &:hover, &:active {
- color: rgba(0, 0, 0, .4);
- }
-}
.reward-title {
position: relative;
padding: 10px 30px;
@@ -105,10 +67,10 @@
}
-@media screen and (max-width: 360px) {
+@media screen and (max-width: 360px) {
.reward-items {
li {
width: 130px;
}
}
-}
\ No newline at end of file
+}
diff --git a/source/css/_partial/share.less b/source/css/_partial/share.less
index 75585bdd..1aa6f99a 100644
--- a/source/css/_partial/share.less
+++ b/source/css/_partial/share.less
@@ -35,8 +35,8 @@
background: #55ACEE
}
- &.douban {
- background: #228A31
+ &.google {
+ background: #db4437
}
}
@@ -102,7 +102,7 @@
@share-fab-size: 42px;
@share-icon-size: @share-fab-size - 8px;
-.post-share-fab {
+.page-share-fab {
display: block;
width: @share-fab-size;
height: @share-fab-size;
@@ -112,17 +112,17 @@
.boxShadow();
}
-.post-share-wrap {
+.page-share-wrap {
position: absolute;
right: 35px;
top: @share-fab-size / -2;
z-index: 2;
- .post-share {
+ .page-share {
visibility: hidden
}
}
-.post-share {
+.page-share {
position: absolute;
bottom: @share-fab-size + 6px;
right: 4px;
@@ -151,7 +151,7 @@
font-size: 1.33333em;
border-radius: 50%;
.tip-left();
- .boxShadow();
+ .boxShadow(.3s);
opacity: 0;
.transform(scale(0));
-webkit-transform-origin: center bottom;
@@ -169,3 +169,13 @@
}
}
+
+.wx-share {
+ p {
+ margin: 0 0 15px;
+ }
+
+ img {
+ width: 200px;
+ }
+}
diff --git a/source/css/_partial/variable.less b/source/css/_partial/variable.less
index 6907efec..e4550c5b 100644
--- a/source/css/_partial/variable.less
+++ b/source/css/_partial/variable.less
@@ -146,7 +146,7 @@
}
&:after {
- left: -4px;
+ left: -3px;
border-left-color: rgba(0, 0, 0, .8);
}
}
diff --git a/source/js/main.js b/source/js/main.js
index 5b59ea22..1edb4288 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -129,43 +129,67 @@
setActive(top);
};
})(),
- share: function(meta) {
-
- var share = $('#global-share'),
- menuShare = $('#menu-share'),
- postShare = $('#post-share'),
- fab = $('#share-fab'),
- sns = $$('.share-sns'),
- summary = meta.summary,
- api = 'http://www.jiathis.com/send/?webid={service}&url=' + meta.url + '&title=' + meta.title + '&summary=' + summary + '&pic=' + location.protocol + '//' + location.host + meta.pic;
-
- function goShare(service) {
- w.open(encodeURI(api.replace('{service}', service)));
+ modal: function(target) {
+ this.$modal = $(target);
+ this.$off = this.$modal.querySelector('.close');
+
+ var _this = this;
+
+ function hideByBody(e) {
+ if (!_this.$modal.contains(e.target)) {
+ _this.hide();
+ }
}
- function show() {
+ this.show = function() {
mask.classList.add('in');
- share.classList.add('in');
+ _this.$modal.classList.add('ready');
+ setTimeout(function() {
+ _this.$modal.classList.add('in');
+ d.addEventListener(even, hideByBody);
+ }, 0)
}
- function hide() {
- share.classList.remove('in');
+ this.hide = function() {
mask.classList.remove('in');
+ _this.$modal.classList.remove('in');
+ setTimeout(function() {
+ _this.$modal.classList.remove('ready');
+ d.removeEventListener(even, hideByBody);
+ }, 300)
}
- forEach.call(sns, function(el) {
- el.addEventListener('click', function() {
- goShare(this.dataset.service);
- }, false);
- });
+ this.toggle = function() {
+ return _this.$modal.classList.contains('in') ? _this.hide() : _this.show();
+ }
- menuShare.addEventListener(even, show, false);
+ this.$off && this.$off.addEventListener(even, this.hide);
+ },
+ share: function() {
+
+ var pageShare = $('#pageShare'),
+ fab = $('#shareFab');
+
+ var shareModal = new this.modal('#globalShare');
- mask.addEventListener(even, hide, false);
+ $('#menuShare').addEventListener(even, shareModal.toggle);
+
+ if(fab) {
+ fab.addEventListener(even, function() {
+ pageShare.classList.toggle('in')
+ }, false)
+
+ d.addEventListener(even, function(e){
+ !fab.contains(e.target) && pageShare.classList.remove('in')
+ }, false)
+ }
+
+ var wxModal = new this.modal('#wxShare');
+
+ forEach.call($$('.wxFab'), function(el){
+ el.addEventListener(even, wxModal.toggle)
+ })
- fab && fab.addEventListener(even, function() {
- postShare.classList.toggle('in');
- }, false);
},
search: function() {
var searchWrap = $('#search-wrap');
@@ -176,46 +200,11 @@
$('#search').addEventListener(even, toggleSearch);
},
- reward: (function() {
-
- var reward = $('#reward');
- var rewardBtn = $('#rewardBtn');
- var rewardOff = $('#rewardOff');
-
- if (!reward) {
- return;
- }
-
- function show() {
- mask.classList.add('in');
- reward.classList.add('ready');
- setTimeout(function() {
- reward.classList.add('in');
- d.addEventListener(even, hideByBody);
- }, 0)
- }
+ reward: function() {
+ var modal = new this.modal('#reward')
- function hide() {
- mask.classList.remove('in');
- reward.classList.remove('in');
- setTimeout(function() {
- reward.classList.remove('ready');
- d.removeEventListener(even, hideByBody);
- }, 300)
- }
-
- function hideByBody(e) {
- if (!reward.contains(e.target)) {
- hide();
- }
- }
-
- rewardBtn.addEventListener(even, function() {
- return reward.classList.contains('in') ? hide() : show();
- });
- rewardOff.addEventListener(even, hide);
-
- })(),
+ $('#rewardBtn').addEventListener(even, modal.toggle)
+ },
fixNavMinH: (function() {
var nav = $('.nav');
@@ -289,7 +278,11 @@
}, false);
if (w.BLOG.SHARE) {
- Blog.share(w.BLOG.SHARE)
+ Blog.share()
+ }
+
+ if (w.BLOG.REWARD) {
+ Blog.reward()
}
Blog.docEl = docEl;
diff --git a/source/js/main.min.js b/source/js/main.min.js
index 3c936d9f..4d7ff921 100644
--- a/source/js/main.min.js
+++ b/source/js/main.min.js
@@ -1 +1 @@
-!function(e,t){var n=t.body,a=t.querySelector.bind(t),s=t.querySelectorAll.bind(t),o=a("html"),r=a("#gotop"),c=a("#menu"),l=a("#header"),d=a("#mask"),f=a("#menu-toggle"),u=a("#menu-off"),v=a("#loading"),h=e.requestAnimationFrame,L=Array.prototype.forEach,g="ontouchstart"in e&&/Mobile|Android|iOS|iPhone|iPad|iPod|Windows Phone|KFAPWI/i.test(navigator.userAgent)?"touchstart":"click",p=function(){},m=function(e){var t=e.offsetLeft,n=e.offsetTop;if(e.offsetParent){var i=arguments.callee(e.offsetParent);t+=i.x,n+=i.y}return{x:t,y:n}},y=navigator.userAgent.indexOf("Firefox")!==-1?t.documentElement:n,E={goTop:function(){var e=y.scrollTop;e>400?(y.scrollTop=e-400,h(arguments.callee)):y.scrollTop=0},toggleGotop:function(t){t>e.innerHeight/2?r.classList.add("in"):r.classList.remove("in")},toggleMenu:function(t){t?(c.classList.remove("hide"),e.innerWidth<1241&&(d.classList.add("in"),c.classList.add("show"),o.classList.add("lock"))):(c.classList.remove("show"),d.classList.remove("in"),o.classList.remove("lock"))},fixedHeader:function(e){e>l.clientHeight?l.classList.add("fixed"):l.classList.remove("fixed")},fixedToc:function(){function t(t){for(i=0,len=d.length;i
m(d[i]).y-c){n.querySelector("li.active").classList.remove("active");var a=n.querySelector('a[href="#'+d[i].id+'"]').parentNode;a.classList.add("active"),a.offsetTop>=n.clientHeight-c?n.scrollTop=a.offsetTop-n.clientHeight+parseInt(e.innerHeight/3):n.scrollTop=0}tr-c?n.classList.add("fixed"):n.classList.remove("fixed"),t(e)}}(),share:function(t){function n(t){e.open(encodeURI(h.replace("{service}",t)))}function i(){d.classList.add("in"),r.classList.add("in")}function o(){r.classList.remove("in"),d.classList.remove("in")}var r=a("#global-share"),c=a("#menu-share"),l=a("#post-share"),f=a("#share-fab"),u=s(".share-sns"),v=t.summary,h="http://www.jiathis.com/send/?webid={service}&url="+t.url+"&title="+t.title+"&summary="+v+"&pic="+location.protocol+"//"+location.host+t.pic;L.call(u,function(e){e.addEventListener("click",function(){n(this.dataset.service)},!1)}),c.addEventListener(g,i,!1),d.addEventListener(g,o,!1),f&&f.addEventListener(g,function(){l.classList.toggle("in")},!1)},search:function(){function e(){t.classList.toggle("in")}var t=a("#search-wrap");a("#search").addEventListener(g,e)},reward:function(){function e(){d.classList.add("in"),s.classList.add("ready"),setTimeout(function(){s.classList.add("in"),t.addEventListener(g,i)},0)}function n(){d.classList.remove("in"),s.classList.remove("in"),setTimeout(function(){s.classList.remove("ready"),t.removeEventListener(g,i)},300)}function i(e){s.contains(e.target)||n()}var s=a("#reward"),o=a("#rewardBtn"),r=a("#rewardOff");s&&(o.addEventListener(g,function(){return s.classList.contains("in")?n():e()}),r.addEventListener(g,n))}(),fixNavMinH:function(){function e(){t.style.minHeight=t.parentNode.clientHeight-t.nextElementSibling.offsetHeight+"px"}var t=a(".nav");return e}(),waterfall:function(){if(!(e.innerWidth<760)){var t=s(".waterfall");L.call(t,function(e){var t=e.querySelectorAll(".waterfall-item"),n=[0,0];L.call(t,function(e){var t=n[0]<=n[1]?0:1;e.style.cssText="top:"+n[t]+"px;left:"+(t>0?"50%":0),n[t]+=e.offsetHeight}),e.style.height=Math.max(n[0],n[1])+"px",e.classList.add("done")})}},tabBar:function(e){e.parentNode.parentNode.classList.toggle("expand")}};e.addEventListener("load",function(){E.fixNavMinH(),E.waterfall(),v.classList.remove("active")}),e.addEventListener("resize",function(){e.BLOG.even=g="ontouchstart"in e?"touchstart":"click",E.fixNavMinH(),E.toggleMenu(),E.waterfall()}),r.addEventListener(g,function(){h(E.goTop)},!1),f.addEventListener(g,function(e){E.toggleMenu(!0),e.preventDefault()},!1),u.addEventListener(g,function(){c.classList.add("hide")},!1),d.addEventListener(g,function(){E.toggleMenu()},!1),t.addEventListener("scroll",function(){var e=y.scrollTop;E.toggleGotop(e),E.fixedHeader(e),E.fixedToc(e)},!1),e.BLOG.SHARE&&E.share(e.BLOG.SHARE),E.docEl=y,E.noop=p,E.even=g,E.$=a,E.$$=s,Object.keys(E).reduce(function(e,t){return e[t]=E[t],e},e.BLOG),Waves.init(),Waves.attach(".global-share li",["waves-block"]),Waves.attach(".article-tag-list-link, #page-nav a, #page-nav span",["waves-button"])}(window,document);
\ No newline at end of file
+!function(e,t){var n=t.body,a=t.querySelector.bind(t),o=t.querySelectorAll.bind(t),s=a("html"),r=a("#gotop"),l=a("#menu"),c=a("#header"),d=a("#mask"),f=a("#menu-toggle"),u=a("#menu-off"),h=a("#loading"),v=e.requestAnimationFrame,g=Array.prototype.forEach,L="ontouchstart"in e&&/Mobile|Android|iOS|iPhone|iPad|iPod|Windows Phone|KFAPWI/i.test(navigator.userAgent)?"touchstart":"click",m=function(){},p=function(e){var t=e.offsetLeft,n=e.offsetTop;if(e.offsetParent){var i=arguments.callee(e.offsetParent);t+=i.x,n+=i.y}return{x:t,y:n}},y=navigator.userAgent.indexOf("Firefox")!==-1?t.documentElement:n,w={goTop:function(){var e=y.scrollTop;e>400?(y.scrollTop=e-400,v(arguments.callee)):y.scrollTop=0},toggleGotop:function(t){t>e.innerHeight/2?r.classList.add("in"):r.classList.remove("in")},toggleMenu:function(t){t?(l.classList.remove("hide"),e.innerWidth<1241&&(d.classList.add("in"),l.classList.add("show"),s.classList.add("lock"))):(l.classList.remove("show"),d.classList.remove("in"),s.classList.remove("lock"))},fixedHeader:function(e){e>c.clientHeight?c.classList.add("fixed"):c.classList.remove("fixed")},fixedToc:function(){function t(t){for(i=0,len=d.length;ip(d[i]).y-l){n.querySelector("li.active").classList.remove("active");var a=n.querySelector('a[href="#'+d[i].id+'"]').parentNode;a.classList.add("active"),a.offsetTop>=n.clientHeight-l?n.scrollTop=a.offsetTop-n.clientHeight+parseInt(e.innerHeight/3):n.scrollTop=0}tr-l?n.classList.add("fixed"):n.classList.remove("fixed"),t(e)}}(),modal:function(e){function n(e){i.$modal.contains(e.target)||i.hide()}this.$modal=a(e),this.$off=this.$modal.querySelector(".close");var i=this;this.show=function(){d.classList.add("in"),i.$modal.classList.add("ready"),setTimeout(function(){i.$modal.classList.add("in"),t.addEventListener(L,n)},0)},this.hide=function(){d.classList.remove("in"),i.$modal.classList.remove("in"),setTimeout(function(){i.$modal.classList.remove("ready"),t.removeEventListener(L,n)},300)},this.toggle=function(){return i.$modal.classList.contains("in")?i.hide():i.show()},this.$off&&this.$off.addEventListener(L,this.hide)},share:function(){var e=a("#pageShare"),n=a("#shareFab"),i=new this.modal("#globalShare");a("#menuShare").addEventListener(L,i.toggle),n&&(n.addEventListener(L,function(){e.classList.toggle("in")},!1),t.addEventListener(L,function(t){!n.contains(t.target)&&e.classList.remove("in")},!1));var s=new this.modal("#wxShare");g.call(o(".wxFab"),function(e){e.addEventListener(L,s.toggle)})},search:function(){function e(){t.classList.toggle("in")}var t=a("#search-wrap");a("#search").addEventListener(L,e)},reward:function(){var e=new this.modal("#reward");a("#rewardBtn").addEventListener(L,e.toggle)},fixNavMinH:function(){function e(){t.style.minHeight=t.parentNode.clientHeight-t.nextElementSibling.offsetHeight+"px"}var t=a(".nav");return e}(),waterfall:function(){if(!(e.innerWidth<760)){var t=o(".waterfall");g.call(t,function(e){var t=e.querySelectorAll(".waterfall-item"),n=[0,0];g.call(t,function(e){var t=n[0]<=n[1]?0:1;e.style.cssText="top:"+n[t]+"px;left:"+(t>0?"50%":0),n[t]+=e.offsetHeight}),e.style.height=Math.max(n[0],n[1])+"px",e.classList.add("done")})}},tabBar:function(e){e.parentNode.parentNode.classList.toggle("expand")}};e.addEventListener("load",function(){w.fixNavMinH(),w.waterfall(),h.classList.remove("active")}),e.addEventListener("resize",function(){e.BLOG.even=L="ontouchstart"in e?"touchstart":"click",w.fixNavMinH(),w.toggleMenu(),w.waterfall()}),r.addEventListener(L,function(){v(w.goTop)},!1),f.addEventListener(L,function(e){w.toggleMenu(!0),e.preventDefault()},!1),u.addEventListener(L,function(){l.classList.add("hide")},!1),d.addEventListener(L,function(){w.toggleMenu()},!1),t.addEventListener("scroll",function(){var e=y.scrollTop;w.toggleGotop(e),w.fixedHeader(e),w.fixedToc(e)},!1),e.BLOG.SHARE&&w.share(),e.BLOG.REWARD&&w.reward(),w.docEl=y,w.noop=m,w.even=L,w.$=a,w.$$=o,Object.keys(w).reduce(function(e,t){return e[t]=w[t],e},e.BLOG),Waves.init(),Waves.attach(".global-share li",["waves-block"]),Waves.attach(".article-tag-list-link, #page-nav a, #page-nav span",["waves-button"])}(window,document);
\ No newline at end of file