Contrib buttons.
parent
5c456e4f83
commit
998e0307f4
|
@ -86,6 +86,8 @@ Place `googleplusonecount.php` somewhere on your server. And change buttons HTML
|
|||
|
||||
### Adding your own button
|
||||
|
||||
You can find some custom buttons in `contrib` folder.
|
||||
|
||||
Define `socialLikesButtons` hash:
|
||||
|
||||
```javascript
|
||||
|
|
|
@ -0,0 +1,3 @@
|
|||
# Social Likes Custom Buttons
|
||||
|
||||
You only need to copy CSS file from `css` folder and copypaste JS/HTML from HTML file.
|
|
@ -0,0 +1,40 @@
|
|||
/** Author: Artem Sapegin, http://sapegin.me, 2012 */
|
||||
.social-likes__button_github,
|
||||
.social-likes__button_github:link,
|
||||
.social-likes__button_github:visited {
|
||||
padding-left: 19px;
|
||||
background: #e6e6e6;
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, #eaeaea));
|
||||
background: -webkit-linear-gradient(top, #fafafa 0%, #eaeaea 100%);
|
||||
background: -moz-linear-gradient(top, #fafafa 0%, #eaeaea 100%);
|
||||
background: -o-linear-gradient(top, #fafafa 0%, #eaeaea 100%);
|
||||
background: -ms-linear-gradient(top, #fafafa 0%, #eaeaea 100%);
|
||||
background: linear-gradient(top, #fafafa 0%, #eaeaea 100%);
|
||||
color: #555;
|
||||
border-color: #d4d4d4;
|
||||
border-bottom-color: #bcbcbc;
|
||||
text-decoration: none;
|
||||
}
|
||||
.social-likes__button_github:hover {
|
||||
background: #efefef;
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #f0f0f0));
|
||||
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: -moz-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: -o-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: -ms-linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
background: linear-gradient(top, #fff 0%, #f0f0f0 100%);
|
||||
color: #444;
|
||||
border-color: #d4d4d4;
|
||||
border-bottom-color: #bcbcbc;
|
||||
}
|
||||
.social-likes__icon_github {
|
||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAABelBMVEX///9UVFRUVFRXV1dVVVVOTk5YWFhNTU2hoaHJycm2trZTU1NVVVVYWFj8/Pz///////9kZGT///////9UVFRVVVW0tLRVVVVWVlZUVFRVVVVVVVVUVFRUVFSpqalVVVWsrKxPT09cXFxVVVX///+GhoZVVVV6enr///97e3tfX19hYWGtra2EhIS4uLhGRkavr69fX194eHi3t7dWVlZsbGyJiYlVVVWDg4NjY2NUVFR5eXlZWVlra2t0dHSOjo6tra1WVlaGhoaamppxcXFnZ2eSkpJoaGikpKSBgYHk5OShoaF9fX3Pz8/9/f3///9paWmOjo7a2tpYWFhmZmaJiYlbW1tkZGRaWlpjY2NwcHD///////9TU1NXV1fS0tL///+zs7ONjY26urp/f39ra2tzc3N7e3tWVla1tbX///9fX19XV1deXl5tbW1jY2NtbW1nZ2dUVFRWVla/v7/k5OSOjo5mZmaNjY1nZ2ePj4/k5ORVVVVWVlaXk6uTAAAAfHRSTlMAgs73Whf9FMTK0Vb5+5hQMN5EQ/X40vL1fYr2ienT89MdjVRFluWuQOqX5LKa0Aut6etc/S2V/kz4mEr99H0ty/7oRIf00soqmsTe7M58HszWdPlnnrbc/PfgKwFQ+30T0Jaj2fLp1/fRGOH5ztvy5eTL+FS/y+tD7c/AHyR2AgAAAK9JREFUeF4kxzEOQUEUBdB7X7y5MT8Tr1CMqNDZBmzBIi1ErIENaBQSjWTC//7pDnqiLedGATBgE5Ge7xS1G9o91NRrzBOYl1xrztsyK4vviut48YTBmaRNP/cj/g6S7CZcx0baJ4O7Y7S7+G+MtoyMjIzWIN4xRkZGRjdGEDD6f4ERDIIYUUAC4+owRhCYyZLCyMjIIPTjZxYjGEzneMfE8I6ziJNz3lwODg7OdwwAC+kdv4tFptkAAAAASUVORK5CYII=");
|
||||
background-position: 3px 3px;
|
||||
}
|
||||
.social-likes__counter_github {
|
||||
background: #fafafa;
|
||||
border-color: #d4d4d4;
|
||||
}
|
||||
.social-likes__counter_github:after {
|
||||
border-right-color: #fafafa;
|
||||
}
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="ru-RU">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Social Likes GitHub button</title>
|
||||
<link href="../social-likes.css" rel="stylesheet">
|
||||
<script src="http://yandex.st/jquery/1.9.1/jquery.min.js"></script>
|
||||
<script src="../social-likes.min.js"></script>
|
||||
|
||||
<!-- GitHub button CSS -->
|
||||
<link href="css/github.css" rel="stylesheet">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h3>GitHub button</h3>
|
||||
|
||||
<script>
|
||||
// Don't forget to change your name and repo name: sapegin/social-likes
|
||||
var socialLikesButtons = {
|
||||
github: {
|
||||
counterUrl: 'https://api.github.com/repos/sapegin/social-likes?callback=?',
|
||||
convertNumber: function(data) {
|
||||
return data.data.watchers_count;
|
||||
},
|
||||
clickUrl: 'https://github.com/sapegin/social-likes/'
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<ul class="social-likes">
|
||||
<li class="github" title="Star on GitHub">GitHub</li>
|
||||
</ul>
|
||||
|
||||
</body>
|
||||
</html>
|
Binary file not shown.
After Width: | Height: | Size: 758 B |
|
@ -0,0 +1,34 @@
|
|||
/** Author: Artem Sapegin, http://sapegin.me, 2012 */
|
||||
|
||||
@import "nib/gradients"
|
||||
@import "nib/vendor";
|
||||
|
||||
.social-likes__button_github,
|
||||
.social-likes__button_github:link,
|
||||
.social-likes__button_github:visited {
|
||||
padding-left:19px;
|
||||
background:#e6e6e6;
|
||||
background:linear-gradient(top, #fafafa, #eaeaea);
|
||||
color:#555;
|
||||
border-color:#d4d4d4;
|
||||
border-bottom-color:#bcbcbc;
|
||||
text-decoration:none;
|
||||
}
|
||||
.social-likes__button_github:hover {
|
||||
background:#efefef;
|
||||
background:linear-gradient(top, #fff, #f0f0f0);
|
||||
color:#444;
|
||||
border-color:#d4d4d4;
|
||||
border-bottom-color:#bcbcbc;
|
||||
}
|
||||
.social-likes__icon_github {
|
||||
background-image:embedurl('../icons/github.png');
|
||||
background-position:3px 3px;
|
||||
}
|
||||
.social-likes__counter_github {
|
||||
background:#fafafa;
|
||||
border-color:#d4d4d4;
|
||||
}
|
||||
.social-likes__counter_github:after {
|
||||
border-right-color:#fafafa;
|
||||
}
|
|
@ -37,6 +37,15 @@ module.exports = function(grunt) {
|
|||
'include css': true,
|
||||
'urlfunc': 'embedurl'
|
||||
}
|
||||
},
|
||||
contrib: {
|
||||
files: {
|
||||
'../contrib/css/github.css': '../contrib/styles/github.styl'
|
||||
},
|
||||
options: {
|
||||
'urlfunc': 'embedurl',
|
||||
'compress': false
|
||||
}
|
||||
}
|
||||
},
|
||||
csso: {
|
||||
|
@ -51,7 +60,7 @@ module.exports = function(grunt) {
|
|||
watch: {
|
||||
stylus: {
|
||||
files: 'styles/**',
|
||||
tasks: 'stylus'
|
||||
tasks: 'stylus:compile'
|
||||
}
|
||||
},
|
||||
imgo: {
|
||||
|
|
Loading…
Reference in New Issue