vitalif-js
/
social-likes-nojq
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fix skin switcher.

master
Artem Sapegin 2013-12-25 12:00:46 +04:00
parent 5a4e30d8e6
commit 04c67754c0
5 changed files with 23 additions and 965 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

940
specs/social-likes_all.css
View File

@ -1,940 +0,0 @@
.skin_flat .social-likes,
.skin_flat .social-likes__widget {
display: inline-block;
vertical-align: middle;
text-indent: 0;
padding: 0;
border: 0;
word-spacing: 0 !important;
text-indent: 0 !important;
}
.skin_flat .social-likes {
list-style: none !important;
}
.skin_flat .social-likes__widget {
display: inline-block;
position: relative;
white-space: nowrap;
overflow: hidden;
}
.skin_flat .social-likes__widget:before,
.skin_flat .social-likes__widget:after {
display: none !important;
}
.skin_flat .social-likes_vertical .skin_flat .social-likes__widget {
display: block;
}
.skin_flat .social-likes__button,
.skin_flat .social-likes__icon,
.skin_flat .social-likes__counter {
text-decoration: none;
text-rendering: optimizeLegibility;
}
.skin_flat .social-likes__button,
.skin_flat .social-likes__counter {
display: inline-block;
margin: 0;
outline: 0;
}
.skin_flat .social-likes__button {
position: relative;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.skin_flat .social-likes__button:before {
content: "";
display: inline-block;
}
.skin_flat .social-likes__icon {
position: absolute;
top: 0;
left: 0;
}
.skin_flat .social-likes__counter {
position: relative;
font-weight: normal;
cursor: default;
}
.skin_flat .social-likes__close {
position: absolute;
right: 0;
top: 0;
cursor: pointer;
}
.skin_flat .social-likes__close:before {
display: none;
}
.skin_flat .social-likes_vertical .social-likes__widget {
display: block;
}
.skin_flat .social-likes_notext .social-likes__button {
padding-left: 0;
}
.skin_flat .social-likes_single-w {
position: relative;
display: inline-block;
}
.skin_flat .social-likes_single {
position: absolute;
text-align: left;
z-index: 99999;
visibility: hidden;
opacity: 0;
-webkit-transition: visibility 0s .3s,opacity .3s ease-out;
transition: visibility 0s .3s,opacity .3s ease-out;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.skin_flat .social-likes_single.social-likes_visible {
visibility: visible;
opacity: 1;
-webkit-transition: opacity .3s ease-out;
transition: opacity .3s ease-out;
}
.skin_flat .social-likes__button_single {
position: relative;
}
@font-face {
font-family: "social-likes";
src: url("data:application/x-font-woff;charset=utf-8;base64,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") format("woff"),url("social-likes.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
.skin_flat .social-likes__icon_facebook:before {
content: "\f100";
}
.skin_flat .social-likes__icon_github:before {
content: "\f101";
}
.skin_flat .social-likes__icon_mailru:before {
content: "\f102";
}
.skin_flat .social-likes__icon_odnoklassniki:before {
content: "\f103";
}
.skin_flat .social-likes__icon_pinterest:before {
content: "\f104";
}
.skin_flat .social-likes__icon_plusone:before {
content: "\f105";
}
.skin_flat .social-likes__icon_single:before {
content: "\f106";
}
.skin_flat .social-likes__icon_twitter:before {
content: "\f107";
}
.skin_flat .social-likes__icon_vkontakte:before {
content: "\f108";
}
.skin_flat .social-likes {
margin: -.5em;
line-height: 1.5;
}
.skin_flat .social-likes,
.skin_flat .social-likes__button_single {
font-size: 15px;
}
.skin_flat .social-likes__widget {
margin: .5em;
line-height: 1.5;
background: #fff;
}
.skin_flat .social-likes__button,
.skin_flat .social-likes__counter {
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: "Helvetica Neue",Arial,sans-serif;
vertical-align: middle;
}
.skin_flat .social-likes__button {
padding: .025em .7em .2em 1.65em;
font-weight: bold;
color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.skin_flat .social-likes__icon {
top: 0;
left: .21em;
font-family: "social-likes";
font-weight: normal;
font-style: normal;
speak: none;
text-transform: none;
font-size: 1.15em;
vertical-align: baseline;
}
.skin_flat .social-likes__counter {
padding: 0 .5em;
font-weight: normal;
color: #000;
}
.skin_flat .social-likes__counter_link {
cursor: pointer;
}
.skin_flat .social-likes__counter_link:hover {
text-decoration: underline;
}
.skin_flat .social-likes__close {
padding: .2em .4em;
font: 1.2em Verdana,Geneva,Tahoma,sans-serif;
color: #999;
}
.skin_flat .social-likes__close:hover {
color: #111;
}
.skin_flat .social-likes_vertical {
margin: -1em -.5em;
}
.skin_flat .social-likes_vertical .social-likes__widget {
margin: 1em .5em;
}
.skin_flat .social-likes_vertical .social-likes__button {
min-width: 11em;
}
.skin_flat .social-likes_vertical .social-likes__counter {
min-width: 3em;
text-align: right;
}
.skin_flat .social-likes_light .social-likes__button,
.skin_flat .social-likes_single-light + .social-likes__button {
min-width: 0;
background: none;
font-weight: normal;
text-decoration: underline;
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto;
}
.skin_flat .social-likes_light .social-likes__counter,
.skin_flat .social-likes_single-light + .social-likes__button + .social-likes__counter {
min-width: 0;
padding-left: 0;
text-align: left;
color: #999;
}
.skin_flat .social-likes_notext .social-likes__button {
width: 1.85em;
}
.skin_flat .social-likes_notext .social-likes__icon {
margin-left: .1em;
}
.skin_flat .social-likes_notext.skin_flat .social-likes_light,
.skin_flat .social-likes_notext.skin_flat .social-likes_light .social-likes__widget {
margin: 0;
}
.skin_flat .social-likes_single {
top: -.5em;
left: -.5em;
padding: .35em .5em .25em;
background: #fff;
border: 1px solid #ddd;
}
.skin_flat .social-likes_single .skin_flat .social-likes__widget:first-of-type {
margin-right: 1em;
}
.skin_flat .social-likes__button_single {
background: #87c44d;
}
.social-likes_single-light + .skin_flat .social-likes__button_single {
color: #87c44d;
}
.skin_flat .social-likes__counter_single {
font-size: .75em;
}
.skin_flat .social-likes__icon_single {
top: .25em;
}
.skin_flat .social-likes__button_facebook {
background: #3d5b95;
}
.social-likes_light .skin_flat .social-likes__button_facebook {
color: #3d5b95;
}
.skin_flat .social-likes__icon_facebook {
left: .38em;
}
.social-likes_notext .skin_flat .social-likes__icon_facebook {
margin-left: .15em;
}
.skin_flat .social-likes__button_twitter {
background: #24aadd;
}
.social-likes_light .skin_flat .social-likes__button_twitter {
color: #24aadd;
}
.skin_flat .social-likes__icon_twitter {
top: .1em;
}
.social-likes_light .skin_flat .social-likes__icon_twitter {
left: .1em;
}
.skin_flat .social-likes__button_plusone {
background: #d23e30;
}
.social-likes_light .skin_flat .social-likes__button_plusone {
color: #d23e30;
}
.social-likes_notext .skin_flat .social-likes__icon_plusone {
margin-left: 0;
}
.skin_flat .social-likes__icon_plusone {
left: .25em;
}
.skin_flat .social-likes__button_mailru {
background: #00468c;
}
.social-likes_light .skin_flat .social-likes__button_mailru {
color: #00468c;
}
.social-likes_light .skin_flat .social-likes__icon_mailru {
left: .1em;
}
.social-likes_notext .skin_flat .social-likes__icon_mailru {
margin-left: .075em;
}
.skin_flat .social-likes__button_vkontakte {
background: #587e9f;
}
.social-likes_light .skin_flat .social-likes__button_vkontakte {
color: #587e9f;
}
.skin_flat .social-likes__icon_vkontakte {
top: .2em;
left: .2em;
}
.skin_flat .social-likes__button_odnoklassniki {
background: #f59310;
}
.social-likes_light .skin_flat .social-likes__button_odnoklassniki {
color: #f59310;
}
.skin_flat .social-likes__icon_odnoklassniki {
left: .4em;
}
.social-likes_light .skin_flat .social-likes__icon_odnoklassniki {
left: .25em;
}
.skin_flat .social-likes__button_pinterest {
background: #cb132d;
}
.social-likes_light .skin_flat .social-likes__button_pinterest {
color: #cb132d;
}
.social-likes_light .skin_flat .social-likes__icon_pinterest {
left: .1em;
}
.skin_classic .social-likes,
.skin_classic .social-likes__widget {
display: inline-block;
vertical-align: middle;
text-indent: 0;
padding: 0;
border: 0;
word-spacing: 0 !important;
text-indent: 0 !important;
}
.skin_classic .social-likes {
list-style: none !important;
}
.skin_classic .social-likes__widget {
display: inline-block;
position: relative;
white-space: nowrap;
overflow: hidden;
}
.skin_classic .social-likes__widget:before,
.skin_classic .social-likes__widget:after {
display: none !important;
}
.skin_classic .social-likes_vertical .skin_classic .social-likes__widget {
display: block;
}
.skin_classic .social-likes__button,
.skin_classic .social-likes__icon,
.skin_classic .social-likes__counter {
text-decoration: none;
text-rendering: optimizeLegibility;
}
.skin_classic .social-likes__button,
.skin_classic .social-likes__counter {
display: inline-block;
margin: 0;
outline: 0;
}
.skin_classic .social-likes__button {
position: relative;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.skin_classic .social-likes__button:before {
content: "";
display: inline-block;
}
.skin_classic .social-likes__icon {
position: absolute;
top: 0;
left: 0;
}
.skin_classic .social-likes__counter {
position: relative;
font-weight: normal;
cursor: default;
}
.skin_classic .social-likes__close {
position: absolute;
right: 0;
top: 0;
cursor: pointer;
}
.skin_classic .social-likes__close:before {
display: none;
}
.skin_classic .social-likes_vertical .social-likes__widget {
display: block;
}
.skin_classic .social-likes_notext .social-likes__button {
padding-left: 0;
}
.skin_classic .social-likes_single-w {
position: relative;
display: inline-block;
}
.skin_classic .social-likes_single {
position: absolute;
text-align: left;
z-index: 99999;
visibility: hidden;
opacity: 0;
-webkit-transition: visibility 0s .3s,opacity .3s ease-out;
transition: visibility 0s .3s,opacity .3s ease-out;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.skin_classic .social-likes_single.social-likes_visible {
visibility: visible;
opacity: 1;
-webkit-transition: opacity .3s ease-out;
transition: opacity .3s ease-out;
}
.skin_classic .social-likes__button_single {
position: relative;
}
.skin_classic .social-likes,
.skin_classic .social-likes__widget {
line-height: 20px;
font-size: 14px;
}
.skin_classic .social-likes {
margin: -3px;
line-height: 26px;
}
.skin_classic .social-likes__widget {
margin: 3px;
}
.skin_classic .social-likes__button,
.skin_classic .social-likes__counter {
font-family: "Trebuchet MS","Helvetica Neue",Tahoma,sans-serif;
font-size: 14px;
}
.skin_classic .social-likes__button,
.skin_classic .social-likes__counter {
line-height: 18px;
border-width: 1px;
border-style: solid;
border-radius: 3px;
}
.skin_classic .social-likes__button {
padding: 1px 4px 1px 20px;
font-weight: bold;
text-shadow: 0 1px 0 rgba(255,255,255,0.6);
box-shadow: 0 1px 1px rgba(0,0,0,0.05);
-webkit-transition: border .1s ease-in-out,color .2s ease-in-out;
transition: border .1s ease-in-out,color .2s ease-in-out;
}
.skin_classic .social-likes__icon {
width: 20px;
height: 20px;
background-repeat: no-repeat;
}
.skin_classic .social-likes__counter {
margin-left: 7px;
padding: 1px 4px;
font-weight: normal;
color: #666;
color: rgba(0,0,0,0.5);
}
.skin_classic .social-likes__counter:before,
.skin_classic .social-likes__counter:after {
content: "";
position: absolute;
width: 0;
height: 0;
}
.skin_classic .social-likes__counter:before {
top: 4px;
left: -6px;
border: 6px inset transparent;
border-left: 0;
border-right: 6px solid;
border-right-color: inherit;
opacity: .7;
}
.skin_classic .social-likes__counter:after {
top: 5px;
left: -4px;
border: 5px inset transparent;
border-left: 0;
border-right: 5px solid;
}
.skin_classic .social-likes__close {
padding: 2px 4px;
font: 16px Verdana,Geneva,Tahoma,sans-serif;
color: #999;
}
.skin_classic .social-likes__close:hover {
color: #111;
}
.skin_classic .social-likes_vertical {
margin: -6px -4px;
}
.skin_classic .social-likes_vertical .social-likes__widget {
margin: 6px 4px;
}
.skin_classic .social-likes_notext .social-likes__widget {
margin: 3px 2px;
}
.skin_classic .social-likes_notext .social-likes__button {
width: 16px;
}
.skin_classic .social-likes_single {
top: -6px;
left: -6px;
padding: 6px 6px 4px;
background: #fff;
box-shadow: 0 0 15px rgba(0,0,0,0.3);
}
.skin_classic .social-likes_single .skin_classic .social-likes__widget:first-of-type {
margin-right: 14px;
}
.skin_classic .social-likes__button_single {
padding-left: 19px;
background: #e2e2e2;
background: -webkit-linear-gradient(top, #f7f7f7, #e2e2e2);
background: linear-gradient(top,#f7f7f7,#e2e2e2);
color: #444;
border-color: #ccc;
border-color: rgba(179,179,179,0.8);
border-bottom-color: rgba(153,153,153,0.8);
}
.skin_classic .social-likes__button_single:hover {
background: #f4f4f4;
background: -webkit-linear-gradient(top, #f0f0f0, #cfcfcf);
background: linear-gradient(top,#f0f0f0,#cfcfcf);
color: #222;
border-color: #bbb;
border-bottom-color: #9f9f9f;
}
.skin_classic .social-likes__icon_single {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAABxVBMVEVyqHIsfCwneyc3iDctfi0sfiwAAABupm5pomlxp3FwqXB0q3RSllI0hTRAjEBXmVdJkklig2JspGx1qHVdnF2LrYv///9wrXBQllBvrW////9cnVxmiGZtpG11p3WNrY1fnV95sHkufi4xgjElYyUwiTAreSseTh4ugS4eUh4kZSQvfi8seiwwiDAxgzH///9tqW1mpmYggiC827wlhSXr9Os5jznk8OS62rqp0qk5lzk6mDoUhRQ0lTRwsXBfpV81izVkqGRYoVhoqWhfpF9Vo1VaoVppqWlgpWAwiTAyjDI6jzpBlEFkqmRtrG1bpltysHJFlkVZpVkkiCQ4jjgniScVexWSxZIxjTExhjEpiikyiDI0izQxiTEvii+m0KaNvo2FuoV+tn7c7NxIl0hurW6kzqSn0Kd5tXl7t3s4lDiEvoQziDMxiDFUpFRHm0f7/Pvi8OI6lTo9mD3i8eKy17JwsnB+u35NoU1JnUnT5tP8/fyn0ac8mDyq0qpPo09eql5AmkBDnENFnkVhrGE5mDnP5s8+mz4qjyq017QhiiHB38FHnkdJoElaqFrU6dQtkS2z1rOezJ7V6dXC38KfzZ/O5s44zy9hAAAAL3RSTlPu6ebu5uYA7u7w7u3w7e7w73TH2fGAAu3v7QPtfcjbhPHtyu1u5s1u7XZxzM7m7ed67K8AAADZSURBVAjXYxATFeZkYOfgYGfglJOXYhAUN3D3S0pMCLB3NpCUYRAy9PA11gcCYztHQ1kGETf/ZH1zS0tz/XBXFwUGHh8L/dJma+v68rwgJ34GLlN908a+yf0tTRX5gQIM3Pr6dR1T9PW7WxvKUiUY+FIqe2wn6ut3dlno6ysyMIcU1U6wmjrJ1qq6IF6agdc7q7im18amvUo/LUyDQdkhKltff1qbvn56aIweg1K0V0Rmib5+YUZwXI42g7pqpKeRiZmZiVFsrq4mA5uKGiMLKxMTKwujjhYbAFshM23jReW7AAAAAElFTkSuQmCC");
background-position: 2px 3px;
}
.skin_classic .social-likes__counter_single {
background: #f6f6f6;
border-color: #ddd;
}
.skin_classic .social-likes__counter_single:after {
border-right-color: #f6f6f6;
}
.skin_classic a.social-likes__counter {
cursor: pointer;
text-decoration: none;
}
.skin_classic a.social-likes__counter:hover {
text-decoration: underline;
}
.skin_classic .social-likes__button_facebook {
padding-left: 19px;
background: #eceef5;
background: -webkit-linear-gradient(top, #fff, #d8def4);
background: linear-gradient(top,#fff,#d8def4);
color: #3b5998;
border-color: #cad4e7;
border-color: rgba(202,212,231,0.8);
border-bottom-color: rgba(189,194,203,0.8);
}
.skin_classic .social-likes__button_facebook:hover {
background: #c0cdf3;
background: -webkit-linear-gradient(top, #f2f3f7, #c0cdf3);
background: linear-gradient(top,#f2f3f7,#c0cdf3);
color: #253860;
border-color: #b4bfd4;
border-bottom-color: #b3b7bf;
}
.skin_classic .social-likes__icon_facebook {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOBAMAAADtZjDiAAAAFVBMVEU7WZj///9thLTr7vRheaxFYp5geKvYYUakAAAAL0lEQVQI12NwYAABFgZkkCwIoQ2hNJSC0YKCEIaxoDFWeTAdpKSkJKikCqeh9gAAtSUEXqOhTAgAAAAASUVORK5CYII=");
background-position: 3px 3px;
}
.skin_classic .social-likes__counter_facebook {
background: #f2f3f7;
border-color: #cad4e7;
}
.skin_classic .social-likes__counter_facebook:after {
border-right-color: #f2f3f7;
}
.skin_classic .social-likes__button_twitter {
padding-left: 19px;
background: #d5e6ef;
background: -webkit-linear-gradient(top, #fff, #d5e6ef);
background: linear-gradient(top,#fff,#d5e6ef);
color: #186487;
border-color: #a4cce5;
border-color: rgba(164,204,229,0.8);
border-bottom-color: rgba(158,186,204,0.8);
}
.skin_classic .social-likes__button_twitter:hover {
background: #bfdfed;
background: -webkit-linear-gradient(top, #f2f8fc, #bfdfed);
background: linear-gradient(top,#f2f8fc,#bfdfed);
color: #0b3752;
border-color: #9cbbcf;
border-bottom-color: #68a0c4;
}
.skin_classic .social-likes__icon_twitter {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAALCAMAAAB4W0xQAAAA3lBMVEUAAAD///8lseQltOvl9fr///////////8Af68Af5+Ay+gAf7QZmMglrd9Pwe0Ag7UBiL0ChLgMqOW03u8FgbAVnc96x+QlncoAfK8AgbP///8MrOrV7/hoxukAfa2N1fEjsOZBvOua1u4Afa+44/P///+HzOZsyetsy+4AgLBsxOgAiLy/5PEAfKwCg7YRiLQKmM+LyuIAhbkArO4Aq+0Aq+wAlc4AqOgAp+cAntoAjMIAqekAod4Am9cAmNIAo+EApuYApeUApOMApeQAjsQAod8AkckAqusAnNgAouBS5YTcAAAAM3RSTlMASPPzoXckDBAQwTCf8+ef8NH7pLPRueBgnzz7x9lw1/Hry4CuMIjf35/f78Fg4Wf5ar/hKdysAAAAhElEQVQIHR3BhQKCMBQF0KsCG3a3Yne/bYTd+v8/5PAcwEaIt/tL2DZQrELLPV7BbrUGKkGNI6HO9+dnswXKvspmkgdBwutZQOl68U9Hj4hudQCFvJCuK4lECprVatDfPo7QqCNJE9EIQsNBVxKJmAGNT+fq+yaZNhg0Zi5m44nTNBm0H8LlEYm9SraOAAAAAElFTkSuQmCC");
background-position: 3px 5px;
}
.skin_classic .social-likes__counter_twitter {
background: #f2f8fc;
border-color: #a4cce5;
}
.skin_classic .social-likes__counter_twitter:after {
border-right-color: #f2f8fc;
}
.skin_classic .social-likes__button_plusone {
padding-left: 12px;
background: #e4e4e4;
background: -webkit-linear-gradient(top, #f5f5f5, #e4e4e4);
background: linear-gradient(top,#f5f5f5,#e4e4e4);
color: #da573b;
border-color: #bbb;
border-color: rgba(204,204,204,0.8);
border-bottom-color: rgba(179,179,179,0.8);
}
.skin_classic .social-likes__button_plusone:hover {
background: #f4f4f4;
background: -webkit-linear-gradient(top, #f9f9f9, #f0f0f0);
background: linear-gradient(top,#f9f9f9,#f0f0f0);
color: #cd4427;
border-color: #ddd;
border-bottom-color: #ccc;
}
.skin_classic .social-likes__icon_plusone {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAPCAMAAADqIa48AAAA1VBMVEUAAAD29vbeaU/w6uj6+vrs5uXijXvv7+/aVzvaVzr77eru6urutKfdZUvggm7aWT3linf8/PzfeGLp5eTnoJHmqp3hiHXhd2DxysLx6ef02NL39PTcalHcYUbcYUXaWTz219HccVnl1tP33dfkraHfbVPo4+LnlILt6encaE/cYkfkzsr57OrbWz/gfGbsq53fiXbmu7LgkH7q4d/48fDcdFzssqXqp5jl2dbcZ03j09DecVjebVXdclv4+PjdemTw8PD44dzik4LcmozjgWvgdFzxxLrCp/DQAAAACHRSTlMA////////+EuuwZEAAAB3SURBVAgdLcEFFoIAEEDBDwLu2t3d3d19/yOJD2dIpjMJcTk+SikrHpJwwIJKEYhJBGjjykk0COMekBexQeeALVlAj0tolQvAS/eL2aCJ63L/nHSK5/bWSQfPRrXeAJ7XtdOtan8Ij5VlGDVTz+DnZ2Tqgb+t7r4MkwpuQ8fKEQAAAABJRU5ErkJggg==");
background-position: 0 6px;
}
.skin_classic .social-likes__counter_plusone {
background: #f9f9f9;
border-color: #d2d2d2;
}
.skin_classic .social-likes__counter_plusone:after {
border-right-color: #f9f9f9;
}
.skin_classic .social-likes__button_mailru {
padding-left: 18px;
background: #004584;
background: -webkit-linear-gradient(top, #5d90ba, #004584);
background: linear-gradient(top,#5d90ba,#004584);
color: #fff;
color: rgba(255,255,255,0.95);
border-color: #1e65a5;
border-color: rgba(11,84,153,0.8);
border-bottom-color: rgba(3,27,48,0.8);
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.skin_classic .social-likes__button_mailru:hover {
background: #001e5d;
background: -webkit-linear-gradient(top, #618cae, #001e5d);
background: linear-gradient(top,#618cae,#001e5d);
color: #fff;
color: rgba(255,255,255,0.99);
border-color: #094984;
border-bottom-color: #031b30;
}
.skin_classic .social-likes__icon_mailru {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAABhlBMVEUAAAD0xQD/xgBcSwAAAAD8ywC1kQD7yQC5lAD/1AAAAABsVwD/zAD6yAD5yAD/xgAAAAAAAAAAAAAQDgAoIAAAAABFLgC/mQD/yADcsQAAAAAsIwAAAAAAAAD4xwAAAAA7MAD6yQBbSQDZrQDcsgDywQDxwAClggD/yADnuAAAAAD8zAD7ygDargD8zAAzKQATEAD8ywBHOQBAMgAtJAD7ygD6yQCMcACLbwAPDACigQCphwBiUAC3kgDZrgAAAADIogAAAAAAAAD/zABmTwAAAAAGBgBZSADrvACBaAAAAADTqgD8ygDcsgD5yQD8ywD8ywDywQDqvQDRqQDpvADktwCyjgAAAAA8MADouQCzkADuvgDuwADEnQD2xQD9ywD7yQAAAADougDbsgBYRAC/mQCgfwDZrgDnvgDGoACYegChgAA+MADIogAAAADsvgDtvgDzwgB4XgCqiAD6yADHnwDNpQBpUwClhADmuQB8YwDzwwCHawCffQD0wwDktwDAnAD9ywDU1CnPAAAAgXRSTlMA+AmjBdjG/WcMZKke7PkSCGkCiV4DC8kq4wtWEA7pUXPgltnm9fJKIUxTeNnYaZVPz5JHdvewt25mwcVifdtuxCZhLS2HcaLfqYGT4W72wO2m4tyl0r9HmLSY8m/UmpniCrZdNNFWqDdnkF8lXiDtve1GZ/5uWJi8SaT2a0Oro2IKDPtyAAAAy0lEQVQIHQXBA0NDYQCG0Wf87h2zrWXXss1l215tme8/7xwAgAAAAOBsbJHkqbMBoLpeDT3R3gEdjgKES6tc3V39fT7/QzAA7JuyiEfSQfz18wecob2xYHnTuOtRf28mzKWud01JAfcfsr70zp1uLnYKgSdZ33rmXFfbxgZOZL0owa1jq62y0yanSNZv8hS3VzWty4op23EcOjuC5oqO+YnJ6c1ir8nNADLbVzS3Oru0mJ+emgKQN+JfX1uYGspyAwAMb/hmBmvTAP4BUaQsfohkhJwAAAAASUVORK5CYII=");
background-position: 1px 2px;
}
.skin_classic .social-likes__counter_mailru {
background: #fff1c2;
border-color: #ffc70d;
}
.skin_classic .social-likes__counter_mailru:after {
border-right-color: #fff1c2;
}
.skin_classic .social-likes_notext .social-likes__icon_mailru {
background-position: 2px 2px;
}
.skin_classic .social-likes__button_vkontakte {
background: #436f96;
background: -webkit-linear-gradient(top, #8faecf, #436f96);
background: linear-gradient(top,#8faecf,#436f96);
color: #fff;
color: rgba(255,255,255,0.95);
border-color: #4d84c1;
border-color: rgba(78,131,193,0.8);
border-bottom-color: rgba(52,88,127,0.8);
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.skin_classic .social-likes__button_vkontakte:hover {
background: #4e80ab;
background: -webkit-linear-gradient(top, #a2c0df, #4e80ab);
background: linear-gradient(top,#a2c0df,#4e80ab);
color: #fff;
color: rgba(255,255,255,0.99);
border-color: #5788be;
border-bottom-color: #3b6798;
}
.skin_classic .social-likes__icon_vkontakte {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAQCAMAAADH72RtAAABI1BMVEUeRmv6+/weRGn09vicrb0cRGsAAADu8fS9x9IgQWrg5usgRGsfQ2ocQmcqVX8cOHEiRG4AP38dQW0iRWghQ2scRWgfRGsdRmv29/keR2vW3eUkSG0fRmn6+vsbRG5wiJ8hRmySpLcAf39eeZSruMfe4+pNaokAAAAXRXOYqrodR2yRpLedrr4fP2qQo7UfRWqer7/n6u78/f3o7PAzM2aNoLTEz9l4jqbz9fbN1d21wc8/X4AkTHFyiaJ0jKMcRnGywM0fRWseRGsxV3kgRWqDma4eRGogRWodRGofRWxRbouHmq4eQ2zt8PPW3eUfQ2tEY4W2ws5cd5J5j6eltcRogJxNbIqUprhwhaCvvMtMa4qEma3Gz9k6Wn9aeJIfRGr////flzUiAAAAYHRSTlNM/Uv4uy0A89Uf60dIGwYJHgQjFiYsYUX5MuUVQfslfTakAmnA6FkBC6w9o7oYnzC57v7vBZnagfff0X1ho60SzIB0Q2e0ZT5WSTV1RPLQQFq+Qn6qXYGbVJ45aswwV0ob93UPAAAAtUlEQVQY02NgE5SWFGdiAANuBV4+NgZ1XnkpiQQIYFTVExFk4FdjTkAAI3N7BmHtBGTgIMQgYACk2R09xNxsDYEsDlEGThaQCLdXpLe7HUiEFSriGZHg5+OKLMIdGxwQ54sswhMVEu4fxowkEh+akBDNY4msJigm0NnGGCKiAxJxYhJzsTaD2K6rCXI+FxeXBdiFViIMGsqMyG42FWZQElJEeExWRd+EgY1PQAsaGAwMMnL8bAARvTwsqGgkuAAAAABJRU5ErkJggg==");
background-position: 1px 2px;
}
.skin_classic .social-likes__counter_vkontakte {
background: #eaeef3;
border-color: #afc1d4;
}
.skin_classic .social-likes__counter_vkontakte:after {
border-right-color: #eaeef3;
}
.skin_classic .social-likes__button_odnoklassniki {
padding-left: 17px;
background: #f6900b;
background: -webkit-linear-gradient(top, #f6bb6d, #f6900b);
background: linear-gradient(top,#f6bb6d,#f6900b);
color: #fff;
color: rgba(255,255,255,0.95);
border-color: #d99c27;
border-color: rgba(217,154,38,0.8);
border-bottom-color: rgba(197,137,7,0.8);
text-shadow: 0 -1px 0 rgba(0,0,0,0.12);
}
.skin_classic .social-likes__button_odnoklassniki:hover {
background: #f69a21;
background: -webkit-linear-gradient(top, #fbcc5a, #f69a21);
background: linear-gradient(top,#fbcc5a,#f69a21);
color: #fff;
color: rgba(255,255,255,0.99);
border-color: #f0b22c;
border-bottom-color: #c59121;
}
.skin_classic .social-likes__icon_odnoklassniki {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAPCAMAAAABFhU/AAAAt1BMVEUAAAD9/f37+/sAAAAAAABYWFgAAAD19fUAAAD///8AAAD////z8/P9/f3///////9ycnK/v7/////9/f37+/v19fV3d3fa2tr////////BwcHh4eGlpaXHx8f///+srKz////5+fn4+Pj///94eHj5+fltbW35+fns7Oz19fX9/f3////q6ur9/f3S0tL////8/Pynp6fl5eX////9/f2bm5v9/f3s7Oz////////s7OwAAAD///+3C/ewAAAAPHRSTlMA5e0eBCsj0QIDHQ/J6F0SKGhR9/DUQA4h/GsRJXMnKPZWU/MzrDGvr5+j0q2gf8nyUjzw8Urusqt1RBmYPbn7AAAAd0lEQVQIHQXBBQKCQABFwYcgu4DSdnd367//uZwBgvyTBwDJSdIuAQ4qX6W2wF2X30MFcNaVrwpgr9v7qTWQGkkmhWC6zI7ZfBIQa7baLMaK6dckSWaEF3YlDVwP2o46qg8hctRoGtUjWhVT9aq1Sg/ruxYb+vYPq3IOiMcZvH4AAAAASUVORK5CYII=");
background-position: 4px 3px;
}
.skin_classic .social-likes__counter_odnoklassniki {
background: #ffe9be;
border-color: #d9ab53;
}
.skin_classic .social-likes__counter_odnoklassniki:after {
border-right-color: #ffe9be;
}
.skin_classic .social-likes_notext .social-likes__icon_odnoklassniki {
background-position: 5px 3px;
}
.skin_classic .social-likes__button_pinterest {
padding-left: 20px;
background: #eee;
background: -webkit-linear-gradient(top, #fefefe, #d3d3d3);
background: linear-gradient(top,#fefefe,#d3d3d3);
color: #c71a28;
border-color: #bbb;
border-color: rgba(186,186,186,0.8);
border-bottom-color: rgba(153,153,153,0.8);
}
.skin_classic .social-likes__button_pinterest:hover {
background: #efefef;
background: -webkit-linear-gradient(top, #fff, #d9d9d9);
background: linear-gradient(top,#fff,#d9d9d9);
color: #c11524;
border-color: rgba(186,186,186,0.6);
border-bottom-color: rgba(153,153,153,0.6);
}
.skin_classic .social-likes__icon_pinterest {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAARCAMAAADjcdz2AAABYlBMVEUAAADBByTBAB62ACTBByS5ABe/ABXBBiPBBiTBByO/AB/ABiS/AAC0AB7BBiPBBiO+BCDBByTBBSMAAADBBiPBBCPBBiTBBiTBByTBBiPABiO+ByK8BSG/BCLBByO/AyPABiLBBSPBByTAByPABSPABiPABCPBBiO/AyPBBSPAByTBBiLBBiTBBiLABiSqAADBBiTBByPCACTABiTBByTBBSPBBiO9BSDABSTBBiTBBiTBByTABiPBBSPBAyPABiTBBiPBByTABSTBByS/BCS7ABrBBiPBBiTAByO5ACLBByPBBySyABnBBiPABiLABSJ/AADBBiPAByTBBiPBBiTBByTBBSPBBiS/BSLBByTCByO/Bh/ABiTDByTCByTABiS/BiTBBiOZAAC/BCLBByTBBSTABiTBBSS6AB3AByTBBiTBByTBByS4ABy/AB/AByTBBiTBBSPCByXCCCXCByTDCCV4snBOAAAAcnRSTlMA7BkH6wsM6rylEOYEEZbPN42zAew6/ZnGo5dDLjSjQCXXooJeeznLSKtF2/RLTQbs1RXerdlPL1qhqrGcMkdveemwkWkTp/qPFoGqCtOUsALR5sTr2bL8LOSyKM2qxclUnQU81tiTWxrN29T7Egji39pl2aR6AAAA3ElEQVQYGQXBA4IDUAxAwdet7XZt27Zt22aSf/+dAQAAAACAqdVk8HBvOwUAeNMrYiZqhYQfwDthameh88sT50IBIG36+3IPnB6LTMJIwZ5ev4p/R1cXLIvmWXCfD/F3+xHZX1uakzG25JpnyX8fOFlkXIfIyR0fb5ARnaVoHnKywc1jNhJUHWVQe+lz0c3b4O60SmdJbEA6SIjNr+8wLNJEo0qYKlWTGWLd7VRGRWug3Kmm+jOtzQ0e1TDgD2mwp0tMTVxpBCBQn8y2iYnTsjgAUFvS4vPVVVcA/AMRETlXnYR1ZQAAAABJRU5ErkJggg==");
background-position: 2px 1px;
}
.skin_classic .social-likes__counter_pinterest {
background: #fff5f6;
border-color: #f0a8ae;
}
.skin_classic .social-likes__counter_pinterest:after {
border-right-color: #fff5f6;
}

35
specs/specs.html
View File

@ -3,7 +3,27 @@
<head>
<meta charset="utf-8">
<title>Social Likes</title>
<link href="social-likes_all.css" rel="stylesheet">
<link id="styles_flat" href="../social-likes.css" rel="stylesheet">
<link id="styles_classic" href="../social-likes_classic.css" rel="stylesheet" disabled>
<script>
(function() {
function updateSkin() {
function el(id) { return document.getElementById(id); }
el('styles_flat').disabled = true;
el('styles_classic').disabled = true;
el('styles_' + location.hash.slice(1)).disabled = false;
}
if (location.hash) {
updateSkin();
}
else {
location.hash = '#flat';
}
window.onhashchange = updateSkin;
})();
</script>
<!--script src="http://yandex.st/jquery/1.10.2/jquery.min.js"></script-->
<script src="http://yandex.st/jquery/2.0.3/jquery.min.js"></script>
<script src="../src/social-likes.js"></script>
@ -39,18 +59,7 @@ body {
</head>
<body class="skin_classic">
<div class="skin-switcher">Skin: <a id="classic" href="#classic">Classic</a>, <a id="flat" href="#flat">Flat</a>.</div>
<script>
(function() {
function updateSkin() {
document.body.className = document.body.className.replace(/skin_\w+/, 'skin_' + location.hash.slice(1));
}
if (location.hash) {
updateSkin();
}
window.onhashchange = updateSkin;
})();
</script>
<div class="skin-switcher">Skin: <a id="flat" href="#flat">Flat</a>, <a id="classic" href="#classic">Classic</a>.</div>
<h3>Standard</h3>
<div class="social-likes" data-url="http://mail.ru/">

3
src/Gruntfile.js
View File

@ -38,8 +38,7 @@ module.exports = function(grunt) {
compile: {
files: {
'../social-likes.css': 'styles/flat/index.styl',
'../social-likes_classic.css': 'styles/classic/index.styl',
'../specs/social-likes_all.css': 'styles/all.styl'
'../social-likes_classic.css': 'styles/classic/index.styl'
}
},
contrib: {

9
src/styles/all.styl
View File

@ -1,9 +0,0 @@
// Social Likes by Artem Sapegin. http://sapegin.github.io/social-likes/
.skin_flat {
@import "flat";
}
.skin_classic {
@import "classic";
}

1
src/update-gh-pages.sh
View File

@ -3,7 +3,6 @@
echo "Updating Social Likes on gh-pages…"
grunt build
cp ../specs/social-likes_all.css ../../social-likes_gh-pages/src/
cp ../social-likes.css ../../social-likes_gh-pages/src/
cp ../social-likes_classic.css ../../social-likes_gh-pages/src/
cp ../social-likes.min.js ../../social-likes_gh-pages/src/