-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
93 lines (87 loc) · 15.1 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Github Profile Generator</title>
<link rel="stylesheet" href="style.css">
<meta name="theme-color" content="#3B82F6" />
</head>
<body>
<div class="container form">
<div class="loader">
<div></div>
<div></div>
</div>
<div class="form-box">
<div class="column">
<div class="form-text">
<h2 class="form-h2">Hey buddy ;)</h2>
<p class="form-p">Enter your github username</p>
</div>
<div class="gp-img">
<img src="img/man.svg" class="man">
</div>
<div class="form-field">
<input type="text" name="username" id="username" placeholder="Github username (without @)">
<p class="eror">:)</p>
</div>
<div class="form-btn">
<div class="btn-container">
<button class="btn" id="space-btn" name="space-button" type="submit">
<span>Let's Go</span>
<div style="position: absolute; left: 119.273px; top: 18.0747px; animation-delay: 3.37051s; transform: scale(0.196521);" class="star"></div><div style="position: absolute; left: 166.774px; top: 47.4519px; animation-delay: 3.03913s; transform: scale(0.33078);" class="star"></div><div style="position: absolute; left: 238.677px; top: 19.6434px; animation-delay: 3.85796s; transform: scale(1.29037);" class="star"></div><div style="position: absolute; left: 22.2022px; top: 4.69534px; animation-delay: 4.9415s; transform: scale(1.82231);" class="star"></div><div style="position: absolute; left: 206.74px; top: 40.7685px; animation-delay: 1.59195s; transform: scale(1.01375);" class="star"></div><div style="position: absolute; left: 241.531px; top: 14.2516px; animation-delay: 1.67616s; transform: scale(0.811597);" class="star"></div><div style="position: absolute; left: 14.754px; top: 25.2924px; animation-delay: 0.0348248s; transform: scale(0.102529);" class="star"></div><div style="position: absolute; left: 220.444px; top: 43.9803px; animation-delay: 1.5106s; transform: scale(0.16088);" class="star"></div><div style="position: absolute; left: 95.948px; top: 54.8942px; animation-delay: 3.18662s; transform: scale(1.7822);" class="star"></div><div style="position: absolute; left: 30.3484px; top: 36.5984px; animation-delay: 4.30868s; transform: scale(1.16326);" class="star"></div><div style="position: absolute; left: 184.622px; top: 20.0923px; animation-delay: 2.83829s; transform: scale(1.27781);" class="star"></div><div style="position: absolute; left: 142.1px; top: 22.3542px; animation-delay: 2.73988s; transform: scale(1.62715);" class="star"></div><div style="position: absolute; left: 145.079px; top: 6.97553px; animation-delay: 0.0408754s; transform: scale(0.468075);" class="star"></div><div style="position: absolute; left: 6.67886px; top: 38.4849px; animation-delay: 3.84019s; transform: scale(0.272217);" class="star"></div><div style="position: absolute; left: 201.17px; top: 39.9168px; animation-delay: 2.93587s; transform: scale(0.521258);" class="star"></div><div style="position: absolute; left: 224.215px; top: 42.9903px; animation-delay: 0.895495s; transform: scale(0.0458902);" class="star"></div><div style="position: absolute; left: 42.2308px; top: 9.78383px; animation-delay: 4.58407s; transform: scale(0.0422065);" class="star"></div><div style="position: absolute; left: 91.2734px; top: 14.0408px; animation-delay: 2.05927s; transform: scale(0.11997);" class="star"></div><div style="position: absolute; left: 35.6985px; top: 52.6403px; animation-delay: 3.07343s; transform: scale(0.672992);" class="star"></div><div style="position: absolute; left: 76.4191px; top: 48.453px; animation-delay: 2.35679s; transform: scale(1.46957);" class="star"></div><div style="position: absolute; left: 184.503px; top: 4.18267px; animation-delay: 1.43409s; transform: scale(0.606616);" class="star"></div><div style="position: absolute; left: 221.039px; top: 54.2493px; animation-delay: 2.92356s; transform: scale(0.638665);" class="star"></div><div style="position: absolute; left: 185.612px; top: 44.3px; animation-delay: 1.36401s; transform: scale(1.65012);" class="star"></div><div style="position: absolute; left: 154.027px; top: 45.9848px; animation-delay: 3.723s; transform: scale(1.4118);" class="star"></div><div style="position: absolute; left: 220.591px; top: 4.95194px; animation-delay: 0.363098s; transform: scale(0.52369);" class="star"></div><div style="position: absolute; left: 236.028px; top: 11.1663px; animation-delay: 3.67493s; transform: scale(0.956478);" class="star"></div><div style="position: absolute; left: 110.241px; top: 20.2684px; animation-delay: 2.94906s; transform: scale(1.2193);" class="star"></div><div style="position: absolute; left: 12.602px; top: 19.8836px; animation-delay: 4.072s; transform: scale(1.49026);" class="star"></div><div style="position: absolute; left: 30.0911px; top: 37.9746px; animation-delay: 1.02002s; transform: scale(1.41008);" class="star"></div><div style="position: absolute; left: 62.3096px; top: 9.64604px; animation-delay: 3.9445s; transform: scale(0.231214);" class="star"></div><div style="position: absolute; left: 44.7189px; top: 32.4307px; animation-delay: 4.78921s; transform: scale(0.359408);" class="star"></div><div style="position: absolute; left: 191.866px; top: 27.151px; animation-delay: 1.34451s; transform: scale(1.13484);" class="star"></div><div style="position: absolute; left: 47.6744px; top: 3.00604px; animation-delay: 1.04567s; transform: scale(0.682023);" class="star"></div><div style="position: absolute; left: 98.6225px; top: 49.6115px; animation-delay: 2.41384s; transform: scale(1.96254);" class="star"></div><div style="position: absolute; left: 57.4785px; top: 29.6588px; animation-delay: 3.3569s; transform: scale(1.53118);" class="star"></div><div style="position: absolute; left: 13.2213px; top: 24.538px; animation-delay: 1.69582s; transform: scale(1.6236);" class="star"></div><div style="position: absolute; left: 131.656px; top: 31.1837px; animation-delay: 1.29918s; transform: scale(1.84486);" class="star"></div><div style="position: absolute; left: 56.9067px; top: 51.9904px; animation-delay: 4.74375s; transform: scale(0.749788);" class="star"></div><div style="position: absolute; left: 82.8361px; top: 54.3876px; animation-delay: 1.28648s; transform: scale(0.566118);" class="star"></div><div style="position: absolute; left: 193.213px; top: 43.9428px; animation-delay: 0.390178s; transform: scale(1.411);" class="star"></div><div style="animation-delay: 1.2122s;" class="shooting-star shooting-star-1"></div><div style="animation-delay: 0.777895s;" class="shooting-star shooting-star-2"></div><div style="animation-delay: 4.90483s;" class="shooting-star shooting-star-3"></div><div style="animation-delay: 3.66012s;" class="shooting-star shooting-star-4"></div></button>
</div>
</div>
</div>
</div>
</div>
<div class="container profile">
<div class="profile-box">
<div class="column">
<div class="bg-stars"></div>
<div class="github-user">
<div class="github-section">
<div class="profile-pic">
<img src="https://avatars.githubusercontent.com/u/70168399?v=4" class="avatar" id="pic">
</div>
<div class="user-info">
<div class="name-section">
<h3 id="fname">Mahyar</h3>
</div>
<div class="username-section">
<p class="id">@Mhyar-nsi</p>
</div>
<div class="bio-section">
<p id="bio">20 years old from iran/karaj, FullStack developer (css/js/php)</p>
</div>
</div>
<div class="column">
<div class="user-follow row">
<div class="followers column">
<p>Followers</p>
<p class="number fols">190</p>
</div>
<div class="following column">
<p>Following</p>
<p class="number folg">180</p>
</div>
</div>
<a href="" target="_blank" id="github-url">
<div class="go-github">
<div class="btn-container">
<button class="btn" id="space-btn" name="space-button" type="submit">
<span>View Github</span>
<div style="position: absolute; left: 119.273px; top: 18.0747px; animation-delay: 3.37051s; transform: scale(0.196521);" class="star"></div><div style="position: absolute; left: 166.774px; top: 47.4519px; animation-delay: 3.03913s; transform: scale(0.33078);" class="star"></div><div style="position: absolute; left: 238.677px; top: 19.6434px; animation-delay: 3.85796s; transform: scale(1.29037);" class="star"></div><div style="position: absolute; left: 22.2022px; top: 4.69534px; animation-delay: 4.9415s; transform: scale(1.82231);" class="star"></div><div style="position: absolute; left: 206.74px; top: 40.7685px; animation-delay: 1.59195s; transform: scale(1.01375);" class="star"></div><div style="position: absolute; left: 241.531px; top: 14.2516px; animation-delay: 1.67616s; transform: scale(0.811597);" class="star"></div><div style="position: absolute; left: 14.754px; top: 25.2924px; animation-delay: 0.0348248s; transform: scale(0.102529);" class="star"></div><div style="position: absolute; left: 220.444px; top: 43.9803px; animation-delay: 1.5106s; transform: scale(0.16088);" class="star"></div><div style="position: absolute; left: 95.948px; top: 54.8942px; animation-delay: 3.18662s; transform: scale(1.7822);" class="star"></div><div style="position: absolute; left: 30.3484px; top: 36.5984px; animation-delay: 4.30868s; transform: scale(1.16326);" class="star"></div><div style="position: absolute; left: 184.622px; top: 20.0923px; animation-delay: 2.83829s; transform: scale(1.27781);" class="star"></div><div style="position: absolute; left: 142.1px; top: 22.3542px; animation-delay: 2.73988s; transform: scale(1.62715);" class="star"></div><div style="position: absolute; left: 145.079px; top: 6.97553px; animation-delay: 0.0408754s; transform: scale(0.468075);" class="star"></div><div style="position: absolute; left: 6.67886px; top: 38.4849px; animation-delay: 3.84019s; transform: scale(0.272217);" class="star"></div><div style="position: absolute; left: 201.17px; top: 39.9168px; animation-delay: 2.93587s; transform: scale(0.521258);" class="star"></div><div style="position: absolute; left: 224.215px; top: 42.9903px; animation-delay: 0.895495s; transform: scale(0.0458902);" class="star"></div><div style="position: absolute; left: 42.2308px; top: 9.78383px; animation-delay: 4.58407s; transform: scale(0.0422065);" class="star"></div><div style="position: absolute; left: 91.2734px; top: 14.0408px; animation-delay: 2.05927s; transform: scale(0.11997);" class="star"></div><div style="position: absolute; left: 35.6985px; top: 52.6403px; animation-delay: 3.07343s; transform: scale(0.672992);" class="star"></div><div style="position: absolute; left: 76.4191px; top: 48.453px; animation-delay: 2.35679s; transform: scale(1.46957);" class="star"></div><div style="position: absolute; left: 184.503px; top: 4.18267px; animation-delay: 1.43409s; transform: scale(0.606616);" class="star"></div><div style="position: absolute; left: 221.039px; top: 54.2493px; animation-delay: 2.92356s; transform: scale(0.638665);" class="star"></div><div style="position: absolute; left: 185.612px; top: 44.3px; animation-delay: 1.36401s; transform: scale(1.65012);" class="star"></div><div style="position: absolute; left: 154.027px; top: 45.9848px; animation-delay: 3.723s; transform: scale(1.4118);" class="star"></div><div style="position: absolute; left: 220.591px; top: 4.95194px; animation-delay: 0.363098s; transform: scale(0.52369);" class="star"></div><div style="position: absolute; left: 236.028px; top: 11.1663px; animation-delay: 3.67493s; transform: scale(0.956478);" class="star"></div><div style="position: absolute; left: 110.241px; top: 20.2684px; animation-delay: 2.94906s; transform: scale(1.2193);" class="star"></div><div style="position: absolute; left: 12.602px; top: 19.8836px; animation-delay: 4.072s; transform: scale(1.49026);" class="star"></div><div style="position: absolute; left: 30.0911px; top: 37.9746px; animation-delay: 1.02002s; transform: scale(1.41008);" class="star"></div><div style="position: absolute; left: 62.3096px; top: 9.64604px; animation-delay: 3.9445s; transform: scale(0.231214);" class="star"></div><div style="position: absolute; left: 44.7189px; top: 32.4307px; animation-delay: 4.78921s; transform: scale(0.359408);" class="star"></div><div style="position: absolute; left: 191.866px; top: 27.151px; animation-delay: 1.34451s; transform: scale(1.13484);" class="star"></div><div style="position: absolute; left: 47.6744px; top: 3.00604px; animation-delay: 1.04567s; transform: scale(0.682023);" class="star"></div><div style="position: absolute; left: 98.6225px; top: 49.6115px; animation-delay: 2.41384s; transform: scale(1.96254);" class="star"></div><div style="position: absolute; left: 57.4785px; top: 29.6588px; animation-delay: 3.3569s; transform: scale(1.53118);" class="star"></div><div style="position: absolute; left: 13.2213px; top: 24.538px; animation-delay: 1.69582s; transform: scale(1.6236);" class="star"></div><div style="position: absolute; left: 131.656px; top: 31.1837px; animation-delay: 1.29918s; transform: scale(1.84486);" class="star"></div><div style="position: absolute; left: 56.9067px; top: 51.9904px; animation-delay: 4.74375s; transform: scale(0.749788);" class="star"></div><div style="position: absolute; left: 82.8361px; top: 54.3876px; animation-delay: 1.28648s; transform: scale(0.566118);" class="star"></div><div style="position: absolute; left: 193.213px; top: 43.9428px; animation-delay: 0.390178s; transform: scale(1.411);" class="star"></div><div style="animation-delay: 1.2122s;" class="shooting-star shooting-star-1"></div><div style="animation-delay: 0.777895s;" class="shooting-star shooting-star-2"></div><div style="animation-delay: 4.90483s;" class="shooting-star shooting-star-3"></div><div style="animation-delay: 3.66012s;" class="shooting-star shooting-star-4"></div></button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="script.js"></script>
</body>
</html>