Typos.
Artem Sapegin
parent
f06b59c1c7
commit
683b99e105
|
|
@ -25,7 +25,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h3>Vertical (no counters)</h3>
|
<h3>Vertical (no counters)</h3>
|
||||||
<ul class="social-likes social-likes_vertical" data-url="http://mail.ru/" data-counters="no">
|
<ul class="social-likes social-likes_vertical" data-url="http://mail.ru/" data-counters="no">
|
||||||
<li class="facebook" title="Опубликовать ссылку на Фейсбуке">Facebook</li>
|
<li class="facebook" title="Опубликовать ссылку на Фейсбуке">Facebook</li>
|
||||||
<li class="twitter" data-via="sapegin" data-related="DessiTeckel:Моя такса" title="Опубликовать ссылку в Твиттере">Twitter</li>
|
<li class="twitter" data-via="sapegin" data-related="DessiTeckel:Моя такса" title="Опубликовать ссылку в Твиттере">Twitter</li>
|
||||||
<li class="mailru" title="Опубликовать ссылку в Моём мире">Мой мир</li>
|
<li class="mailru" title="Опубликовать ссылку в Моём мире">Мой мир</li>
|
||||||
|
|
|
||||||
|
|
@ -1,459 +1,462 @@
|
||||||
/* Social Likes by Artem Sapegin. http://sapegin.github.com/social-likes */
|
/* Social Likes by Artem Sapegin. http://sapegin.github.com/social-likes */
|
||||||
|
|
||||||
.social-likes,
|
.social-likes,
|
||||||
.social-likes__widget {
|
.social-likes__widget {
|
||||||
display:inline-block;
|
display:inline-block;
|
||||||
vertical-align:middle;
|
vertical-align:middle;
|
||||||
line-height:20px;
|
line-height:20px;
|
||||||
margin:2px 0;
|
margin:2px 0;
|
||||||
padding:0;
|
padding:0;
|
||||||
word-spacing:0;
|
word-spacing:0;
|
||||||
font-size:14px;
|
font-size:14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-likes {
|
.social-likes {
|
||||||
margin-right:-8px;
|
margin-right:-8px;
|
||||||
line-height:26px;
|
line-height:26px;
|
||||||
list-style:none;
|
list-style:none;
|
||||||
*zoom:1;
|
*zoom:1;
|
||||||
|
|
||||||
&__widget {
|
&__widget {
|
||||||
position:relative;
|
position:relative;
|
||||||
*zoom:1;
|
*zoom:1;
|
||||||
*display:inline;
|
*display:inline;
|
||||||
margin-right:8px;
|
margin-right:8px;
|
||||||
white-space:nowrap;
|
white-space:nowrap;
|
||||||
}
|
}
|
||||||
&__widget:before {
|
&__widget:before {
|
||||||
display:none; // Remove nice bullets
|
display:none; // Remove nice bullets
|
||||||
}
|
}
|
||||||
|
|
||||||
&__button,
|
&__button,
|
||||||
&__counter,
|
&__counter,
|
||||||
&__balloon,
|
&__balloon,
|
||||||
&__balloon__code {
|
&__balloon__code {
|
||||||
font-family:"Trebuchet MS", "Helvetica Neue", Tahoma, sans-serif;
|
font-family:"Trebuchet MS", "Helvetica Neue", Tahoma, sans-serif;
|
||||||
font-size:14px;
|
font-size:14px;
|
||||||
text-rendering:optimizeLegibility;
|
text-rendering:optimizeLegibility;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__button,
|
&__button,
|
||||||
&__counter {
|
&__counter {
|
||||||
display:inline-block;
|
display:inline-block;
|
||||||
*display:inline;
|
*display:inline;
|
||||||
*float:left;
|
*float:left;
|
||||||
margin:0;
|
margin:0;
|
||||||
line-height:18px;
|
line-height:18px;
|
||||||
border-width:1px;
|
border-width:1px;
|
||||||
border-style:solid;
|
border-style:solid;
|
||||||
border-radius:3px;
|
border-radius:3px;
|
||||||
outline:0;
|
outline:0;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__button {
|
&__button {
|
||||||
position:relative;
|
position:relative;
|
||||||
padding:1px 4px 1px 20px;
|
padding:1px 4px 1px 20px;
|
||||||
font-weight:bold;
|
font-weight:bold;
|
||||||
text-shadow:0 1px 0 hsla(0,0%,100%,.6);
|
text-shadow:0 1px 0 hsla(0,0%,100%,.6);
|
||||||
box-shadow:0 1px 1px hsla(0,0%,0%,.05);
|
box-shadow:0 1px 1px hsla(0,0%,0%,.05);
|
||||||
// Gradient transition don’t work yet in any browser. This is for future :)
|
// Gradient transition don’t work yet in any browser. This is for future :)
|
||||||
transition:border .1s ease-in-out, color .2s ease-in-out, background .2s ease-in-out;
|
transition:border .1s ease-in-out, color .2s ease-in-out, background .2s ease-in-out;
|
||||||
cursor:pointer;
|
cursor:pointer;
|
||||||
user-select:none;
|
user-select:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__icon {
|
&__icon {
|
||||||
position:absolute;
|
position:absolute;
|
||||||
top:0;
|
top:0;
|
||||||
left:0;
|
left:0;
|
||||||
width:20px;
|
width:20px;
|
||||||
height:20px;
|
height:20px;
|
||||||
background-repeat:no-repeat;
|
background-repeat:no-repeat;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__counter {
|
&__counter {
|
||||||
position:relative;
|
position:relative;
|
||||||
margin-left:7px;
|
margin-left:7px;
|
||||||
padding:1px 4px;
|
padding:1px 4px;
|
||||||
font-weight:normal;
|
font-weight:normal;
|
||||||
color:#666;
|
color:#666;
|
||||||
color:hsla(0,0%,0%,.5);
|
color:hsla(0,0%,0%,.5);
|
||||||
cursor:default;
|
cursor:default;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__counter:before,
|
&__counter:before,
|
||||||
&__counter:after {
|
&__counter:after {
|
||||||
content:"";
|
content:"";
|
||||||
position:absolute;
|
position:absolute;
|
||||||
width:0;
|
width:0;
|
||||||
height:0;
|
height:0;
|
||||||
}
|
}
|
||||||
&__counter:before {
|
&__counter:before {
|
||||||
top:4px;
|
top:4px;
|
||||||
left:-6px;
|
left:-6px;
|
||||||
border:6px inset transparent; // inset fixes strange artefacts in Firefox
|
border:6px inset transparent; // inset fixes strange artefacts in Firefox
|
||||||
border-left:0;
|
border-left:0;
|
||||||
border-right:6px solid;
|
border-right:6px solid;
|
||||||
border-right-color:inherit;
|
border-right-color:inherit;
|
||||||
opacity:.7;
|
opacity:.7;
|
||||||
}
|
}
|
||||||
&__counter:after {
|
&__counter:after {
|
||||||
top:5px;
|
top:5px;
|
||||||
left:-4px;
|
left:-4px;
|
||||||
border:5px inset transparent; // inset fixes strange artefacts in Firefox
|
border:5px inset transparent; // inset fixes strange artefacts in Firefox
|
||||||
border-left:0;
|
border-left:0;
|
||||||
border-right:5px solid;
|
border-right:5px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__close {
|
&__close {
|
||||||
position:absolute;
|
position:absolute;
|
||||||
right:0;
|
right:0;
|
||||||
top:0;
|
top:0;
|
||||||
padding:2px 4px;
|
padding:2px 4px;
|
||||||
font:16px Verdana, Geneva, Tahoma, sans-serif;
|
font:16px Verdana, Geneva, Tahoma, sans-serif;
|
||||||
color:#999;
|
color:#999;
|
||||||
cursor:pointer;
|
cursor:pointer;
|
||||||
}
|
}
|
||||||
&__close:hover {
|
&__close:hover {
|
||||||
color:#111;
|
color:#111;
|
||||||
}
|
}
|
||||||
&__close:before {
|
&__close:before {
|
||||||
display:none; // Remove nice bullets
|
display:none; // Remove nice bullets
|
||||||
}
|
}
|
||||||
|
|
||||||
// Vertical mode
|
// Vertical mode
|
||||||
&_vertical {
|
&_vertical {
|
||||||
margin-right:0;
|
margin-right:0;
|
||||||
|
|
||||||
.social-likes__widget {
|
.social-likes__widget {
|
||||||
display:block;
|
display:block;
|
||||||
margin-bottom:8px;
|
margin-bottom:8px;
|
||||||
margin-right:0;
|
margin-right:0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Single button nmode
|
// Single button mode
|
||||||
&_single-w {
|
&_single-w {
|
||||||
position:relative;
|
position:relative;
|
||||||
}
|
display:inline-block;
|
||||||
&_single {
|
}
|
||||||
position:absolute;
|
&_single {
|
||||||
top:-19px;
|
position:absolute;
|
||||||
left:-15px;
|
display:none;
|
||||||
padding:15px 15px 9px 15px;
|
top:-19px;
|
||||||
background:#fff;
|
left:-15px;
|
||||||
box-shadow:0 0 15px hsla(0,0%,0%,.3);
|
padding:15px 15px 9px 15px;
|
||||||
z-index:99999;
|
background:#fff;
|
||||||
}
|
text-align:left;
|
||||||
}
|
box-shadow:0 0 15px hsla(0,0%,0%,.3);
|
||||||
|
z-index:99999;
|
||||||
|
}
|
||||||
// Single button
|
}
|
||||||
.social-likes__button_single {
|
|
||||||
position:relative;
|
|
||||||
padding-left:19px;
|
// Single button
|
||||||
background:#e2e2e2;
|
.social-likes__button_single {
|
||||||
background:linear-gradient(top, #f7f7f7, #e2e2e2);
|
position:relative;
|
||||||
color:#444;
|
padding-left:19px;
|
||||||
border-color:#ccc;
|
background:#e2e2e2;
|
||||||
border-color:hsla(0,0%,70%,.8);
|
background:linear-gradient(top, #f7f7f7, #e2e2e2);
|
||||||
border-bottom-color:hsla(0,0%,60%,.8);
|
color:#444;
|
||||||
}
|
border-color:#ccc;
|
||||||
.social-likes__button_single:hover {
|
border-color:hsla(0,0%,70%,.8);
|
||||||
background:#f4f4f4;
|
border-bottom-color:hsla(0,0%,60%,.8);
|
||||||
background:linear-gradient(top, #f0f0f0, #cfcfcf);
|
}
|
||||||
color:#222;
|
.social-likes__button_single:hover {
|
||||||
border-color:#bbb;
|
background:#f4f4f4;
|
||||||
border-bottom-color:#9f9f9f;
|
background:linear-gradient(top, #f0f0f0, #cfcfcf);
|
||||||
}
|
color:#222;
|
||||||
.social-likes__icon_single {
|
border-color:#bbb;
|
||||||
background-image:embedurl('../icons/single.png');
|
border-bottom-color:#9f9f9f;
|
||||||
background-position:2px 3px;
|
}
|
||||||
}
|
.social-likes__icon_single {
|
||||||
.social-likes__counter_single {
|
background-image:embedurl('../icons/single.png');
|
||||||
background:#f6f6f6;
|
background-position:2px 3px;
|
||||||
border-color:#ddd;
|
}
|
||||||
}
|
.social-likes__counter_single {
|
||||||
.social-likes__counter_single:after {
|
background:#f6f6f6;
|
||||||
border-right-color:#f6f6f6;
|
border-color:#ddd;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_single:after {
|
||||||
|
border-right-color:#f6f6f6;
|
||||||
// Facebook
|
}
|
||||||
.social-likes__button_facebook {
|
|
||||||
padding-left:19px;
|
|
||||||
background:#eceef5;
|
// Facebook
|
||||||
background:linear-gradient(top, #fff, #d8def4);
|
.social-likes__button_facebook {
|
||||||
color:#3b5998;
|
padding-left:19px;
|
||||||
border-color:#cad4e7;
|
background:#eceef5;
|
||||||
border-color:hsla(219,38%,85%,.8);
|
background:linear-gradient(top, #fff, #d8def4);
|
||||||
border-bottom-color:hsla(219,12%,77%,.8);
|
color:#3b5998;
|
||||||
}
|
border-color:#cad4e7;
|
||||||
.social-likes__button_facebook:hover {
|
border-color:hsla(219,38%,85%,.8);
|
||||||
background:#c0cdf3;
|
border-bottom-color:hsla(219,12%,77%,.8);
|
||||||
background:linear-gradient(top, #f2f3f7, #c0cdf3);
|
}
|
||||||
color:#253860;
|
.social-likes__button_facebook:hover {
|
||||||
border-color:#b4bfd4;
|
background:#c0cdf3;
|
||||||
border-bottom-color:#b3b7bf;
|
background:linear-gradient(top, #f2f3f7, #c0cdf3);
|
||||||
}
|
color:#253860;
|
||||||
.social-likes__icon_facebook {
|
border-color:#b4bfd4;
|
||||||
background-image:embedurl('../icons/facebook.png');
|
border-bottom-color:#b3b7bf;
|
||||||
background-position:3px 3px;
|
}
|
||||||
}
|
.social-likes__icon_facebook {
|
||||||
.social-likes__counter_facebook {
|
background-image:embedurl('../icons/facebook.png');
|
||||||
background:#f2f3f7;
|
background-position:3px 3px;
|
||||||
border-color:#cad4e7;
|
}
|
||||||
}
|
.social-likes__counter_facebook {
|
||||||
.social-likes__counter_facebook:after {
|
background:#f2f3f7;
|
||||||
border-right-color:#f2f3f7;
|
border-color:#cad4e7;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_facebook:after {
|
||||||
|
border-right-color:#f2f3f7;
|
||||||
// Twitter
|
}
|
||||||
.social-likes__button_twitter {
|
|
||||||
padding-left:19px;
|
|
||||||
background:#d5e6ef;
|
// Twitter
|
||||||
background:linear-gradient(top, #fff, #d5e6ef);
|
.social-likes__button_twitter {
|
||||||
color:#186487;
|
padding-left:19px;
|
||||||
border-color:#a4cce5;
|
background:#d5e6ef;
|
||||||
border-color:hsla(203,56%,77%,.8);
|
background:linear-gradient(top, #fff, #d5e6ef);
|
||||||
border-bottom-color:hsla(203,31%,71%,.8);
|
color:#186487;
|
||||||
}
|
border-color:#a4cce5;
|
||||||
.social-likes__button_twitter:hover {
|
border-color:hsla(203,56%,77%,.8);
|
||||||
background:#bfdfed;
|
border-bottom-color:hsla(203,31%,71%,.8);
|
||||||
background:linear-gradient(top, #f2f8fc, #bfdfed);
|
}
|
||||||
color:#0b3752;
|
.social-likes__button_twitter:hover {
|
||||||
border-color:#9cbbcf;
|
background:#bfdfed;
|
||||||
border-bottom-color:#68a0c4;
|
background:linear-gradient(top, #f2f8fc, #bfdfed);
|
||||||
}
|
color:#0b3752;
|
||||||
.social-likes__icon_twitter {
|
border-color:#9cbbcf;
|
||||||
background-image:embedurl('../icons/twitter.png');
|
border-bottom-color:#68a0c4;
|
||||||
background-position:2px 4px;
|
}
|
||||||
}
|
.social-likes__icon_twitter {
|
||||||
.social-likes__counter_twitter {
|
background-image:embedurl('../icons/twitter.png');
|
||||||
background:#f2f8fc;
|
background-position:2px 4px;
|
||||||
border-color:#a4cce5;
|
}
|
||||||
}
|
.social-likes__counter_twitter {
|
||||||
.social-likes__counter_twitter:after {
|
background:#f2f8fc;
|
||||||
border-right-color:#f2f8fc;
|
border-color:#a4cce5;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_twitter:after {
|
||||||
|
border-right-color:#f2f8fc;
|
||||||
// Google+
|
}
|
||||||
.social-likes__button_plusone {
|
|
||||||
padding-left:12px;
|
|
||||||
background:#e4e4e4;
|
// Google+
|
||||||
background:linear-gradient(top, #f5f5f5, #e4e4e4);
|
.social-likes__button_plusone {
|
||||||
color:#da573b;
|
padding-left:12px;
|
||||||
border-color:#bbb;
|
background:#e4e4e4;
|
||||||
border-color:hsla(0,0%,80%,.8);
|
background:linear-gradient(top, #f5f5f5, #e4e4e4);
|
||||||
border-bottom-color:hsla(0,0%,70%,.8);
|
color:#da573b;
|
||||||
}
|
border-color:#bbb;
|
||||||
.social-likes__button_plusone:hover {
|
border-color:hsla(0,0%,80%,.8);
|
||||||
background:#f4f4f4;
|
border-bottom-color:hsla(0,0%,70%,.8);
|
||||||
background:linear-gradient(top, #f9f9f9, #f0f0f0);
|
}
|
||||||
color:#cd4427;
|
.social-likes__button_plusone:hover {
|
||||||
border-color:#ddd;
|
background:#f4f4f4;
|
||||||
border-bottom-color:#ccc;
|
background:linear-gradient(top, #f9f9f9, #f0f0f0);
|
||||||
}
|
color:#cd4427;
|
||||||
.social-likes__icon_plusone {
|
border-color:#ddd;
|
||||||
background-image:embedurl('../icons/plusone.png');
|
border-bottom-color:#ccc;
|
||||||
background-position:0 6px;
|
}
|
||||||
}
|
.social-likes__icon_plusone {
|
||||||
.social-likes__counter_plusone {
|
background-image:embedurl('../icons/plusone.png');
|
||||||
background:#f9f9f9;
|
background-position:0 6px;
|
||||||
border-color:#d2d2d2;
|
}
|
||||||
}
|
.social-likes__counter_plusone {
|
||||||
.social-likes__counter_plusone:after {
|
background:#f9f9f9;
|
||||||
border-right-color:#f9f9f9;
|
border-color:#d2d2d2;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_plusone:after {
|
||||||
|
border-right-color:#f9f9f9;
|
||||||
// Mail.ru
|
}
|
||||||
.social-likes__button_mailru {
|
|
||||||
padding-left:18px;
|
|
||||||
background:#004584;
|
// Mail.ru
|
||||||
background:linear-gradient(top, #5d90ba, #004584);
|
.social-likes__button_mailru {
|
||||||
color:#fff;
|
padding-left:18px;
|
||||||
color:hsla(0,0%,100%,.95);
|
background:#004584;
|
||||||
border-color:#1e65a5;
|
background:linear-gradient(top, #5d90ba, #004584);
|
||||||
border-color:hsla(209,87%,32%,.8);
|
color:#fff;
|
||||||
border-bottom-color:hsla(208,88%,10%,.8);
|
color:hsla(0,0%,100%,.95);
|
||||||
text-shadow: 0 -1px 0 hsla(0,0%,0%,.3);
|
border-color:#1e65a5;
|
||||||
}
|
border-color:hsla(209,87%,32%,.8);
|
||||||
.social-likes__button_mailru:hover {
|
border-bottom-color:hsla(208,88%,10%,.8);
|
||||||
background:#001e5d;
|
text-shadow: 0 -1px 0 hsla(0,0%,0%,.3);
|
||||||
background:linear-gradient(top, #618cae, #001e5d);
|
}
|
||||||
color:#fff;
|
.social-likes__button_mailru:hover {
|
||||||
color:hsla(0,0%,100%,.99);
|
background:#001e5d;
|
||||||
border-color:#094984;
|
background:linear-gradient(top, #618cae, #001e5d);
|
||||||
border-bottom-color:#031b30;
|
color:#fff;
|
||||||
}
|
color:hsla(0,0%,100%,.99);
|
||||||
.social-likes__icon_mailru {
|
border-color:#094984;
|
||||||
background-image:embedurl('../icons/mailru.png');
|
border-bottom-color:#031b30;
|
||||||
background-position:1px 2px;
|
}
|
||||||
}
|
.social-likes__icon_mailru {
|
||||||
.social-likes__counter_mailru {
|
background-image:embedurl('../icons/mailru.png');
|
||||||
background:#fff1c2;
|
background-position:1px 2px;
|
||||||
border-color:#ffc70d;
|
}
|
||||||
}
|
.social-likes__counter_mailru {
|
||||||
.social-likes__counter_mailru:after {
|
background:#fff1c2;
|
||||||
border-right-color:#fff1c2;
|
border-color:#ffc70d;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_mailru:after {
|
||||||
// Vkontakte
|
border-right-color:#fff1c2;
|
||||||
.social-likes__button_vkontakte {
|
}
|
||||||
background:#436f96;
|
|
||||||
background:linear-gradient(top, #8faecf, #436f96);
|
// Vkontakte
|
||||||
color:#fff;
|
.social-likes__button_vkontakte {
|
||||||
color:hsla(0,0%,100%,.95);
|
background:#436f96;
|
||||||
border-color:#4d84c1;
|
background:linear-gradient(top, #8faecf, #436f96);
|
||||||
border-color:hsla(212,48%,53%,.8);
|
color:#fff;
|
||||||
border-bottom-color:hsla(211,42%,35%,.8);
|
color:hsla(0,0%,100%,.95);
|
||||||
text-shadow: 0 -1px 0 hsla(0,0%,0%,.3);
|
border-color:#4d84c1;
|
||||||
}
|
border-color:hsla(212,48%,53%,.8);
|
||||||
.social-likes__button_vkontakte:hover {
|
border-bottom-color:hsla(211,42%,35%,.8);
|
||||||
background:#4e80ab;
|
text-shadow: 0 -1px 0 hsla(0,0%,0%,.3);
|
||||||
background:linear-gradient(top, #a2c0df, #4e80ab);
|
}
|
||||||
color:#fff;
|
.social-likes__button_vkontakte:hover {
|
||||||
color:hsla(0,0%,100%,.99);
|
background:#4e80ab;
|
||||||
border-color:#5788be;
|
background:linear-gradient(top, #a2c0df, #4e80ab);
|
||||||
border-bottom-color:#3b6798;
|
color:#fff;
|
||||||
}
|
color:hsla(0,0%,100%,.99);
|
||||||
.social-likes__icon_vkontakte {
|
border-color:#5788be;
|
||||||
background-image:embedurl('../icons/vkontakte.png');
|
border-bottom-color:#3b6798;
|
||||||
background-position:1px 2px;
|
}
|
||||||
}
|
.social-likes__icon_vkontakte {
|
||||||
.social-likes__counter_vkontakte {
|
background-image:embedurl('../icons/vkontakte.png');
|
||||||
background:#eaeef3;
|
background-position:1px 2px;
|
||||||
border-color:#afc1d4;
|
}
|
||||||
}
|
.social-likes__counter_vkontakte {
|
||||||
.social-likes__counter_vkontakte:after {
|
background:#eaeef3;
|
||||||
border-right-color:#eaeef3;
|
border-color:#afc1d4;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_vkontakte:after {
|
||||||
|
border-right-color:#eaeef3;
|
||||||
// Odnoklassniki
|
}
|
||||||
.social-likes__button_odnoklassniki {
|
|
||||||
padding-left:17px;
|
|
||||||
background:#f6900b;
|
// Odnoklassniki
|
||||||
background:linear-gradient(top, #f6bb6d, #f6900b);
|
.social-likes__button_odnoklassniki {
|
||||||
color:#fff;
|
padding-left:17px;
|
||||||
color:hsla(0,0%,100%,.95);
|
background:#f6900b;
|
||||||
border-color:#d99c27;
|
background:linear-gradient(top, #f6bb6d, #f6900b);
|
||||||
border-color:hsla(39,70%,50%,.8);
|
color:#fff;
|
||||||
border-bottom-color:hsla(41,93%,40%,.8);
|
color:hsla(0,0%,100%,.95);
|
||||||
text-shadow: 0 -1px 0 hsla(0,0%,0%,.12);
|
border-color:#d99c27;
|
||||||
}
|
border-color:hsla(39,70%,50%,.8);
|
||||||
.social-likes__button_odnoklassniki:hover {
|
border-bottom-color:hsla(41,93%,40%,.8);
|
||||||
background:#f69a21;
|
text-shadow: 0 -1px 0 hsla(0,0%,0%,.12);
|
||||||
background:linear-gradient(top, #fbcc5a, #f69a21);
|
}
|
||||||
color:#fff;
|
.social-likes__button_odnoklassniki:hover {
|
||||||
color:hsla(0,0%,100%,.99);
|
background:#f69a21;
|
||||||
border-color:#f0b22c;
|
background:linear-gradient(top, #fbcc5a, #f69a21);
|
||||||
border-bottom-color:#c59121;
|
color:#fff;
|
||||||
}
|
color:hsla(0,0%,100%,.99);
|
||||||
.social-likes__icon_odnoklassniki {
|
border-color:#f0b22c;
|
||||||
background-image:embedurl('../icons/odnoklassniki.png');
|
border-bottom-color:#c59121;
|
||||||
background-position:4px 3px;
|
}
|
||||||
}
|
.social-likes__icon_odnoklassniki {
|
||||||
.social-likes__counter_odnoklassniki {
|
background-image:embedurl('../icons/odnoklassniki.png');
|
||||||
background:#ffe9be;
|
background-position:4px 3px;
|
||||||
border-color:#d9ab53;
|
}
|
||||||
}
|
.social-likes__counter_odnoklassniki {
|
||||||
.social-likes__counter_odnoklassniki:after {
|
background:#ffe9be;
|
||||||
border-right-color:#ffe9be;
|
border-color:#d9ab53;
|
||||||
}
|
}
|
||||||
|
.social-likes__counter_odnoklassniki:after {
|
||||||
|
border-right-color:#ffe9be;
|
||||||
// Livejournal
|
}
|
||||||
.social-likes__button_livejournal {
|
|
||||||
background:#cadcf3;
|
|
||||||
background:linear-gradient(top, #fff, #cadcf3);
|
// Livejournal
|
||||||
color:#5183b4;
|
.social-likes__button_livejournal {
|
||||||
border-color:hsla(208,78%,84%,.8);
|
background:#cadcf3;
|
||||||
border-bottom-color:hsla(209,22%,60%,.8);
|
background:linear-gradient(top, #fff, #cadcf3);
|
||||||
}
|
color:#5183b4;
|
||||||
.social-likes__button_livejournal:hover {
|
border-color:hsla(208,78%,84%,.8);
|
||||||
background:#dce2f5;
|
border-bottom-color:hsla(209,22%,60%,.8);
|
||||||
background:linear-gradient(top, #ecf1f7, #bad2f0);
|
}
|
||||||
color:#253759;
|
.social-likes__button_livejournal:hover {
|
||||||
border-color:#b7cfe4;
|
background:#dce2f5;
|
||||||
border-bottom-color:#9caebe;
|
background:linear-gradient(top, #ecf1f7, #bad2f0);
|
||||||
}
|
color:#253759;
|
||||||
.social-likes__icon_livejournal {
|
border-color:#b7cfe4;
|
||||||
background-image:embedurl('../icons/livejournal.png');
|
border-bottom-color:#9caebe;
|
||||||
background-position:2px 2px;
|
}
|
||||||
}
|
.social-likes__icon_livejournal {
|
||||||
|
background-image:embedurl('../icons/livejournal.png');
|
||||||
|
background-position:2px 2px;
|
||||||
// Code
|
}
|
||||||
.social-likes__button_code {
|
|
||||||
background:#efefef;
|
|
||||||
background:linear-gradient(top, #fff, #efefef);
|
// Code
|
||||||
color:#555;
|
.social-likes__button_code {
|
||||||
border-color:#dfdfdf;
|
background:#efefef;
|
||||||
border-color:hsla(0,0%,90%,.8);
|
background:linear-gradient(top, #fff, #efefef);
|
||||||
border-bottom-color:hsla(0,0%,80%,.8);
|
color:#555;
|
||||||
border-bottom-color:#b3c1ce;
|
border-color:#dfdfdf;
|
||||||
}
|
border-color:hsla(0,0%,90%,.8);
|
||||||
.social-likes__button_code:hover {
|
border-bottom-color:hsla(0,0%,80%,.8);
|
||||||
background:#e0e0e0;
|
border-bottom-color:#b3c1ce;
|
||||||
background:linear-gradient(top, #fafafa, #e0e0e0);
|
}
|
||||||
color:#333;
|
.social-likes__button_code:hover {
|
||||||
border-color:hsla(0,0%,75%,.8);
|
background:#e0e0e0;
|
||||||
border-bottom-color:hsla(0,0%,65%,.8);
|
background:linear-gradient(top, #fafafa, #e0e0e0);
|
||||||
}
|
color:#333;
|
||||||
.social-likes__icon_code {
|
border-color:hsla(0,0%,75%,.8);
|
||||||
background-image:embedurl('../icons/code.png');
|
border-bottom-color:hsla(0,0%,65%,.8);
|
||||||
background-position:2px 2px;
|
}
|
||||||
}
|
.social-likes__icon_code {
|
||||||
|
background-image:embedurl('../icons/code.png');
|
||||||
// Code balloon
|
background-position:2px 2px;
|
||||||
.social-likes__balloon {
|
}
|
||||||
position:absolute;
|
|
||||||
display:none;
|
// Code balloon
|
||||||
bottom:29px;
|
.social-likes__balloon {
|
||||||
right:0;
|
position:absolute;
|
||||||
padding:6px;
|
display:none;
|
||||||
color:#fff;
|
bottom:29px;
|
||||||
text-align:left;
|
right:0;
|
||||||
text-shadow:0 -1px 0 hsla(0,0%,0%,.4);
|
padding:6px;
|
||||||
line-height:1.2;
|
color:#fff;
|
||||||
background:#666;
|
text-align:left;
|
||||||
background:hsla(0,0%,0%,.6);
|
text-shadow:0 -1px 0 hsla(0,0%,0%,.4);
|
||||||
border-radius:5px;
|
line-height:1.2;
|
||||||
box-shadow:0 2px 18px -7px hsla(0,0%,0%,.8);
|
background:#666;
|
||||||
|
background:hsla(0,0%,0%,.6);
|
||||||
&__code {
|
border-radius:5px;
|
||||||
width:300px;
|
box-shadow:0 2px 18px -7px hsla(0,0%,0%,.8);
|
||||||
height:60px;
|
|
||||||
margin-top:3px;
|
&__code {
|
||||||
border:1px #aaa inset;
|
width:300px;
|
||||||
background:#fff;
|
height:60px;
|
||||||
box-shadow:1px 1px 3px hsla(0,0%,0%,.25) inset;
|
margin-top:3px;
|
||||||
resize:none;
|
border:1px #aaa inset;
|
||||||
outline:0;
|
background:#fff;
|
||||||
}
|
box-shadow:1px 1px 3px hsla(0,0%,0%,.25) inset;
|
||||||
|
resize:none;
|
||||||
&__arrow {
|
outline:0;
|
||||||
position:absolute;
|
}
|
||||||
bottom:-6px;
|
|
||||||
right:8px;
|
&__arrow {
|
||||||
width:0;
|
position:absolute;
|
||||||
height:0;
|
bottom:-6px;
|
||||||
border:6px solid transparent;
|
right:8px;
|
||||||
border-bottom:none;
|
width:0;
|
||||||
border-top:6px solid #666;
|
height:0;
|
||||||
}
|
border:6px solid transparent;
|
||||||
|
border-bottom:none;
|
||||||
&_right {
|
border-top:6px solid #666;
|
||||||
left:0;
|
}
|
||||||
right:auto;
|
|
||||||
|
&_right {
|
||||||
.social-likes__balloon__arrow {
|
left:0;
|
||||||
left:8px;
|
right:auto;
|
||||||
right:auto;
|
|
||||||
}
|
.social-likes__balloon__arrow {
|
||||||
}
|
left:8px;
|
||||||
|
right:auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue