Skip to content

Commit fc5f55a

Browse files
jxmotjxmot
committed
initial commit, githubcorner.php, githubcorner.css
1 parent 5b80706 commit fc5f55a

2 files changed

Lines changed: 218 additions & 0 deletions

File tree

‎githubcorner.css‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
/*
2+
githubcorner.css - combined with HTML code this will create
3+
an "octocat" icon in the upper-right corner of a page.
4+
5+
Classes were originally obtained from -
6+
7+
https://github.com/tholman/github-corners
8+
9+
Modifications have been made.
10+
*/
11+
.github-corner-svg-right {
12+
right: 0;
13+
}
14+
15+
.github-corner-svg-left {
16+
left: 0;
17+
transform: scale(-1, 1);
18+
}
19+
20+
.github-corner-svg {
21+
position: absolute;
22+
top: 0;
23+
border: 0;
24+
}
25+
26+
.github-corner-link {
27+
text-decoration: none;
28+
background-color: transparent;
29+
}
30+
31+
.github-corner:hover .octo-arm {
32+
animation: octocat-wave 560ms ease-in-out;
33+
}
34+
35+
@keyframes octocat-wave {
36+
0% {
37+
transform: rotate(0deg);
38+
}
39+
40+
20% {
41+
transform: rotate(-25deg);
42+
}
43+
44+
40% {
45+
transform: rotate(10deg);
46+
}
47+
48+
60% {
49+
transform: rotate(-25deg);
50+
}
51+
52+
80% {
53+
transform: rotate(10deg);
54+
}
55+
56+
100% {
57+
transform: rotate(0deg);
58+
}
59+
}
60+
61+
@media (max-width: 500px) {
62+
.github-corner:hover .octo-arm {
63+
animation: none;
64+
}
65+
66+
.github-corner .octo-arm {
67+
animation: none;
68+
}
69+
}

‎githubcorner.php‎

Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
<?php
2+
/*
3+
https://github.com/jxmot/github-corners-php
4+
5+
6+
githubcorner.php - A wrapper around some HTML/CSS that will
7+
render a corner icon with an octocat in it. It is also a link
8+
to a specified GitHub repository.
9+
10+
The HTML/CSS code was originally found at -
11+
12+
https://github.com/tholman/github-corners
13+
14+
And has been modified to have the following features:
15+
16+
* Configurable via a text file -
17+
* corner side
18+
* background color
19+
* foreground color
20+
* CSS file
21+
* target repo
22+
* link title
23+
24+
Usage:
25+
26+
Neccessary files:
27+
* githubcorner.php (this file)
28+
* githubcorner.css (styling)
29+
* githubcorner.txt (configuration)
30+
31+
NOTE: All "paths" to files are relative to where
32+
this file is required by its host-file.
33+
34+
PHP -
35+
36+
// specifiy a config file
37+
$_SESSION['ghccfg'] = './githubcorner.txt';
38+
require_once './githubcorner.php';
39+
40+
41+
// specifiy a different config file
42+
$_SESSION['ghccfg'] = './someother.txt';
43+
require_once './githubcorner.php';
44+
45+
46+
// use the default config file
47+
require_once './githubcorner.php';
48+
49+
50+
// use the default config file, but over-ride
51+
// the colors
52+
$_SESSION['ghcfill'] = 'black';
53+
$_SESSION['ghccolor'] = '#00ff00';
54+
require_once './githubcorner.php';
55+
56+
57+
// specifiy a config file, and over-ride
58+
// the colors
59+
$_SESSION['ghccfg'] = './githubcorner.txt';
60+
$_SESSION['ghcfill'] = 'black';
61+
$_SESSION['ghccolor'] = '#00ff00';
62+
require_once './githubcorner.php';
63+
64+
*/
65+
66+
// get the config file name...
67+
$file = './githubcorner.txt';
68+
if(isset($_SESSION['ghccfg'])) {
69+
$file = $_SESSION['ghccfg'];
70+
}
71+
72+
// default values, used if there is no
73+
// config file present
74+
$css = './githubcorner.css';
75+
$side = 'right';
76+
$fill = 'purple';
77+
$color = 'white';
78+
$repo = 'https://github.com/';
79+
$linkmsg = 'View source on GitHub';
80+
81+
// read the config file if it exists, otherwise
82+
// use the defaults from above.
83+
if(file_exists($file)) {
84+
$fileid = fopen($file,'r');
85+
$ghcdata = fread($fileid,128);
86+
fclose($fileid);
87+
88+
list($css,$side,$fill,$color,$repo,$linkmsg) = explode(',', $ghcdata);
89+
}
90+
91+
/*
92+
Over-ride settings in githubcorner.txt or
93+
the defaults.
94+
*/
95+
if(isset($_SESSION['ghccss'])) {
96+
$css = $_SESSION['ghccss'];
97+
unset($_SESSION['ghccss']);
98+
}
99+
100+
if(isset($_SESSION['ghcside'])) {
101+
$side = $_SESSION['ghcside'];
102+
unset($_SESSION['ghcside']);
103+
}
104+
105+
if(isset($_SESSION['ghcfill'])) {
106+
$fill = $_SESSION['ghcfill'];
107+
unset($_SESSION['ghcfill']);
108+
}
109+
110+
if(isset($_SESSION['ghccolor'])) {
111+
$color = $_SESSION['ghccolor'];
112+
unset($_SESSION['ghccolor']);
113+
}
114+
115+
if(isset($_SESSION['ghcrepo'])) {
116+
$repo = $_SESSION['ghcrepo'];
117+
unset($_SESSION['ghcrepo']);
118+
}
119+
120+
if(isset($_SESSION['ghcmsg'])) {
121+
$linkmsg = $_SESSION['ghcmsg'];
122+
unset($_SESSION['ghcmsg']);
123+
}
124+
125+
// this will over-ride any CSS class influence
126+
$stylebg = 'style="fill:'.$fill.'!important;"';
127+
$styleco = 'color:'.$color.'!important;';
128+
$stylefg = 'style="color:'.$color.'!important;"';
129+
?>
130+
<!-- octocat in the corner
131+
132+
The code below is NOT the common code you
133+
find in their repo. This has been retrieved
134+
from a pull request, the change made causes
135+
the active area of the link to be a triangle
136+
and not a square that went beyond the icon.
137+
138+
https://github.com/tholman/github-corners/pull/41
139+
140+
-->
141+
<link rel="stylesheet" href="<?php echo $css; ?>"/>
142+
<svg class="github-corner-svg-<?php echo $side; ?> github-corner-svg" width="80" height="80" viewBox="0 0 250 250" aria-hidden="true">
143+
<a href="<?php echo $repo; ?>" target="_blank" class="github-corner-link github-corner" <?php echo $stylebg; ?> title="<?php echo $linkmsg; ?>">
144+
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
145+
<path fill="currentColor" class="octo-arm" style="transform-origin: 130px 106px; <?php echo $styleco; ?>" d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"></path>
146+
<path fill="currentColor" <?php echo $stylefg; ?> d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"></path>
147+
</a>
148+
</svg>
149+

0 commit comments

Comments
 (0)