-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
127 lines (118 loc) · 5.55 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dhruv's - Dev Portfolio</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<div class="menu-icon" onclick="showMenu()">
<i class="fas fa-bars bar"></i>
</div>
<nav id="navLinks">
<div class="cross-icon" onclick="hideMenu()">
<i class="fas fa-times-circle cross"></i>
</div>
<div class="left"><a href="index.html"> Dhruv's Portfolio</a></div>
<div class="right">
<ul class="choices">
<li><a onclick="scrollToSection('firstSection')">Home</a></li>
<li><a onclick="scrollToSection('secondSection')">about me </a></li>
<li><a href="projects.html">My projects</a></li>
<li><a onclick="scrollToSection('footerSection')">contact me</a></li>
</ul>
</div>
</nav>
</header>
<main>
<section class="firstSection" id="firstSection">
<div class="leftsection">
Hi, my name is <span class="purple">Dhruv</span>
<div>and I am a passionate </div>
<span id="element"></span>
</div>
<div class="rightsection">
<img src="./images/developer.png" alt="background" class="img-fluid">
</div>
</section>
<hr>
<section class="secondSection" id="secondSection">
<h1>About Me </h1>
<div class="aboutme">
<p>
Hey there! I'm Dhruv Pahuja, a first-year B.Tech student studying Computer Science and Engineering.
I'm on a journey to explore the exciting world of web development. My interest in technology ignited
my curiosity to dive into coding, design, and all things innovative. <br> <br>
I love creating websites that are not just functional but also enjoyable for users. From shaping
layouts with HTML and CSS to adding interactive features with JavaScript, I'm dedicated to learning
and staying updated in the fast-paced world of web development. <br> <br>
Beyond the code, I enjoy solving problems and thinking creatively. I'm eager to contribute to
meaningful projects and collaborate with fellow enthusiasts. Let's connect and explore the
possibilities!
</p> <br>
</div>
<div class="skills">
<h3 id="#heading2">Skills</h3>
<div class="skill-card">
<h3>Programming Languages</h3>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</div>
<div class="skill-card">
<h3>Frontend Frameworks</h3>
<ul>
<li>React.js</li>
<li>Tailwind CSS</li>
<li>Bootstrap</li>
</ul>
</div>
<div class="skill-card">
<h3>Tools</h3>
<ul>
<li>Visual Studio Code</li>
<li>Figma</li>
<li>Git / Github</li>
<!-- Add more tools if applicable -->
</ul>
</div>
</div>
</section>
<hr id="no-margin">
</main>
<footer class="footerSection" id="footerSection">
<div class="footer">
<div class="footer-first">
<h3>Dhruv Developer Portfolio</h3>
</div>
</div>
<div class="contact-me">
<p id="contact1">Connect with me:</p>
<div class="social-icons">
<a href="https://github.com/Dhruv-pahuja" target="_blank"><img class="icons"
src="./images/github-icon.png" alt="GitHub"></a>
<a href="https://www.linkedin.com/in/dhruv-pahuja-658934272/" target="_blank"><img
src="./images/linkedin-icon.png" class="icons" alt="LinkedIn"></a>
<a href="mailto:[email protected]" id="emailPopup" onclick="revealEmail()"><img
src="./images/email.png" alt="Email" class="icons"></a>
</div>
<p id="contact">© 2024 Dhruv Developer Portfolio </p>
<div id="popupContainer">
<p>My Email: <span id="revealedEmail">[email protected]</span></p>
</div>
</div>
</footer>
<script src="https://unpkg.com/[email protected]/dist/typed.umd.js"></script>
<script src="main.js"></script>
</body>
</html>