mirror of
https://github.com/responsively-org/responsively-app
synced 2024-11-15 00:47:17 +00:00
Merge pull request #404 from lepasq/github-contributors
Add Github contributors list
This commit is contained in:
commit
2b264655d9
3 changed files with 69 additions and 3 deletions
40
website/js/mrare/contributors.js
Normal file
40
website/js/mrare/contributors.js
Normal 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}"> </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();
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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");
|
||||
|
|
Loading…
Reference in a new issue