Merge pull request #404 from lepasq/github-contributors

Add Github contributors list
This commit is contained in:
Manoj Vivek 2020-08-20 17:39:57 +05:30 committed by GitHub
commit 2b264655d9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 69 additions and 3 deletions

View file

@ -0,0 +1,40 @@
var json = '';
var html = '';
function profileHtmlString(to, title, style) {
return `<a href="${to}" title="${title}" target="_blank" class="github-contributors__avatar" style="${style}">&nbsp;</a>`;
}
function generateProfile(c) {
var to = `https://github.com/${c.login}`;
var title = `${c.contributions} contributions from ${c.login}`;
var style = `background-image: url('${c.avatar_url}&s=64');`;
html += profileHtmlString(to, title, style);
}
function getContributorAmount() {
return json.length;
}
function generateFooterRow() {
document.getElementById('github-contributors__thanks').innerText = `Thanks to all of our ${getContributorAmount()} contributors!`;
for (var i = 0; i < json.length; i++) {
generateProfile(json[i]);
}
document.getElementById('github-contributors__users').innerHTML = html;
}
async function getContr() {
fetch('https://api.github.com/repos/responsively-org/responsively-app/contributors', {
method: 'GET',
headers: {
'User-Agent': 'responsively-app/website',
},
})
.then((response) => response.text())
.then((text) => json = JSON.parse(text))
.then((json) => generateFooterRow())
.catch((err) => console.error(err));
}
getContr();

View file

@ -38,3 +38,20 @@ html {
.extensionButton {
width: 300px;
}
#github-contributors__users {
padding: 0 2rem;
max-width: 40rem;
margin: 1rem auto;
}
.github-contributors__avatar {
overflow: hidden;
border-radius: 50%;
width: 2rem;
height: 2rem;
margin: .1rem .2rem;
display: inline-block;
background-color: hsla(0, 0%, 100%, .1);
background-size: contain;
}

View file

@ -554,6 +554,13 @@
</div>
</section>
<section>
<div class="justify-content-center text-center">
<h3 id="github-contributors__thanks">Thanks to all of our contributors!</h3>
<div id="github-contributors__users">
</div>
</div>
</section>
<!--
<section id="How-It-Works" class="bg-primary-3 text-light has-divider jarallax" data-jarallax data-speed="0.2">
<img src="assets/img/desktop-app-3.jpg" alt="Image" class="jarallax-img opacity-20">
@ -729,6 +736,8 @@
<!-- Required theme scripts (Do not remove) -->
<script type="text/javascript" src="assets/js/theme.js"></script>
<!-- Removes page load animation when window is finished loading -->
<script type="text/javascript" src="../js/mrare/contributors.js"></script>
<!-- Loads github contributors -->
<script type="text/javascript">
window.addEventListener("load", function() {
document.querySelector("body").classList.add("loaded");