forked from MarkoCen/github-flair
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
130 lines (118 loc) · 9.23 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta charset="utf-8">
<title>GitHub Flair, Github badge generator</title>
<meta name="description" content="Generate GitHub Flairs for Users and Organizations">
<meta name="keywords" content="GitHub, Flair, Generator, Um Anusorn">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/flatly/bootstrap.min.css">
<link rel="stylesheet" href="./page.css">
<link rel="icon" href="https://raw.githubusercontent.com/umanusorn/Github-Flair/master/favicon.ico" />
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-127068079-6"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-127068079-6');
</script>
<style>
label{
font-weight: initial;
}
</style>
</head>
<body class="container">
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.2&appId=635602246623472&autoLogAppEvents=1';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="row">
<div class="col-xs-12 text-center">
<h1 style="font-size: 4.5em;font-weight: bold;">GitHub Flair Generator</h1>
<h3 style="font-size: 1.5em;font-weight: bold;">
Create your own badge from your Github account. Improve your profile and engage easily!.
<a href="https://htmlpreview.github.com/?https://github.com/umanusorn/github-flair/blob/master/Github-Flair-Example.html">
Example</a></h3>
<div class="fb-like" data-href="https://githubflair.anusorn.app/" data-layout="standard" data-action="like" data-size="small" data-show-faces="true" data-share="true"></div>
</div>
</div>
</br>
<center>
<div class="github-flair" style="box-sizing: border-box; line-height: normal; display: flex; align-items: center; width: 290px; height: 95px; color: rgb(85, 85, 85); position: relative; border: 2px solid rgb(209, 213, 218); border-radius: 3px; padding: 5px 10px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";"><svg title="GitHub Flair" width="30" height="30" viewBox="0 0 250 250" style="fill: rgb(209, 213, 218); color: rgb(255, 255, 255); position: absolute; top: 0px; right: 0px; border: 0px;"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path 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" fill="currentColor"></path></svg><div class="avatar" style="text-align: center; position: relative; width: 75px; height: 75px; margin-left: 5px;"><a href="https://github.com/github" target="_blank"><img src="https://avatars1.githubusercontent.com/u/9919?v=4" alt="Profile Avatar" style="width: 100%; height: 100%; border-radius: 50%;"></a></div><div class="info" style="width: 160px; text-align: right; font-size: 14px;"><div class="user-profile-bio"><span> How people build software.</span></div><div class="meta"><span title="Followers"><svg height="12" viewBox="0 0 16 16" width="12" style="fill: rgb(85, 85, 85);"><path fill-rule="evenodd" d="M16 12.999c0 .439-.45 1-1 1H7.995c-.539 0-.994-.447-.995-.999H1c-.54 0-1-.561-1-1 0-2.634 3-4 3-4s.229-.409 0-1c-.841-.621-1.058-.59-1-3 .058-2.419 1.367-3 2.5-3s2.442.58 2.5 3c.058 2.41-.159 2.379-1 3-.229.59 0 1 0 1s1.549.711 2.42 2.088C9.196 9.369 10 8.999 10 8.999s.229-.409 0-1c-.841-.62-1.058-.59-1-3 .058-2.419 1.367-3 2.5-3s2.437.581 2.495 3c.059 2.41-.158 2.38-1 3-.229.59 0 1 0 1s3.005 1.366 3.005 4"></path></svg> 0 </span><span title="Total Public Repositories"><svg height="12" viewBox="0 0 12 16" width="12" style="fill: rgb(85, 85, 85);"><path fill-rule="evenodd" d="M4 9H3V8h1v1zm0-3H3v1h1V6zm0-2H3v1h1V4zm0-2H3v1h1V2zm8-1v12c0 .55-.45 1-1 1H6v2l-1.5-1.5L3 16v-2H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h10c.55 0 1 .45 1 1zm-1 10H1v2h2v-1h3v1h5v-2zm0-10H2v9h9V1z"></path></svg> 289 </span><span title="Total Public Gists"><svg height="12" viewBox="0 0 12 16" width="12" style="fill: rgb(85, 85, 85);"><path fill-rule="evenodd" d="M7.5 5L10 7.5 7.5 10l-.75-.75L8.5 7.5 6.75 5.75 7.5 5zm-3 0L2 7.5 4.5 10l.75-.75L3.5 7.5l1.75-1.75L4.5 5zM0 13V2c0-.55.45-1 1-1h10c.55 0 1 .45 1 1v11c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1zm1 0h10V2H1v11z"></path></svg> 0</span></div><div class="location"><svg height="12" viewBox="0 0 12 16" width="12" style="fill: rgb(85, 85, 85);"><path fill-rule="evenodd" d="M6 0C2.69 0 0 2.5 0 5.5 0 10.02 6 16 6 16s6-5.98 6-10.5C12 2.5 9.31 0 6 0zm0 14.55C4.14 12.52 1 8.44 1 5.5 1 3.02 3.25 1 6 1c1.34 0 2.61.48 3.56 1.36.92.86 1.44 1.97 1.44 3.14 0 2.94-3.14 7.02-5 9.05zM8 5.5c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"></path></svg><span> San Francisco, CA</span></div><div class="blog"><a href="https://github.com/about" target="_blank" style="color: rgb(85, 85, 85);">Website</a></div></div></div> </center>
</br>
<div class="row">
<div class="col-xs-7 col-xs-offset-2">
<input class="form-control username" type="text" placeholder="GitHub Username or Organization ID">
</div>
<div class="col-xs-2">
<button class="btn btn-info generate">Generate</button>
</div>
</div>
<br>
<div class="row">
<div class="col-xs-7 col-xs-offset-2">
<label><input type="checkbox" checked class="display-round-avatar"> Round Avatar </label>
<label><input type="checkbox" class="display-rainbow"> Rainbow Avatar </label>
</div>
</div>
<br>
<div class="row">
<div class="col-xs-7 col-xs-offset-2">
<label><input type="checkbox" checked class="display-bio-info"> Display Info </label>
<label><input type="checkbox" checked class="display-followers"> Display Followers </label>
<label><input type="checkbox" checked class="display-location"> Display Location </label>
<label><input type="checkbox" checked class="display-website"> Display Blog/Website </label>
</div>
</div>
<br>
<div class="row">
<div class="col-xs-7 col-xs-offset-2">
<label><input type="checkbox" checked class="display-flair-corner"> Show Flair Corner </label>
<select name="select-icon" id="display-flair-corner-option" class="form-control" style="display: inline-block;width: 150px;">
<option value="DEFAULT">Default icon</option>
<option value="CODE">Icon #1</option>
<option value="BUG">Icon #2</option>
</select>
</div>
</div>
<br>
<div class="row">
<div class="col-xs-12 col-md-7 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-body">
<ul>
<li>Enter your GitHub username or organization id to generate flairs</li>
<li>Any update or contributors are welcome <a href="https://github.com/umanusorn/github-flair">Fork Me</a></li>
<li>Theme PRs are welcome at <a href="https://github.com/markocen/github-flair">here</a></li>
<li>Due to high traffic, this website may reach <a href="https://developer.github.com/v3/#rate-limiting">GitHub unauthorized API rate limit</a>
<li>It's useful? Be a supporter
<a href="https://www.paypal.me/umanusorn">
<img src="https://img.shields.io/badge/Donate-PayPal-green.svg" alt="If this project help you reduce time to develop, you can give me a cup of coffee :)" >
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="author">
<label>By
<a href="https://um.anusorn.app/">UmAnusorn</a></label>
</br>
<a href="http://markocen.com">MarkoCen</a></label>
</div>
<div class="row flair-container"></div>
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
<script src="./flairStyles.js"></script>
<script src="./script.js"></script>
</body>
</html>