Change social buttons to local

This commit is contained in:
Thomas A. Christensen II 2019-09-27 21:02:51 -07:00
parent b3b9cee458
commit 9c2b455008
16 changed files with 68 additions and 325 deletions

View file

@ -73,6 +73,29 @@
</div>
</nav>
</div>
<div class="row">
<div class="col-xs-2 col-xs-offset-2">
<a class="btn btn-black" href="https://stackoverflow.com/users/3922521/milliron-x">
<i class="fab fa-stack-overflow"></i>
</a>
</div>
<div class="col-xs-2">
<a class="btn btn-black" href="https://vimeo.com/tchristensenii">
<i class="fab fa-vimeo-v"></i>
</a>
</div>
<div class="col-xs-2">
<a class="btn btn-black" href="https://github.com/millironx">
<i class="fab fa-github"></i>
</a>
</div>
</div>
<div class="row">
<div class="col-xs-4 col-xs-offset-3">
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/80x15.png" /></a>
</div>
</div>
</div>
<div class="col-sm-9">
@ -89,27 +112,12 @@
<br />
<div class="main" id="main-content">
{{ content }}
<hr />
<footer class="row">
<div class="col-md-4">
<div class="col-md-8 col-md-offset-2">
<div class="text-center">
<!--StackExchange flair-->
<a href="https://stackoverflow.com/users/3922521/milliron-x">
<img src="https://stackoverflow.com/users/flair/3922521.png" width="208" height="58" alt="profile for Milliron X at Stack Overflow, Q&amp;A for professional and enthusiast programmers" title="profile for Milliron X at Stack Overflow, Q&amp;A for professional and enthusiast programmers">
</a>
</div>
</div>
<div class="col-md-4">
<div class="text-center">
<!--Vimeo badge-->
<a href="https://vimeo.com/tchristensenii"><img src="https://f.vimeocdn.com/images_v6/blogbadge_channels.png" alt="Vimeo Blog Badge" /></a>
</div>
</div>
<div class="col-md-4">
<div class="text-center">
<!--GitHub "flair"-->
<div id="githubFlair"></div>
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by/4.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">{{ page.title }}</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://millironx.github.io" property="cc:attributionName" rel="cc:attributionURL">Thomas A. Christensen II</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.
</div>
</div>
</footer>
@ -141,9 +149,6 @@
<script src="../js/gsdk-radio.js" type="text/javascript"></script>
<script src="../js/gsdk-custom.js" type="text/javascript"></script>
<!-- Script Bundle: Social Flair -->
<script src="../js/jquery.socialflair.js" type="text/javascript"></script>
<!-- Script Bundle: Custom -->
<script src="../js/MillironX_CustomScripts.js" type="text/javascript"></script>
</body>

View file

