-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
200 lines (186 loc) · 5.67 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
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Karan Yadav - Portfolio</title>
<style>
/* General Styles */
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
color: #333;
}
a {
text-decoration: none;
color: #007bff;
}
a:hover {
text-decoration: underline;
}
header {
background-color: #007bff;
color: white;
text-align: center;
padding: 1rem;
font-size: 2rem;
position: sticky;
top: 0;
z-index: 1000;
}
/* Section Styles */
section {
padding: 3rem 5%;
margin: 0 auto;
max-width: 1200px;
background-color: white;
margin-bottom: 1rem;
box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
border-radius: 10px;
transition: transform 0.5s ease;
}
section:hover {
transform: translateY(-5px);
}
/* About Me */
#about {
text-align: center;
}
#about img {
border-radius: 50%;
width: 150px;
height: 150px;
margin-bottom: 1rem;
}
#about h2 {
margin-top: 0;
}
/* Portfolio */
#portfolio .project {
margin-bottom: 2rem;
}
#portfolio h3 {
margin-bottom: 0.5rem;
color: #007bff;
}
#portfolio p {
margin-bottom: 1rem;
}
/* Contact */
#contact {
text-align: center;
}
#contact a {
display: block;
margin: 0.5rem 0;
}
/* Resume */
#resume ul {
list-style-type: none;
padding: 0;
}
#resume li {
margin-bottom: 1rem;
padding: 1rem;
background-color: #f8f9fa;
border-radius: 5px;
box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
}
/* Footer */
footer {
text-align: center;
padding: 2rem 0;
background-color: #343a40;
color: white;
}
/* Animations */
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
section {
animation: fadeIn 1s ease-in-out;
}
</style>
</head>
<body>
<header>
Karan Yadav - Senior Front-End Developer
</header>
<section id="about">
<img src="https://via.placeholder.com/150" alt="Karan Yadav">
<h2>About Me</h2>
<p>I'm a senior front-end developer with 3 years of experience in web and mobile application development. I specialize in React, Angular, and Agile methodologies, with a passion for creating seamless user experiences.</p>
<p>Location: Mumbai, India</p>
<p>Email: <a href="mailto:[email protected]">[email protected]</a></p>
</section>
<section id="portfolio">
<h2>Portfolio</h2>
<div class="project">
<h3>KDESK</h3>
<p>A web application designed for seamless connectivity and productivity within the Keva community.</p>
</div>
<div class="project">
<h3>CUPID</h3>
<p>A project management and fragrance management application for customers across various countries.</p>
</div>
<div class="project">
<h3>Reeborn</h3>
<p>A health and fitness tracking app with NFC data reading and Bluetooth integration.</p>
</div>
<div class="project">
<h3>Wryll</h3>
<p>An AI-powered home workout trainer app with posture feedback and personalized workout plans.</p>
</div>
<div class="project">
<h3>NWartch</h3>
<p>A security and event monitoring application with real-time dashboard and report generation.</p>
</div>
<div class="project">
<h3>Fragsi</h3>
<p>A fragrance comparison website with an intuitive design for easy navigation.</p>
</div>
<div class="project">
<h3>Marketing Europe</h3>
<p>A platform for perfumers to search and filter perfume details.</p>
</div>
<div class="project">
<h3>Business Website</h3>
<p>A responsive and accessible business website with social media integration and a blog section.</p>
</div>
</section>
<section id="contact">
<h2>Contact</h2>
<p>Email: <a href="mailto:[email protected]">[email protected]</a></p>
<p>LinkedIn: <a href="https://www.linkedin.com/in/karan-yadav-krazy527/" target="_blank">Karan Yadav</a></p>
<p>Phone: +918788847580</p>
</section>
<section id="resume">
<h2>Resume</h2>
<ul>
<li>
<h3>Work Experience</h3>
<p><strong>Front-End Developer</strong> at Daten & Wissen Pvt. Ltd. (10/2021 – Present)</p>
</li>
<li>
<h3>Education</h3>
<p><strong>BSc. in Computer Science</strong> from Mumbai University (2017 – 2020)</p>
</li>
<li>
<h3>Technical Proficiency</h3>
<p>React, React Native, Angular, HTML/CSS, JavaScript, Django, Git</p>
</li>
<li>
<h3>Achievements</h3>
<p>Tech-Performer of the Month (06/2023) at Daten & Wissen Pvt. Ltd.</p>
</li>
</ul>
<p><a href="/mnt/data/KaranYadav_resume.pdf" download>Download My Resume</a></p>
</section>
<footer>
<p>© 2024 Karan Yadav. All Rights Reserved.</p>
</footer>
</body>
</html>