-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
237 lines (210 loc) · 9.22 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
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shrashti Dwivedi</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<a href="C:\Users\shras\portfolio_website\style.css"></a>
</head>
<body>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4145540495485287"
crossorigin="anonymous"></script>
<div class="scrollToTop-btn">
<i class="fa fa-angle-up"></i>
</div>
<header>
<a href="#" class="brand">Shrashti Dwivedi</Data></a>
<div class="menu-btn"></div>
<div class="navigation">
<a href="#main">Home</a>
<a href="#about">About</a>
<a href="#skills">Skills</a>
<a href="#services">Services</a>
<a href="#contact">Contact</a>
</div>
</header>
<section class="main" id="main">
<div class="content">
<h2>Hello, I'm<br><span>Shrashti Dwivedi</span></h2>
<div class="animated-text">
<h3>Web Designer</h3>
<h3>Web Developer</h3>
<h3>Python Developer</h3>
</div>
<a href="#about" class="btn">Let'start</a>
<div class="media-icons">
<a href="https://github.com/shrashti-19"><i class="fa fa-github"></i></a>
<a href="https://www.linkedin.com/in/shrashti-dwivedi-663049253/"><i class="fa fa-linkedin"></i></a>
</div>
</div>
</section>
<section class="about" id="about">
<div class="title reveal">
<h2 class="section-title">About Me</h2>
</div>
<div class="content">
<div class="column col-left reveal">
<div class="img-card">
<img src="images/IMG20230322165812.jpg" alt="">
</div>
</div>
<div class="column col-left reveal">
<h2 class="content-title">Hey There! I'm Shrashti Dwivedi</h2>
<p class="paragraph-text"> I am currently pursuing a Bachelor of Technology (B.Tech) degree in Computer Science(AI|ML) and Engineering from Manipal University , Jaipur. With a keen interest in web development, I have honed my skills to become a proficient web developer.<br><br> Throughout my academic journey, I have gained a solid foundation in programming languages like HTML, CSS, and JavaScript, enabling me to create dynamic and visually appealing websites. I am also familiar with various web development frameworks and libraries such as React.<br><br>I enjoy the creative process of turning ideas into functional and user-friendly web applications. Constantly striving to enhance my skill set, I stay updated with the latest industry trends and techniques. By combining my technical knowledge and passion for web development, I aspire to contribute to innovative projects and make a meaningful impact in the digital world.
</p>
</div>
</div>
</section>
<section class="skills" id="skills">
<div class="title reveal">
<h2 class="section-title">My Skills</h2>
</div>
<div class="content">
<div class="column col-left reveal">
<h2 class="content-title">My Skills and Experiences</h2>
<p>I have a diverse set of skills and experience that span across multiple domains. In web development, I am proficient in HTML, CSS, and JavaScript, allowing me to create engaging and responsive user interfaces. Additionally, my expertise in Python enables me to build robust and scalable backend solutions.With my well-rounded technical skills and industry-recognized certification, I bring a comprehensive understanding of web development, scripting, and system administration to any project or team. </p>
</div>
<div class="column col-right reveal">
<div class="bar">
<div class="info">
<span>HTML</span>
<span>95%</span>
</div>
<div class="line html"></div>
</div>
<div class="bar">
<div class="info">
<span>CSS</span>
<span>92%</span>
</div>
<div class="line css"></div>
</div>
<div class="bar">
<div class="info">
<span>Javascript</span>
<span>80%</span>
</div>
<div class="line javascript"></div>
</div>
<div class="bar">
<div class="info">
<span>C Programming</span>
<span>98%</span>
</div>
<div class="line CProgramming"></div>
</div>
<div class="bar">
<div class="info">
<span>Python</span>
<span>80%</span>
</div>
<div class="line Python"></div>
</div>
<div class="bar">
<div class="info">
<span>Linux</span>
<span>70%</span>
</div>
<div class="line Linux"></div>
</div>
</div>
</div>
</section>
<section class="services" id="services">
<div class="title reveal">
<h2 class="section-title">My Services</h2>
<a href="https://docs.google.com/forms/d/e/1FAIpQLScMkM4HC-rY1_51Q76wVKDgVuvAZalxg2j5AxaMgBqLmqTJTA/viewform?usp=sf_link" class="btn">Hire Me</a>
</div>
<div class="content">
<div class="card reveal">
<div class="service-icon">
<i class="fa fa-paint-brush"></i>
</div>
<div class="info">
<h3>Web Design</h3>
<p>A well-designed website can help you form a good impression on your prospective customers. But, more importantly, it provides good user experience and helps your website visitors access and navigate your website with ease.</p>
</div>
</div>
<div class="card reveal">
<div class="service-icon">
<i class="fa fa-file-code-o"></i>
</div>
<div class="info">
<h3>Web Development</h3>
<p>Every website should be built with two primary goals.Firstly, it needs to work across all devices. Secondaly,it needs to be fast as possible.Let us take you into a deeper experience, make a moment a lasting conveyable memory. Let us help build your tribe.</p>
</div>
</div>
<div class="card reveal">
<div class="service-icon">
<i class="fa fa-desktop"></i>
</div>
<div class="info">
<h3>Python Developer</h3>
<p>With my certification in python, I possess in-depth knowledge and hands-on experience in python and troubleshooting. I am well-versed in configuring, securing, and maintaining , ensuring their smooth operation and optimal performance.</p>
</div>
</div>
</div>
</section>
<section class="contact" id="contact">
<div class="title reveal">
<div class="column col-left reveal"></div>
<h2 class="section-title">Contact Me</h2>
</div>
<div class="content">
<div class="row">
<div class="card reveal">
<div class="contact-icon">
<i class="fa fa-map-marker"></i>
</div>
<div class="info">
<h3>Address</h3>
<span>7-I-39 Chandra Shekhar Azad Nagar, Bhilwara (311001)</span>
</div>
</div>
<div class="content">
<div class="row">
<div class="card reveal">
<div class="contact-icon">
<i class="fa fa-comments"></i>
</div>
<div class="info">
<h3>Social Media</h3>
<span>LinkedIn-Shrashti Dwivedi <br>GitHub-shrashti-19<br>[email protected]</span>
</div>
</div>
</div>
</div>
</div>
<div>
<div class="row">
<div class="contact-form reveal">
<h3>Send Message</h3>
<form method="post" action="mailto: [email protected]">
<div class="input-box">
<input type="text" name="" value="" placeholder="Name">
</div>
<div class="input-box">
<input type="text" name="" value="" placeholder="Gmail">
</div>
<div class="input-box">
<input type="text" name=""value=""
placeholder="Message">
</div>
<div class="input-box">
<input type="submit" class="send-btn" name=""value="Send"/>
</form>
</div>
</div>
</div>
</div>
</section>
<footer class="footer">
<span class="footer-title">Shrashti Dwivedi</span>
<p>Copyright @2023 <a href="#">Shrashti Dwivedi</a>. All Rights Reserved.</p>
</footer>
<script src="script.js" charset="utf-8"></script>
</body>
</html>