@ -140,3 +140,43 @@ h1 {
dl {
font-size: 16px;
}
.btn-black {
background-color: #222222;
border-color: #080808;
}
.btn-black:hover,
.btn-black:focus,
.btn-black:active,
.btn-black.active,
.open .dropdown-toggle.btn-black {
color: #ffffff;
background-color: #3276b1;
border-color: #285e8e;
}
.btn-black:active,
.btn-black.active,
.open .dropdown-toggle.btn-black {
background-image: none;
}
.btn-black.disabled,
.btn-black[disabled],
fieldset[disabled] .btn-black,
.btn-black.disabled:hover,
.btn-black[disabled]:hover,
fieldset[disabled] .btn-black:hover,
.btn-black.disabled:focus,
.btn-black[disabled]:focus,
fieldset[disabled] .btn-black:focus,
.btn-black.disabled:active,
.btn-black[disabled]:active,
fieldset[disabled] .btn-black:active,
.btn-black.disabled.active,
.btn-black[disabled].active,
fieldset[disabled] .btn-black.active {
background-color: #428bca;
border-color: #357ebd;
}

View file

@ -1,112 +0,0 @@
.sfTable {
display : table;
border-collapse: collapse;
width : 207px;
height : 57px;
}
.sfTwitter {
background : url(../img/twitter-watermark.png) no-repeat right bottom;
border : 1px solid #CCCCCC;
background-color : #F9F9F9;
}
.sfFacebook {
background : url(../img/facebook-watermark.gif) no-repeat right bottom;
border : 1px solid #C4CDE0;
background-color : #EDEFF4;
}
.sfGithub {
background : url(../img/github-watermark.gif) no-repeat right bottom;
border : 1px solid #D4D4D4;
background-color: #ececec;
}
.sfBitbucket {
background : url(../img/bitbucket-watermark.png) no-repeat right bottom;
border : 1px solid #D4D4D4;
background-color: #ececec;
}
.sfRow {
display : table-row;
width : 100%;
}
.sfCell1 {
display : table-cell;
width : 48px;
padding : 4px 0px 0px 5px;
}
.sfCell2 {
display : table-cell;
vertical-align : top;
text-align : left;
padding-left : 10px;
padding-top : 3px;
width : 146px;
}
.sfCell2 div.sfHandle {
font : 13px "Tahoma",Helvetica,Arial,sans-serif;
font-weight : bold;
margin-right : 5px;
width : 140px;
word-wrap: break-word;
}
.sfTwitter div.sfHandle {
color : #0084B4;
}
.sfFacebook div.sfHandle {
color : #627AAD;
}
.sfGithub div.sfHandle {
color : #333;
}
.sfCell2 div.sfFans {
font : 11px "Tahoma",Helvetica,Arial,sans-serif;
color : #999;
font-weight : bold;
padding-top : 5px;
}
.sfCell2 div.sfFans span { padding-right : 10px; }
.sfCell2 div.sfFans span.hireable { color : #A229A9; }
.sfTwitter .sfCell2 div.sfFans span.following {
background : url(../img/twitter.ico) no-repeat left center;
padding-left : 20px;
}
.sfTwitter .sfCell2 div.sfFans span.followers {
background : url(../img/twitterr.ico) no-repeat left center;
padding-left : 20px;
}
.sfGithub .sfCell2 div.sfFans span.public_repos {
background : url(../img/repos.gif) no-repeat left center;
padding-left : 20px;
}
.sfGithub .sfCell2 div.sfFans span.followers {
background : url(../img/githubr.ico) no-repeat left center;
padding-left : 20px;
}
.sfBitbucket .sfCell2 div.sfFans span.public_repos {
background : url(../img/repos.gif) no-repeat left center;
padding-left : 20px;
}
.sfBitbucket .sfCell2 div.sfFans span.followers {
background : url(../img/bitbucket.ico) no-repeat left center;
padding-left : 20px;
}
.sfFacebook .sfCell2 div.sfFans span.following {
background : url(../img/friends.gif) no-repeat left center;
padding-left : 20px;
}
.sfFacebook .sfCell2 div.sfFans span.following {
background : url(../img/friends.gif) no-repeat left center;
padding-left : 20px;
}
img.ico {
vertical-align : middle;
margin-right : 5px;
}
img.sfProfilePic {
-webkit-border-radius: 4px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
border-radius: 4px; /* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ */
/* useful if you don't want a bg color from leaking outside the border: */
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
a.sfLink {
text-decoration: none;
}

View file

@ -1 +0,0 @@
.sfTable{display:table;border-collapse:collapse;width:207px;height:57px}.sfTwitter{background:url(../img/twitter-watermark.png) no-repeat right bottom;border:1px solid #ccc;background-color:#f9f9f9}.sfFacebook{background:url(../img/facebook-watermark.gif) no-repeat right bottom;border:1px solid #c4cde0;background-color:#edeff4}.sfGithub{background:url(../img/github-watermark.gif) no-repeat right bottom;border:1px solid #d4d4d4;background-color:#ececec}.sfBitbucket{background:url(../img/bitbucket-watermark.png) no-repeat right bottom;border:1px solid #d4d4d4;background-color:#ececec}.sfRow{display:table-row;width:100%}.sfCell1{display:table-cell;width:48px;padding:4px 0 0 5px}.sfCell2{display:table-cell;vertical-align:top;text-align:left;padding-left:10px;padding-top:3px;width:146px}.sfCell2 div.sfHandle{font:13px "Tahoma",Helvetica,Arial,sans-serif;font-weight:bold;margin-right:5px;width:140px;word-wrap:break-word}.sfTwitter div.sfHandle{color:#0084b4}.sfFacebook div.sfHandle{color:#627aad}.sfGithub div.sfHandle{color:#333}.sfCell2 div.sfFans{font:11px "Tahoma",Helvetica,Arial,sans-serif;color:#999;font-weight:bold;padding-top:5px}.sfCell2 div.sfFans span{padding-right:10px}.sfCell2 div.sfFans span.hireable{color:#a229a9}.sfTwitter .sfCell2 div.sfFans span.following{background:url(../img/twitter.ico) no-repeat left center;padding-left:20px}.sfTwitter .sfCell2 div.sfFans span.followers{background:url(../img/twitterr.ico) no-repeat left center;padding-left:20px}.sfGithub .sfCell2 div.sfFans span.public_repos{background:url(../img/repos.gif) no-repeat left center;padding-left:20px}.sfGithub .sfCell2 div.sfFans span.followers{background:url(../img/githubr.ico) no-repeat left center;padding-left:20px}.sfBitbucket .sfCell2 div.sfFans span.public_repos{background:url(../img/repos.gif) no-repeat left center;padding-left:20px}.sfBitbucket .sfCell2 div.sfFans span.followers{background:url(../img/bitbucket.ico) no-repeat left center;padding-left:20px}.sfFacebook .sfCell2 div.sfFans span.following{background:url(../img/friends.gif) no-repeat left center;padding-left:20px}.sfFacebook .sfCell2 div.sfFans span.following{background:url(../img/friends.gif) no-repeat left center;padding-left:20px}img.ico{vertical-align:middle;margin-right:5px}img.sfProfilePic{-webkit-border-radius:4px;border-radius:4px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}a.sfLink{text-decoration:none}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 574 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 544 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -1,189 +0,0 @@
/*!
* jQuery socialFlair - Stackoverflow like User Flairs to showcase your
* Social Profiles
* ---------------------------------------------------------------------
*
* This is a simple jQuery plugin which lets you embed social flairs
* into your personal website or blog.
*
* Licensed under Mozilla Public License
*
* @version 1.0.0
* @since 2012.05.01
* @author Amit Gharat a.k.a. codef0rmer
* @blog http://goo.gl/frl5a
* @twitter twitter.com/codef0rmer
*
* Usage:
* ---------------------------------------------------------------------
* Twitter Flair:
* $(ele).socialFlair('twitter', 'twitterUsername', {});
*
* Github Flair:
* $(ele).socialFlair('github', 'githubUsername', {});
*
* Facebook Flair:
* Create an App and get the details here: https://developers.facebook.com/apps
* $(ele).socialFlair('facebook', 'facebookUsername', {clientId : clientId, clientSecret : clientSecrete});
*
*/
(function($) {
$.fn.extend({
socialFlair : function(service, handler, options) {
var defaults = {
};
options = $.extend({}, defaults, options);
return this.each(function() {
var $ele = $(this),
followers = 0,
following = 0,
access_token = null,
public_repos = 0;
// Twitter API
if (service === 'twitter' && handler !== undefined) {
$(document).queue("ajaxRequests", function() {
$.ajax({
url : 'http://api.twitter.com/1/followers/ids.json?screen_name=' + handler + '&cursor=-1',
method : 'get',
dataType : 'jsonp',
success : function (data) {
followers = data.ids.length;
}
});
});
$(document).queue("ajaxRequests", function() {
$.ajax({
url : 'https://api.twitter.com/1/friends/ids.json?cursor=-1&screen_name=' + handler,
method : 'get',
dataType : 'jsonp',
success : function (data) {
following = data.ids.length;
$ele.html(
"<a class='sfLink' href='http://twitter.com/#!/" + handler +"'><div class='sfTable sfTwitter'><div class='sfRow'>" +
" <div class='sfCell1'>" +
" <img class='sfProfilePic' src='https://api.twitter.com/1/users/profile_image?screen_name=" + handler + "&size=normal' width='48px' height='48px' />" +
" </div>"+
" <div class='sfCell2'>" +
" <div class='sfHandle'>" + truncateName(handler) + "</div>" +
" <div class='sfFans'>"+
" <span class='following' alt='Following' title='Following'>" + following + "</span>" +
" <span class='followers' alt='Followers' title='Followers'>" + followers + "</span>" +
" </div>" +
"</div>" +
"</div></div></a>"
);
}
});
});
$(document).dequeue("ajaxRequests");
$(document).dequeue("ajaxRequests");
} else if (service === 'github' && handler !== undefined) {
// Github API
$.ajax({
url : 'https://api.github.com/users/' + handler,
method : 'get',
dataType : 'jsonp',
success : function (data) {
followers = data.data.followers;
public_repos = data.data.public_repos;
$ele.html(
"<a class='sfLink' href='" + data.data.html_url +"'><div class='sfTable sfGithub'><div class='sfRow'>" +
" <div class='sfCell1'>" +
" <img class='sfProfilePic' src='" + data.data.avatar_url + "' width='48px' height='48px' />" +
" </div>" +
" <div class='sfCell2'>" +
" <div class='sfHandle'>" + truncateName(data.data.name || data.data.login) + "</div>" +
" <div class='sfFans'>" +
" <span class='public_repos' alt='Public Repositories' title='Public Repositories'>" + public_repos + "</span>" +
" <span class='followers' alt='Followers' title='Followers'>" + followers + "</span>" +
( data.data.hireable === true ? "<span class='hireable'>Hire Me!</span>" : '' ) +
" </div>" +
"</div>" +
"</div></div></a>"
);
}
});
} else if (service === 'bitbucket' && handler !== undefined) {
// BitBucket API
$.ajax({
url : 'https://api.bitbucket.org/1.0/users/' + handler + '/followers',
method : 'get',
dataType : 'jsonp',
success : function (data) {
var followers = data.count;
$.ajax({
url : 'https://api.bitbucket.org/1.0/users/' + handler,
method : 'get',
dataType : 'jsonp',
success : function (data) {
var public_repos = data.repositories.length;
$ele.html(
"<a class='sfLink' href='https://bitbucket.org/" + data.user.username +"'><div class='sfTable sfBitbucket'><div class='sfRow'>" +
" <div class='sfCell1'>" +
" <img class='sfProfilePic' src='" + data.user.avatar + "' width='48px' height='48px' />" +
" </div>" +
" <div class='sfCell2'>" +
" <div class='sfHandle'>" + truncateName(data.user.username) + "</div>" +
" <div class='sfFans'>" +
" <span class='public_repos' alt='Public Repositories' title='Public Repositories'>" + public_repos + "</span>" +
" <span class='followers' alt='Followers' title='Followers'>" + followers + "</span>" +
" </div>" +
"</div>" +
"</div></div></a>"
);
}
});
}
});
} else if (service === 'facebook' && handler !== undefined) {
// Facebook API
$.ajax({
url : 'https://graph.facebook.com/oauth/access_token?client_id=' + options.clientId + '&client_secret=' + options.clientSecret + '&grant_type=client_credentials',
method : 'get',
dataType : 'text',
success : function (data) {
access_token = data;
$.ajax({
url : 'https://api.facebook.com/method/friends.get?uid=' + handler + '&' + access_token + '&format=json',
method : 'get',
dataType : 'json',
success : function (data) {
following = data.length;
$.ajax({
url : 'https://graph.facebook.com/' + handler,
method : 'get',
dataType : 'json',
success : function (data) {
$ele.html(
"<a class='sfLink' href='" + data.link + "'><div class='sfTable sfFacebook'><div class='sfRow'>" +
" <div class='sfCell1'>" +
" <img class='sfProfilePic' src='http://graph.facebook.com/" + handler + "/picture' width='48px' height='48px' />" +
" </div>" +
" <div class='sfCell2'>" +
" <div class='sfHandle'>" + truncateName(data.name) + "</div>" +
" <div class='sfFans'>" +
" <span class='following' alt='Friends' title='Friends'>" + following + "</span>" +
" </div>" +
"</div>" +
"</div></div></a>"
);
}
});
}
});
}
});
}
});
}
});
})(jQuery);
function truncateName(handler) {
return ( handler.length > 28 ? handler.substring(0, 28) + '...' : handler );
}