Skip to content

Commit ada6a63

Browse files
hnaamdev41hnaamdev41
committed
Fixes
1 parent bc68ee0 commit ada6a63

File tree

7 files changed

+335
-180
lines changed

7 files changed

+335
-180
lines changed

‎package-lock.json‎

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/App.js‎

Lines changed: 70 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -3,75 +3,102 @@ import { VSCodeTabs, Minimap } from './components/VSCodeTabs';
33
import ProjectDetails from './components/ProjectDetails';
44
import ContactSection from './components/ContactSection';
55
import GithubStats from './components/GithubStats';
6+
import HomeSection from './components/HomeSection';
67
import {
78
Folder, ChevronRight, ChevronDown, Code, Home,
8-
Mail, FolderOpen, Sun, Moon
9+
Mail, FolderOpen, Sun, Moon, User
910
} from 'lucide-react';
1011

1112
const App = () => {
1213
const [isExpanded, setIsExpanded] = useState(true);
13-
const [activeTab, setActiveTab] = useState('dashboard');
14+
const [activeTab, setActiveTab] = useState('home');
1415
const [isDark, setIsDark] = useState(true);
1516

16-
const githubStats = {
17-
commits: 523,
18-
stars: 128,
19-
forks: 34,
20-
views: 1243,
21-
languages: {
22-
JavaScript: 45,
23-
TypeScript: 30,
24-
Python: 15,
25-
CSS: 10
26-
}
27-
};
28-
2917
const projects = [
3018
{
3119
name: 'Cat Finding 2024',
3220
tech: 'React Native, Node.js, MongoDB',
3321
description: 'A mobile application to help locate and rescue stray cats',
22+
year: '2024',
3423
timeline: [
35-
{ date: 'January 2024', update: 'Initial Release' },
36-
{ date: 'February 2024', update: 'Added real-time location tracking' },
37-
{ date: 'March 2024', update: 'Implemented community features' },
38-
{ date: 'April 2024', update: 'Added cat recognition AI' }
24+
{ date: 'January 2024', update: 'Initial Release with basic cat location tracking' },
25+
{ date: 'February 2024', update: 'Added real-time location updates and notifications' },
26+
{ date: 'March 2024', update: 'Implemented community features and chat system' },
27+
{ date: 'April 2024', update: 'Integrated AI-powered cat recognition and health assessment' }
3928
],
4029
tags: ['mobile', 'web', 'ai'],
41-
github: 'https://github.com/yourusername/cat-finding',
42-
demo: 'https://cat-finding-demo.com',
30+
github: 'https://github.com/hnaamdev41/cat-finding',
31+
images: [
32+
'/assets/cat-finding-1.jpg',
33+
'/assets/cat-finding-2.jpg'
34+
],
4335
status: 'active'
4436
},
4537
{
4638
name: 'Pokemon Telegram Bot',
4739
tech: 'Python, Telegram API, JSON',
48-
description: 'A Telegram bot that provides Pokemon information and features',
40+
description: 'A comprehensive Telegram bot that provides Pokemon information, battle simulation, and team building features',
4941
year: '2023',
5042
tags: ['bot', 'ai'],
51-
github: 'https://github.com/yourusername/pokemon-bot',
43+
github: 'https://github.com/hnaamdev41/pokemon-bot',
44+
images: [
45+
'/assets/pokemon-1.jpg',
46+
'/assets/pokemon-2.jpg'
47+
],
5248
status: 'completed'
5349
},
5450
{
5551
name: 'Solo Levelling RPG Game',
5652
tech: 'Python, Discord API, JSON',
57-
description: 'A Discord-based RPG game inspired by Solo Levelling manhwa',
53+
description: 'A Discord-based RPG game inspired by Solo Levelling manhwa, featuring character progression, monster hunting, and guild systems',
5854
year: '2021',
5955
tags: ['game', 'bot'],
60-
github: 'https://github.com/yourusername/solo-level',
56+
github: 'https://github.com/hnaamdev41/solo-level',
57+
images: [
58+
'/assets/solo-1.jpg',
59+
'/assets/solo-2.jpg'
60+
],
6161
status: 'completed'
6262
},
6363
{
6464
name: 'Custom ROM Development',
6565
tech: 'Android, Java, Shell Scripting',
66-
description: 'Custom Android ROM development with enhanced features',
67-
year: '2021',
66+
description: 'Custom Android ROM development focusing on performance optimization, battery life improvement, and enhanced user experience. Custom ROMs are modified versions of Android that offer additional features, better performance, and more customization options compared to stock Android.',
67+
year: '2021-2024',
6868
tags: ['mobile', 'system'],
69-
github: 'https://github.com/yourusername/custom-rom',
70-
status: 'archived'
69+
github: 'https://github.com/hnaamdev41/android_device_xiaomi_violet',
70+
images: [
71+
'/assets/rom-1.jpg',
72+
'/assets/rom-2.jpg'
73+
],
74+
status: 'active',
75+
devices: [
76+
{
77+
name: 'Redmi Note 7 Pro',
78+
codename: 'violet',
79+
repo: 'https://github.com/hnaamdev41/android_device_xiaomi_violet'
80+
},
81+
{
82+
name: 'Poco X3',
83+
codename: 'surya/karna',
84+
repo: 'https://github.com/hnaamdev41/android_device_xiaomi_surya'
85+
},
86+
{
87+
name: 'Redmi Note 8 Pro',
88+
codename: 'begonia',
89+
repo: 'https://github.com/hnaamdev41/android_device_xiaomi_begonia'
90+
},
91+
{
92+
name: 'Poco F3/Mi 11x',
93+
codename: 'alioth/aliothin',
94+
repo: 'https://github.com/hnaamdev41/android_device_xiaomi_alioth'
95+
}
96+
]
7197
}
7298
];
7399

74100
const [tabs, setTabs] = useState([
101+
{ id: 'home', title: 'Home', type: 'home' },
75102
{ id: 'dashboard', title: 'Dashboard', type: 'dashboard' }
76103
]);
77104

@@ -108,8 +135,10 @@ const App = () => {
108135
}
109136

110137
switch (activeTab) {
138+
case 'home':
139+
return <HomeSection isDark={isDark} />;
111140
case 'dashboard':
112-
return <GithubStats stats={githubStats} isDark={isDark} />;
141+
return <GithubStats isDark={isDark} />;
113142
case 'contact':
114143
return <ContactSection isDark={isDark} />;
115144
default:
@@ -118,7 +147,7 @@ const App = () => {
118147
};
119148

120149
return (
121-
<div className={`h-screen ${isDark ? 'bg-gray-900' : 'bg-white'} ${isDark ? 'text-gray-300' : 'text-gray-800'}`}>
150+
<div className={`min-h-screen ${isDark ? 'bg-gray-900' : 'bg-white'} ${isDark ? 'text-gray-300' : 'text-gray-800'}`}>
122151
{/* VS Code Top Bar */}
123152
<div className={`absolute top-0 left-0 right-0 h-6 ${isDark ? 'bg-gray-900' : 'bg-gray-100'} flex items-center px-4 border-b ${isDark ? 'border-gray-700' : 'border-gray-300'}`}>
124153
<div className="flex space-x-2">
@@ -142,7 +171,7 @@ const App = () => {
142171
{/* Main Content */}
143172
<div className="flex w-full pt-6">
144173
{/* Left Sidebar */}
145-
<div className={`w-64 border-r ${isDark ? 'border-gray-700' : 'border-gray-200'}`}>
174+
<div className={`w-64 border-r ${isDark ? 'border-gray-700 bg-gray-900' : 'border-gray-200 bg-white'}`}>
146175
<div className="p-2">
147176
<div
148177
className="flex items-center p-1 rounded cursor-pointer"
@@ -155,6 +184,14 @@ const App = () => {
155184

156185
{isExpanded && (
157186
<div className="ml-4 space-y-1">
187+
<div
188+
className={`flex items-center p-1 rounded cursor-pointer ${activeTab === 'home' ? 'bg-gray-800' : ''}`}
189+
onClick={() => handleTabClick('home')}
190+
>
191+
<User size={16} className="mr-2 text-purple-400" />
192+
<span>home</span>
193+
</div>
194+
158195
<div
159196
className={`flex items-center p-1 rounded cursor-pointer ${activeTab === 'dashboard' ? 'bg-gray-800' : ''}`}
160197
onClick={() => handleTabClick('dashboard')}
@@ -207,7 +244,7 @@ const App = () => {
207244
isDark={isDark}
208245
/>
209246

210-
<div className="flex-1 overflow-auto">
247+
<div className="flex-1 overflow-auto bg-gray-900">
211248
<div className="h-full flex">
212249
<div className="flex-1 p-6">
213250
<div className="max-w-4xl mx-auto">

‎src/components/ContactSection.js‎

Lines changed: 54 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,77 +1,90 @@
11
import React, { useState } from 'react';
2-
import { Mail, MessageSquare, Copy, Check, Github, Linkedin } from 'lucide-react';
2+
import { Mail, MessageSquare, Copy, Check, Github } from 'lucide-react';
33

44
const ContactSection = ({ isDark }) => {
55
const [copied, setCopied] = useState(false);
66

77
const copyEmail = () => {
8-
navigator.clipboard.writeText('your.email@example.com');
8+
navigator.clipboard.writeText('hnaamdev41@gmail.com');
99
setCopied(true);
1010
setTimeout(() => setCopied(false), 2000);
1111
};
1212

1313
return (
1414
<div className={`${isDark ? 'bg-gray-800' : 'bg-white'} p-6 rounded-lg shadow-lg`}>
15-
<h2 className="text-2xl mb-6">Contact Information</h2>
15+
<h2 className="text-2xl font-semibold mb-6">Contact Information</h2>
1616

17-
{/* Contact Cards */}
18-
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
17+
{/* Contact Methods */}
18+
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-8">
1919
{/* Email */}
20-
<div className={`${isDark ? 'bg-gray-900' : 'bg-gray-100'} p-4 rounded-lg`}>
21-
<div className="flex items-center justify-between">
22-
<div className="flex items-center space-x-3">
23-
<Mail className="text-blue-400" />
24-
<div>
25-
<p className={`text-sm ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>Email</p>
26-
<p className="text-base">your.email@example.com</p>
27-
</div>
20+
<div className={`${isDark ? 'bg-gray-900/50' : 'bg-gray-100'} p-4 rounded-lg flex items-center justify-between`}>
21+
<div className="flex items-center gap-3">
22+
<div className="p-2 bg-blue-500/10 rounded">
23+
<Mail className="text-blue-400" size={20} />
2824
</div>
29-
<button
30-
onClick={copyEmail}
31-
className={`p-2 rounded-md ${isDark ? 'hover:bg-gray-800' : 'hover:bg-gray-200'}`}
32-
>
33-
{copied ? <Check size={16} className="text-green-400" /> : <Copy size={16} />}
34-
</button>
35-
</div>
36-
</div>
37-
38-
{/* Telegram */}
39-
<div className={`${isDark ? 'bg-gray-900' : 'bg-gray-100'} p-4 rounded-lg`}>
40-
<div className="flex items-center space-x-3">
41-
<MessageSquare className="text-blue-400" />
4225
<div>
43-
<p className={`text-sm ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>Telegram</p>
44-
<p className="text-base">@yourtelegram</p>
26+
<p className={`text-sm ${isDark ? 'text-gray-400' : 'text-gray-600'}`}>Email</p>
27+
<p className="font-medium">hnaamdev41@gmail.com</p>
4528
</div>
4629
</div>
30+
<button
31+
onClick={copyEmail}
32+
className={`p-2 rounded hover:bg-gray-700/50 transition-colors`}
33+
>
34+
{copied ? <Check size={18} className="text-green-400" /> : <Copy size={18} />}
35+
</button>
4736
</div>
4837
</div>
4938

50-
{/* Social Links */}
51-
<div className="space-y-4">
39+
{/* Social Media */}
40+
<div className="mb-8">
5241
<h3 className="text-lg font-medium mb-4">Social Media</h3>
53-
<div className="flex space-x-4">
42+
<div className="grid grid-cols-3 gap-4">
43+
<a
44+
href="https://github.com/hnaamdev41"
45+
target="_blank"
46+
rel="noopener noreferrer"
47+
className={`${isDark ? 'bg-gray-900/50 hover:bg-gray-700' : 'bg-gray-100 hover:bg-gray-200'}
48+
p-4 rounded-lg flex items-center gap-3 transition-colors`}
49+
>
50+
<div className="p-2 bg-gray-800 rounded">
51+
<Github className="text-white" size={20} />
52+
</div>
53+
<span>GitHub</span>
54+
</a>
55+
5456
<a
55-
href="https://github.com/yourusername"
57+
href="https://instagram.com/neko_dalal"
5658
target="_blank"
5759
rel="noopener noreferrer"
58-
className={`p-2 rounded-md ${isDark ? 'bg-gray-900 hover:bg-gray-700' : 'bg-gray-100 hover:bg-gray-200'}`}
60+
className={`${isDark ? 'bg-gray-900/50 hover:bg-gray-700' : 'bg-gray-100 hover:bg-gray-200'}
61+
p-4 rounded-lg flex items-center gap-3 transition-colors`}
5962
>
60-
<Github className="text-gray-400 hover:text-white" />
63+
<div className="p-2 bg-pink-500 rounded">
64+
<svg className="w-5 h-5 text-white" fill="currentColor" viewBox="0 0 24 24">
65+
<path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/>
66+
</svg>
67+
</div>
68+
<span>Instagram</span>
6169
</a>
70+
6271
<a
63-
href="https://linkedin.com/in/yourusername"
72+
href="https://t.me/HNaamdev41"
6473
target="_blank"
6574
rel="noopener noreferrer"
66-
className={`p-2 rounded-md ${isDark ? 'bg-gray-900 hover:bg-gray-700' : 'bg-gray-100 hover:bg-gray-200'}`}
75+
className={`${isDark ? 'bg-gray-900/50 hover:bg-gray-700' : 'bg-gray-100 hover:bg-gray-200'}
76+
p-4 rounded-lg flex items-center gap-3 transition-colors`}
6777
>
68-
<Linkedin className="text-gray-400 hover:text-white" />
78+
<div className="p-2 bg-blue-500 rounded">
79+
<MessageSquare className="text-white" size={20} />
80+
</div>
81+
<span>Telegram</span>
6982
</a>
7083
</div>
7184
</div>
7285

7386
{/* Contact Form */}
74-
<div className="mt-8">
87+
<div>
7588
<h3 className="text-lg font-medium mb-4">Send a Message</h3>
7689
<form className="space-y-4">
7790
<div>
@@ -81,7 +94,7 @@ const ContactSection = ({ isDark }) => {
8194
<input
8295
type="text"
8396
className={`w-full p-2 rounded-md ${
84-
isDark ? 'bg-gray-900 border-gray-700' : 'bg-white border-gray-300'
97+
isDark ? 'bg-gray-900/50 border-gray-700' : 'bg-white border-gray-300'
8598
} border focus:ring-2 focus:ring-blue-500 focus:border-transparent`}
8699
/>
87100
</div>
@@ -92,7 +105,7 @@ const ContactSection = ({ isDark }) => {
92105
<input
93106
type="email"
94107
className={`w-full p-2 rounded-md ${
95-
isDark ? 'bg-gray-900 border-gray-700' : 'bg-white border-gray-300'
108+
isDark ? 'bg-gray-900/50 border-gray-700' : 'bg-white border-gray-300'
96109
} border focus:ring-2 focus:ring-blue-500 focus:border-transparent`}
97110
/>
98111
</div>
@@ -103,7 +116,7 @@ const ContactSection = ({ isDark }) => {
103116
<textarea
104117
rows={4}
105118
className={`w-full p-2 rounded-md ${
106-
isDark ? 'bg-gray-900 border-gray-700' : 'bg-white border-gray-300'
119+
isDark ? 'bg-gray-900/50 border-gray-700' : 'bg-white border-gray-300'
107120
} border focus:ring-2 focus:ring-blue-500 focus:border-transparent`}
108121
/>
109122
</div>

0 commit comments

Comments
 (0)