-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
146 lines (137 loc) · 7.04 KB
/
Copy pathindex.html
File metadata and controls
146 lines (137 loc) · 7.04 KB
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
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="google-site-verification" content="adrkfgzE87F-Je0GEGXdtOWqtr8chR8EglH9sfNvvSg" />
<title>GitHub Profile Analyzer</title>
<link rel="stylesheet" href="styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
</head>
<body>
<nav class="navbar">
<div class="nav-container">
<div class="nav-brand">
<h2 class="nav-title">GitHub Analyzer</h2>
</div>
<div class="nav-links">
<a href="https://noah-khomer.com" target="_blank" rel="noopener noreferrer" class="nav-link">Portfolio</a>
<a href="https://github.com/noahkhomer18" target="_blank" rel="noopener noreferrer" class="nav-link">GitHub</a>
<a href="https://www.linkedin.com/in/noah-khomer-19a935342" target="_blank" rel="noopener noreferrer" class="nav-link">LinkedIn</a>
</div>
</div>
</nav>
<div class="container">
<header class="header">
<h1 class="title">GitHub Profile Analyzer</h1>
<p class="subtitle">Discover insights about any GitHub user's profile and tech stack</p>
</header>
<main class="main">
<div class="search-section">
<div class="search-container">
<input
type="text"
id="username-input"
class="search-input"
placeholder="Enter GitHub username..."
autocomplete="off"
>
<button id="search-btn" class="search-button">
<svg class="search-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="11" cy="11" r="8"></circle>
<path d="m21 21-4.35-4.35"></path>
</svg>
Analyze
</button>
</div>
<div class="search-hint">
<span>For example: </span>
<span class="example-username">noahkhomer18</span>
</div>
</div>
<div id="loading" class="loading hidden">
<div class="spinner"></div>
<p>Analyzing profile...</p>
</div>
<div id="error" class="error hidden">
<div class="error-icon">⚠️</div>
<h3>Error</h3>
<p id="error-message"></p>
</div>
<div id="profile-section" class="profile-section hidden">
<div class="profile-card">
<div class="profile-header">
<img id="avatar" class="avatar" src="" alt="Profile Avatar">
<div class="profile-info">
<h2 id="display-name" class="display-name"></h2>
<p id="username" class="username"></p>
<p id="bio" class="bio"></p>
<div class="profile-stats">
<div class="stat">
<span class="stat-number" id="followers-count">0</span>
<span class="stat-label">Followers</span>
</div>
<div class="stat">
<span class="stat-number" id="following-count">0</span>
<span class="stat-label">Following</span>
</div>
<div class="stat">
<span class="stat-number" id="repos-count">0</span>
<span class="stat-label">Repositories</span>
</div>
</div>
</div>
</div>
</div>
<div class="tech-stack-section">
<h3 class="section-title">Tech Stack Analysis</h3>
<div id="tech-stack" class="tech-stack-grid"></div>
</div>
<div class="repositories-section">
<h3 class="section-title">Top Repositories</h3>
<div id="repositories" class="repositories-grid"></div>
</div>
</div>
</main>
</div>
<footer class="footer">
<div class="footer-content">
<div class="footer-section">
<h3 class="footer-title">GitHub Profile Analyzer</h3>
<p class="footer-description">A modern tool to analyze GitHub profiles and tech stacks</p>
</div>
<div class="footer-section">
<h4 class="footer-subtitle">Connect</h4>
<div class="footer-links">
<a href="https://noah-khomer.com" target="_blank" rel="noopener noreferrer" class="footer-link">
<svg class="footer-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/>
</svg>
Portfolio
</a>
<a href="https://github.com/noahkhomer18" target="_blank" rel="noopener noreferrer" class="footer-link">
<svg class="footer-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"/>
</svg>
GitHub
</a>
<a href="https://www.linkedin.com/in/noah-khomer-19a935342" target="_blank" rel="noopener noreferrer" class="footer-link">
<svg class="footer-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/>
<rect x="2" y="9" width="4" height="12"/>
<circle cx="4" cy="4" r="2"/>
</svg>
LinkedIn
</a>
</div>
</div>
</div>
<div class="footer-bottom">
<p>Built with ❤️ using GitHub API | © 2025 Noah Khomer</p>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>