Skip to content

Commit

Permalink
Add a lovely fork me on GitHub logo to the GitHub page
Browse files Browse the repository at this point in the history
  • Loading branch information
orzechow committed Nov 28, 2024
1 parent 3047e01 commit f743464
Show file tree
Hide file tree
Showing 4 changed files with 79 additions and 2 deletions.
27 changes: 27 additions & 0 deletions docs/_includes/github-corner.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<a href="{{ site.github.repository_url }}" class="github-corner" aria-label="View source on GitHub">
<svg
width="80"
height="80"
viewBox="0 0 250 250"
fill="#ffffff"
style="position: absolute; top: 0; right: 0"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs>
<clipPath
id="octo-arm-clip">
<path
style="-webkit-transform-origin: 130px 104px; transform-origin: 130px 104px"
d="M 130.5481,-165.77759 A 270.05054,270.05054 0 0 0 -139.50195,104.27246 270.05054,270.05054 0 0 0 130.5481,374.3225 270.05054,270.05054 0 0 0 400.59812,104.27246 270.05054,270.05054 0 0 0 130.5481,-165.77759 Z M 120.42236,72.766113 c 0.93743,-0.0063 2.26441,1.324462 2.26441,1.324462 4.05178,4.625078 2.17285,11.053469 2.17285,11.053469 -2.75131,10.431043 5.29968,14.758393 8.93555,16.101076 5.19351,1.3916 1.84837,10.58498 -6.30494,5.87768 -14.52942,-9.369731 -9.27734,-19.598387 -9.27734,-19.598387 3.0951,-6.935854 1.53809,-11.071776 1.53809,-11.071776 -0.55126,-2.870943 -0.0577,-3.681671 0.67138,-3.686524 z"
class="octo-arm" />
</clipPath>
</defs>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M 250,0 H 0 l 114.46087,114.46086 c 2.33873,2.33874 3.92868,1.90279 5.0744,0.75707 1.00327,-1.00327 4.37184,-4.51252 7.95495,-8.09564 6.30277,-5.87719 0,0 6.30277,-5.87719 3.14963,-2.43916 6.22275,-3.234915 8.50628,-3.100385 -8.52737,-10.53392 -14.82926,-24.286929 1.79375,-40.909948 4.72883,-4.728834 10.30355,-6.891897 16.01543,-7.197887 0.64804,-1.500951 3.59718,-7.437935 11.89155,-11.036879 0,0 4.77368,2.480486 7.36319,16.247564 4.44872,2.554126 8.54157,5.683184 12.17292,9.306429 3.62708,3.627081 6.82243,7.826577 9.30555,12.172039 13.76795,2.590399 16.24844,7.364073 16.24844,7.364073 -3.59894,8.294366 -9.5368,11.24263 -11.03775,11.890669 -0.23476,5.783105 -2.46817,11.287475 -7.19701,16.016305 -16.62302,16.62303 -30.30393,10.24904 -40.98117,1.72254 0.20399,2.92628 -1.02437,6.85583 -5.10869,10.94015 -5.80333,5.80333 -10.53128,10.3906 -11.96365,11.82297 -1.1466,1.1466 -1.5754,2.74368 0.75619,5.07527 L 250,250 Z"
id="octo-cutout"
clip-path="url(#octo-arm-clip)" />
</svg>
</a>
7 changes: 5 additions & 2 deletions docs/_layouts/default.html
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@
<body>
<a id="skip-to-content" href="#content">Skip to the content.</a>

{% include github-corner.html %}

<header class="page-header" role="banner">
<h1 class="project-name">{{ page.title | default: site.title | default: site.github.repository_name }}</h1>
<h2 class="project-tagline">{{ page.description | default: site.description | default: site.github.project_tagline }}</h2>
Expand Down Expand Up @@ -85,9 +87,10 @@ <h2 class="project-tagline">{{ page.description | default: site.description | de
<a href="https://github.com/allejo/jekyll-toc">allejo/jekyll-toc</a> and
<br>
snippets from
<a href="https://www.bram.us/2020/01/10/smooth-scrolling-sticky-scrollspy-navigation/">Bram.us</a>
as well as
<a href="https://www.bram.us/2020/01/10/smooth-scrolling-sticky-scrollspy-navigation/">Bram.us</a>,
<a href="https://github.com/davidensinger/davidensinger.github.io">David Ensinger</a></span>
as well as
<a href="https://github.com/tholman/github-corners">Tim Holman</a></span>
❤️
</span>
</footer>
Expand Down
43 changes: 43 additions & 0 deletions docs/assets/_sass/github-corner.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
.github-corner svg {
clip-path: polygon(0 0, 100% 0, 100% 100%);
}

.github-corner:hover .octo-arm {
animation: octocat-wave 560ms ease-in-out;
}

@keyframes octocat-wave {
0% {
transform: rotate(0deg);
}

20% {
transform: rotate(-25deg);
}

40% {
transform: rotate(10deg);
}

60% {
transform: rotate(-25deg);
}

80% {
transform: rotate(10deg);
}

100% {
transform: rotate(0deg);
}
}

@media (max-width: 500px) {
.github-corner:hover .octo-arm {
animation: none;
}

.github-corner .octo-arm {
animation: octocat-wave 560ms ease-in-out;
}
}
4 changes: 4 additions & 0 deletions docs/assets/css/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,10 @@
// Add table of contents navbar
@import 'toc';

// Style GitHub octocat corner logo
@import 'github-corner';


#page-container {
background-color: $section-bg-color;
}
Expand Down

0 comments on commit f743464

Please sign in to comment.