+ Likely for Articles

src/3rdparty/likely.css

@@ -0,0 +1 @@
+.likely,.likely__widget{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:0;text-indent:0!important;list-style:none!important;font-weight:400;font-family:Helvetica Neue,Arial,sans-serif}.likely{display:inline-block}.likely__widget{margin:0;font-size:inherit}.likely{opacity:0;font-size:0!important}.likely_visible{opacity:1;transition:opacity .1s ease-in}.likely>*{display:inline-block;visibility:hidden}.likely_visible>*{visibility:inherit}.likely__widget{position:relative;white-space:nowrap}.likely__button,.likely__widget{display:inline-block}.likely__button,.likely__counter{text-decoration:none;text-rendering:optimizeLegibility;margin:0;outline:0}.likely__button{position:relative;user-select:none}.likely__counter{display:none;position:relative;font-weight:400}.likely_ready .likely__counter{display:inline-block}.likely_ready .likely__counter_empty{display:none}.likely__button,.likely__counter,.likely__icon,.likely__widget{vertical-align:top}.likely__widget{transition:background .33s ease-out,color .33s ease-out,fill .33s ease-out}.likely__widget:active,.likely__widget:focus,.likely__widget:hover{transition:none;cursor:pointer}@media (hover:none){.likely__widget:active,.likely__widget:focus,.likely__widget:hover{transition:background .33s ease-out,color .33s ease-out,fill .33s ease-out;cursor:unset}}.likely__icon{position:relative;text-align:left;display:inline-block}.likely svg{position:absolute;left:3px;top:3px;width:16px;height:16px}.likely__button,.likely__counter{line-height:inherit;cursor:inherit}.likely__button:empty{display:none}.likely__counter{text-align:center}.likely .likely__widget{color:#000;background:rgba(231,231,231,.8)}.likely .likely__counter{background-size:1px 1px;background-repeat:repeat-y;background-image:linear-gradient(to right,rgba(0,0,0,.2) 0,rgba(0,0,0,0) .5px,rgba(0,0,0,0) 100%)}.likely-light .likely__widget{color:#fff;fill:#fff;background:rgba(236,236,236,.16);text-shadow:rgba(0,0,0,.2) 0 0 .33em}.likely-light .likely__counter{background-image:linear-gradient(to right,rgba(255,255,255,.4) 0,rgba(255,255,255,0) .5px,rgba(255,255,255,0) 100%)}.likely__widget_facebook{fill:#425497}.likely__widget_facebook:active,.likely__widget_facebook:focus,.likely__widget_facebook:hover{background:rgba(207,212,229,.8)}@media (hover:none){.likely__widget_facebook:active,.likely__widget_facebook:focus,.likely__widget_facebook:hover{background:rgba(231,231,231,.8)}}.likely-light .likely__widget_facebook:active,.likely-light .likely__widget_facebook:focus,.likely-light .likely__widget_facebook:hover{text-shadow:#425497 0 0 .25em;background:rgba(66,84,151,.7)}@media (hover:none){.likely-light .likely__widget_facebook:active,.likely-light .likely__widget_facebook:focus,.likely-light .likely__widget_facebook:hover{text-shadow:rgba(0,0,0,.2) 0 0 .33em;background:rgba(236,236,236,.16)}}.likely__widget_twitter{fill:#00b7ec}.likely__widget_twitter:active,.likely__widget_twitter:focus,.likely__widget_twitter:hover{background:rgba(191,237,250,.8)}@media (hover:none){.likely__widget_twitter:active,.likely__widget_twitter:focus,.likely__widget_twitter:hover{background:rgba(231,231,231,.8)}}.likely-light .likely__widget_twitter:active,.likely-light .likely__widget_twitter:focus,.likely-light .likely__widget_twitter:hover{text-shadow:#00b7ec 0 0 .25em;background:rgba(0,183,236,.7)}@media (hover:none){.likely-light .likely__widget_twitter:active,.likely-light .likely__widget_twitter:focus,.likely-light .likely__widget_twitter:hover{text-shadow:rgba(0,0,0,.2) 0 0 .33em;background:rgba(236,236,236,.16)}}.likely__widget_gplus{fill:#dd4241}.likely__widget_gplus:active,.likely__widget_gplus:focus,.likely__widget_gplus:hover{background:rgba(246,207,207,.8)}@media (hover:none){.likely__widget_gplus:active,.likely__widget_gplus:focus,.likely__widget_gplus:hover{background:rgba(231,231,231,.8)}}.likely-light .likely__widget_gplus:active,.likely-light .likely__widget_gplus:focus,.likely-light .likely__widget_gplus:hover{text-shadow:#dd4241 0 0 .25em;background:rgba(221,66,65,.7)}@media (hover:none){.likely-light .likely__widget_gplus:active,.likely-light .likely__widget_gplus:focus,.likely-light .likely__widget_gplus:hover{text-shadow:rgba(0,0,0,.2) 0 0 .33em;background:rgba(236,236,236,.16)}}.likely__widget_vkontakte{fill:#526e8f}.likely__widget_vkontakte:active,.likely__widget_vkontakte:focus,.likely__widget_vkontakte:hover{background:rgba(211,218,227,.8)}@media (hover:none){.likely__widget_vkontakte:active,.likely__widget_vkontakte:focus,.likely__widget_vkontakte:hover{background:rgba(231,231,231,.8)}}.likely-light .likely__widget_vkontakte:active,.likely-light .likely__widget_vkontakte:focus,.likely-light .likely__widget_vkontakte:hover{text-shadow:#526e8f 0 0 .25em;background:rgba(82,110,143,.7)}@media (hover:none){.likely-light .likely__widget_vkontakte:active,.likely-light .likely__widget_vkontakte:focus,.likely-light .likely__widget_vkontakte:hover{text-shadow:rgba(0,0,0,.2) 0 0 .33em;backLine truncated

src/3rdparty/likely.js

@@ -0,0 +1,8 @@
+/*!
+ * Likely 2.2.1 by Ilya Birman (ilyabirman.net)
+ * Rewritten sans jQuery by Evgeny Steblinsky (volter9.github.io)
+ * Supported by Ivan Akulov (iamakulov.com), Viktor Karpov (vitkarpov.com), and contributors
+ * Inspired by Social Likes by Artem Sapegin (sapegin.me)
+ */
+!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports.likely=n():t.likely=n()}(this,function(){return function(t){function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}var e={};return n.m=t,n.c=e,n.i=function(t){return t},n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:i})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},n.p="",n(n.s=20)}([function(t,n,e){"use strict";e.d(n,"c",function(){return o}),e.d(n,"i",function(){return c}),e.d(n,"d",function(){return u}),e.d(n,"e",function(){return a}),e.d(n,"f",function(){return s}),e.d(n,"k",function(){return l}),e.d(n,"g",function(){return h}),e.d(n,"a",function(){return p}),e.d(n,"h",function(){return f}),e.d(n,"b",function(){return v}),e.d(n,"j",function(){return d});var i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r={yes:!0,no:!1},o=function(t,n){for(var e in t)t.hasOwnProperty(e)&&n(t[e],e)},c=function(t){return Array.prototype.slice.call(t)},u=function(){for(var t={},n=Array.prototype.slice.call(arguments),e=0;e<n.length;e++){var i=n[e];if(i)for(var r in i)i.hasOwnProperty(r)&&(t[r]=i[r])}return t},a=function(t,n){for(var e in n)n.hasOwnProperty(e)&&(t[e]=n[e]);return t},s=function(t){if("object"===i(t.dataset))return t.dataset;var n=void 0,e={},r=t.attributes,o=void 0,c=void 0,u=function(t){return t.charAt(1).toUpperCase()};for(n=r.length-1;n>=0;n--)o=r[n],o&&o.name&&/^data-\w[\w\-]*$/.test(o.name)&&(c=o.name.substr(5).replace(/-./g,u),e[c]=o.value);return e},l=function(t){var n={},e=s(t);for(var i in e)if(e.hasOwnProperty(i)){var o=e[i];n[i]=r[o]||o}return n},h=function(t,n){return t?t.replace(/\{([^\}]+)\}/g,function(t,e){return e in n?n[e]:t}):""},p=function(t,n){for(var e in n)n.hasOwnProperty(e)&&(n[e]=encodeURIComponent(n[e]));return h(t,n)},f=function t(n){var e=encodeURIComponent,t=[];for(var r in n)"object"!==i(n[r])&&t.push(e(r)+"="+e(n[r]));return t.join("&")},v=function(t,n,e){var i=n.split("."),r=null;i.forEach(function(n,e){"undefined"==typeof t[n]&&(t[n]={}),e!==i.length-1&&(t=t[n]),r=n}),t[r]=e},d=function(){var t=document.querySelector('link[rel="canonical"]');return t?t.href:window.location.href.replace(window.location.hash,"")}},function(t,n,e){"use strict";e.d(n,"d",function(){return o}),e.d(n,"f",function(){return c}),e.d(n,"b",function(){return u}),e.d(n,"a",function(){return a}),e.d(n,"e",function(){return s}),e.d(n,"c",function(){return l}),e.d(n,"g",function(){return h});var i=document.createElement("div"),r=0,o=function(t){return'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path d="M'+t+'z"/></svg>'},c=function(t){return i.innerHTML=t,i.children[0]},u=function(t){var n=document.createElement("script"),e=document.head;n.type="text/javascript",n.src=t,e.appendChild(n),e.removeChild(n)},a=function(t,n){var e=encodeURIComponent("random_fun_"+ ++r),i=t.replace(/callback=(\?)/,"callback="+e);window[e]=n,u(i)},s=function(t,n){return(n||document).querySelector(t)},l=function(t,n){return Array.prototype.slice.call((n||document).querySelectorAll(t))},h=function(t,n,e,i){var r=Math.round(screen.width/2-e/2),o=0;screen.height>i&&(o=Math.round(screen.height/3-i/2));var c="left="+r+",top="+o+",width="+e+",height="+i+",personalbar=0,toolbar=0,scrollbars=1,resizable=1",u=window.open(t,n,c);return u?(u.focus(),u):(location.href=t,null)}},function(t,n,e){"use strict";n.a={name:"likely",prefix:"likely__"}},function(t,n,e){"use strict";var i=e(9),r=e(0),o=e(18),c=e(10),u=e(11),a=e(12),s=e(13),l=e(14),h=e(15),p=e(16),f=e(17),v={facebook:c.a,gplus:u.a,linkedin:a.a,odnoklassniki:s.a,pinterest:l.a,telegram:h.a,twitter:p.a,vkontakte:f.a};e.i(r.c)(v,function(t,n){e.i(i.a)(t),t.svgi=o.a[n],t.name=n}),n.a=v},function(t,n,e){"use strict";function i(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}var r=e(0),o=e(19),c=e(2),u=e(1),a=e(8),s=function(){function t(t,n){for(var e=0;e<n.length;e++){var i=n[e];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(n,e,i){return e&&t(n.prototype,e),i&&t(n,i),n}}(),l=function(t,n){var i=n||{},u={counters:!0,timeout:1e3,zeroes:!1,title:document.title,wait:500,url:e.i(r.j)()},a=t[c.a.name],s=e.i(r.d)({},u,i,e.i(r.k)(t));return a?a.update(s):t[c.a.name]=new o.a(t,s),a},h=function(){function t(){return i(this,t),console.warn("likely function is DEPRECATED and will be removed in 3.0. Use likely.initiate instead."),t.initiate.apply(t,arguments)}return s(t,null,[{keyLine truncated
+//# sourceMappingURL=likely.js.map

src/components/Article.js

@@ -8,7 +8,16 @@ const Head = ({url, children}) => (
 		: <a href={url}><h2>{children}</h2></a>
 )
 
-const Article = ({data, url, title, date}) => (
+const Share = () => (
+	<div className="likely">
+		<div className="vkontakte">Поделиться</div>
+		<div className="facebook">Поделиться</div>
+		<div className="telegram">Отправить</div>
+		<div className="twitter">Твитнуть</div>
+	</div>
+)
+
+const Article = ({data, url, title, date, shareable}) => (
 	<article className="article">
 		<header className="article__head">
 			<Head url={url}>{title}</Head>
@@ -18,6 +27,10 @@ const Article = ({data, url, title, date}) => (
 		<div className="article__body">
 			{getHtml(data)}
 		</div>
+
+		{!shareable ? null : (
+			<Share/>
+		)}
 	</article>
 )
 

src/components/ArticleList.js

@@ -15,6 +15,7 @@ const ArticleList = ({articles, nextPage, prevPage}) => (
 				title={article.title}
 				date={article.date}
 				data={article.post}
+				shareable={false}
 			/>
 		))}
 

src/routes/articles.js

@@ -127,6 +127,7 @@ function getArticle() {
 							title={article.title}
 							date={article.date}
 							data={article.post}
+							shareable={true}
 						/>
 					</div>
 				)

src/views/main.hbs

@@ -49,6 +49,10 @@
     <link rel="apple-touch-icon" sizes="114x114" href="//static.shlisselburg.org/art/graphics/favicon-114.png"/>
     <link rel="apple-touch-icon" sizes="144x144" href="//static.shlisselburg.org/art/graphics/favicon-144.png"/>
 
+    <!-- Likely -->
+    <script src="/likely.js"></script>
+    <link rel="stylesheet" href="/likely.css">
+
     <link rel="stylesheet" href="/style.css">
     <link rel="stylesheet" href="/fonts/PTSans/stylesheet.css">
     <link rel="stylesheet" href="/fonts/PTSerif/stylesheet.css">