admin/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: GitHub contributions calendar added to bottom of page.

Browse Source
This commit is contained in:
teddy
2025-03-05 13:04:57 +00:00
parent 22c884c007
commit 3912506f24
3 changed files with 88 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
index.html
View File

@@ -7,9 +7,22 @@
<!-- SEO --> <!-- SEO -->
<meta name="yandex-verification" content="6d6eae9d533ef680" /> <meta name="yandex-verification" content="6d6eae9d533ef680" />
<!-- Security --> <!-- Security -->
<!--
<meta http-equiv="X-Frame-Options" content="SAMEORIGIN"> <meta http-equiv="X-Frame-Options" content="SAMEORIGIN">
<meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate"> <meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate">
<!-- Stylesheet --> -->
<!-- Stylesheets -->
<!--
GitHub Contributions Calendar (light mode default)
- Statistics under calendar do not work.
-->
<link rel="stylesheet" href="https://unpkg.com/github-calendar@latest/dist/github-calendar-responsive.css" />
<!--
GitHub Contributions Calendar (dark mode default)
- Statistics under calendar do not work.
- Requires https://github.com/forresttindall/Github-Activity-Calendar
<link rel="stylesheet" href="./Github-Activity-Calendar/github-calendar.css"/>
-->
<link rel="stylesheet" href="styles/styles.css"> <link rel="stylesheet" href="styles/styles.css">
</head> </head>
<body> <body>
@@ -200,6 +213,9 @@
<li>LinkedIn: <a href="https://www.linkedin.com/in/teddyms/">linkedin.com/in/teddyms</a></li> <li>LinkedIn: <a href="https://www.linkedin.com/in/teddyms/">linkedin.com/in/teddyms</a></li>
<li>GitHub: <a href="https://github.com/Teddy-1024/">github.com/Teddy-1024</a></li> <li>GitHub: <a href="https://github.com/Teddy-1024/">github.com/Teddy-1024</a></li>
</ul> </ul>
<div class="github-calendar">
<!-- GitHub activity calendar will be rendered here -->
</div>
</div> </div>
</section> </section>
</main> </main>
@@ -210,8 +226,51 @@
</footer> </footer>
<!-- Scripts --> <!-- Scripts -->
<!-- Internal -->
<script type="text/javascript" src="scripts/scripts.js"></script> <script type="text/javascript" src="scripts/scripts.js"></script>
<!-- External -->
<!-- Google Translate -->
<script>
function initGoogleTranslateElement() {
new google.translate.TranslateElement({
pageLanguage: 'en',
// layout: google.translate.TranslateElement.InlineLayout.SIMPLE
layout: google.translate.TranslateElement.InlineLayout.VERTICAL
}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="https://translate.google.com/translate_a/element.js?cb=initGoogleTranslateElement"></script> <script type="text/javascript" src="https://translate.google.com/translate_a/element.js?cb=initGoogleTranslateElement"></script>
<!--
GitHub Contributions Calendar (light mode default)
- Statistics under calendar do not work.
-->
<script src="https://unpkg.com/github-calendar@latest/dist/github-calendar.min.js"></script>
<script>
// Basic implementation
// e - statistics are all 0
// GitHubCalendar(".github-calendar", "Teddy-1024");
// Or with responsive option enabled:
// e - statistics are all 0
// GitHubCalendar(".github-calendar", "Teddy-1024", { responsive: true });
GitHubCalendar(".github-calendar", "Teddy-1024", {
responsive: true,
proxy: function(username) {
return fetch(`https://cors-anywhere.herokuapp.com/https://github.com/users/${username}/contributions`)
.then(response => response.text());
}
});
</script>
<!--
GitHub Contributions Calendar (dark mode default)
- Statistics under calendar do not work.
- Requires https://github.com/forresttindall/Github-Activity-Calendar
<script src="./Github-Activity-Calendar/github-calendar.js"></script>
<script>
GitHubCalendar(".github-calendar", "Teddy-1024");
</script>
-->
<script> <script>
window.onload = function() { window.onload = function() {

10
scripts/scripts.js
View File

@@ -93,13 +93,3 @@ function hookupProjectDetailButtons() {
}); });
}); });
} }
// Google Translate
function initGoogleTranslateElement() {
new google.translate.TranslateElement({
pageLanguage: 'en',
// layout: google.translate.TranslateElement.InlineLayout.SIMPLE
layout: google.translate.TranslateElement.InlineLayout.VERTICAL
}, 'google_translate_element');
}

28
styles/styles.css
View File

@@ -80,6 +80,11 @@ nav a:hover {
/* Google Translate styles /* Google Translate styles
- Hide poorly styled iframes - Hide poorly styled iframes
*/ */
#google_translate_element {
background-color: white;
border-radius: 0.25vh;
padding: 0.5vh;
}
iframe.skiptranslate { iframe.skiptranslate {
display: none !important; display: none !important;
} }
@@ -201,6 +206,8 @@ ul, li {
font-size: 0.9rem; font-size: 0.9rem;
text-decoration: underline; text-decoration: underline;
margin-top: 1vh; margin-top: 1vh;
cursor: pointer;
width: fit-content;
} }
.project-thumbnail { .project-thumbnail {
margin-top: 2vh; margin-top: 2vh;
@@ -320,4 +327,25 @@ footer a {
.projects-grid { .projects-grid {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
}
/* GitHub Contributions Calendar */
/* Hide broken statistics */
.github-calendar > :not(:first-child) {
display: none;
}
/* Hide the "How we calculate contributions" text */
.github-calendar .js-calendar-graph .width-full .float-left {
display: none;
}
/* Change title text */
.github-calendar table.js-calendar-graph-table > caption:first-child {
color: transparent;
font-size: 0;
}
.github-calendar table.js-calendar-graph-table > caption:first-child::before {
content: "GitHub Contributions Calendar";
color: var(--text-color);
font-size: 1rem;
} }