-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
273 lines (267 loc) · 14.2 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
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Manas Shah-Portfolio Website</title>
<link href="assets/bootstrap/css/bootstrap.min.css" rel="stylesheet"
<link href="assets/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="assets/lightbox/css/lightbox.css" rel="stylesheet">
<link href="assets/textrotator/simpletextrotator.css" rel="stylesheet">
<link href="assets/flexslider/flexslider.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/animate.css" rel="stylesheet">
</head>
<body id="top">
<div id="preloader"></div>
<header id="home">
<div class="container-fluid">
<div class="row">
<div class="menu-wrap">
<nav class="menu">
<div class="icon-list">
<a href="index.html#home"><i class="fa fa-fw fa-home"></i><span>Home</span></a>
<a href="index.html#about"><i class="fa fa-fw fa-quote-left"></i><span>About</span></a>
<a href="index.html#service"><i class="fa fa-fw fa-globe"></i><span>Service</span></a>
<a href="index.html#portfolio"><i class="fa fa-fw fa-picture-o"></i><span>Portfolio</span></a>
<a href="index.html#contact"><i class="fa fa-fw fa-envelope-o"></i><span>Contact</span></a>
</div>
</nav>
</div>
<button class="menu-button" id="open-button"></button>
</div>
</div>
<section class="hero" id="hero">
<div class="container">
<div class="row">
<div class="col-md-12 text-right navicon">
<a id="nav-toggle" class="nav_slide_button" href="index.html#"><span></span></a>
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-1 inner">
<h1 class="animated fadeInDown">
Ma<span style="color:#E04343;">n</span>as<br/>
<span>Sh<span style="color:#FFE800">a</span>h</span>
</h1>
<h3 class="animated fadeInUp delay-05s"><span class="rotate">Developer</span></h3>
</div>
</div>
<div class="row">
<div class="col-md-6 col-md-offset-3 text-center">
<a href="index.html#about" class="scrollto wow fadeInUp delay-5s ">
<p>SEE MORE</p>
<p class="scrollto--arrow"><img src="img/scroll-down.png" alt="scroll down arrow"></p>
</a>
</div>
</div>
</div>
</section>
</header>
<section class="intro text-center section-padding color-bg" id="about">
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2 wp1">
<h1 class="arrow">A little <span>about</span> me</h1>
<p>Passionate Front End Developer and Designer with a keen eye for detail, dedicated to creating visually stunning and highly functional web experiences.
Proficient in translating creative visions into responsive and user-friendly designs,
I strive to elevate digital interfaces to new heights through innovative and impactful solutions.</p>
</div>
</div>
</div>
</section>
<section class="features text-center section-padding" id="service">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="arrow">I do amazing things for clients</h1>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="services">
<div class="col-md-4 wp2 item">
<div class="icon">
<i class="fa fa-laptop"></i>
</div>
<h2>Responsive Webistes</h2>
<p>Proficient in HTML, CSS, and JavaScript, I am actively expanding my skill set to include cutting-edge technologies such as React.js.
</p>
</div>
<div class="col-md-4 wp2 item delay-05s">
<div class="icon">
<i class="fa fa-desktop"></i>
</div>
<h2>Object Oriented Programming</h2>
<p>Skilled in Python and Java with a deep understanding of crucial concepts.
Demonstrated proficiency in leveraging both languages for effective and scalable software development.</p><!-- Description -->
</div>
<div class="col-md-4 wp2 item delay-1s">
<div class="icon">
<i class="fa fa-cubes"></i>
</div>
<h2>UI/UX</h2>
<p>Proficient in UI/UX design, dedicated to continuous improvement and skill enhancement. Committed to staying abreast of industry trends,
actively pursuing ongoing education for refined expertise and delivering exceptional user experiences.</p>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</section>
<div class="container-fluid">
<div class="row color-bg">
<div class="col-md-6 nopadding features-intro-img">
<div class="about-image" style="background-image:url(img/about1.png)"></div>
</div>
<div class="col-md-6 about-text">
<h6>Responsive Webistes</h6>
<p>Highly proficient in HTML, CSS, and JavaScript, I am actively engaged in expanding my skill set to encompass cutting-edge technologies such as React.js.
My commitment to delivering polished and dynamic web solutions is evident in my work, where I seamlessly blend technical expertise with a continuous pursuit
of knowledge. By staying at the forefront of modern web development trends, I strive to contribute innovative and impactful solutions to enhance user
experiences and meet the evolving demands of the digital landscape</p><br>
</div>
</div>
<div class="row">
<div class="col-md-6 about-text">
<h6>Object-Oriented Programming</h6>
<p>Equipped with advanced proficiency in Python and Java, I possess a deep understanding of crucial concepts in both languages.
Demonstrating expertise beyond basic implementation, I have successfully applied these skills to develop effective and scalable software solutions.
My nuanced grasp of Python's simplicity and readability, as well as Java's robustness in enterprise-level applications, reflects a commitment to staying
current with industry standards. This continuous pursuit of skill enhancement ensures my capability to deliver innovative solutions aligned with the latest
trends in software development</p><br>
</div>
<div class="col-md-6 nopadding features-intro-img">
<div class="about-image" style="background-image:url(img/about2.png)"></div>
</div>
</div>
<div class="row color-bg">
<div class="col-md-6 nopadding features-intro-img">
<div class="about-image" style="background-image:url(img/about3.jpeg)"></div>
</div>
<div class="col-md-6 about-text">
<h6>UI/UX</h6>
<p>
As a proficient UI/UX designer, I am deeply committed to continuous improvement and skill enhancement. Actively staying abreast of industry trends, I engage
in ongoing education to refine my expertise and ensure the delivery of exceptional user experiences. This dedication extends to a user-centric mindset,
emphasizing usability, accessibility, and aesthetic appeal in my designs. I actively seek feedback and collaborate iteratively, ensuring that the solutions
I deliver exceed user expectations and align with the latest advancements in UI/UX methodologies.</p><br>
</div>
</div>
</div>
<section class="swag text-center" id="portfolio">
<div class="container">
<div class="row">
<h1 class="arrow">
Recent <span>Porojects</span>
</h1>
</div>
</div>
</section>
<section id="portfolio">
<div class="container mt-3">
<h1 class="text-center">Portfolio</h1>
<div class="row">
<div class="col-lg-4 mt-4">
<div class="card">
<img class="card-img-top" src="img/portfolio/portfolio-01-large.jpg" alt="Card image" style="width:100%">
<div class="card-body">
<h4 class="card-title">To-Do List</h4>
<p class="card-text">
I developed a dynamic To-Do List using HTML, CSS, and Javascript, seamlessly combining front-end technologies to create an interactive user experience.</p>
<div class="text-center">
<a href="https://github.com/manasshah1810/Codsoft/blob/7e3e88db51cdc2610ed8f0363d15ddb25c35bf09/Javascript/To-Do_List.html" class="btn btn-success">Link</a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mt-4">
<div class="card portfolioContent">
<img class="card-img-top" src="img/portfolio/portfolio-02-large.jpg" alt="Card image" style="width:100%">
<div class="card-body">
<h4 class="card-title">Digital Clock</h4>
<p class="card-text">I have created a digital clock using HTML, CSS, and JavaScript. The implementation seamlessly integrates these technologies to provide a functional and visually appealing digital time display.</p>
<div class="text-center">
<a href="https://github.com/manasshah1810/Codsoft/blob/7e3e88db51cdc2610ed8f0363d15ddb25c35bf09/Javascript/Digital-Clock.html" class="btn btn-success">Link</a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 mt-4">
<div class="card portfolioContent">
<img class="card-img-top" src="img/portfolio/portfolio-03-large.jpg" alt="Card image" style="width:100%">
<div class="card-body">
<h4 class="card-title">Guess The Number Game</h4>
<p class="card-text">
Implemented a "Guess the Number" game in Java, providing an interactive user experience for players to guess a randomly generated number within a specified
range. The program incorporates user input, random number generation, and conditional statements to facilitate an engaging gaming experience.</p>
<div class="text-center">
<a href="https://github.com/manasshah1810/Codsoft/blob/7e3e88db51cdc2610ed8f0363d15ddb25c35bf09/Java%20/GuessTheNumberGUI.java" class="btn btn-success">Link</a>
</div>
</div>
</div>
</div>
</div>
<br><br>
</section>
<div class="spacer-cta text-center">
<div class="container">
<div class="row">
<div class="col-md-12">
<a href="index.html#contact" class="outline-btn">Hire Me</a>
</div>
</div>
</div>
</div>
<section class="text-center section-padding contact-wrap" id="contact">
<a href="index.html#top" class="up-btn"><i class="fa fa-chevron-up"></i></a>
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="arrow">Drop <span>me</span> a line</h1>
</div>
</div>
<div class="row contact-details">
<div class="col-md-4">
<div class="dark-box box-hover">
<h2><i class="fa-brands fa-github"></i><span>Github</span></h2>
<p><a href="https://github.com/manasshah1810">Click Here</a></p>
</div>
</div>
<div class="col-md-4">
<div class="dark-box box-hover">
<h2><i class="fa fa-paper-plane"></i><span>Email</span></h2>
<p>[email protected]</p>
</div>
</div>
<div class="col-md-4">
<div class="dark-box box-hover">
<h2><i class="fa-brands fa-linkedin"></i><span>Linkedln</span></h2>
<p><a href="www.linkedin.com/in/manas-shah-a4b6862a6">Connect with me</a></p>
</div>
</div>
</div>
<script src="https://kit.fontawesome.com/bb2a077fdc.js" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="assets/smoothscroll/smoothscroll.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="js/waypoints.min.js"></script>
<script src="js/classie.js"></script>
<script src="assets/flexslider/jquery.flexslider.js"></script>
<script src="js/modernizr.js"></script>
<script src="assets/textrotator/jquery.simple-text-rotator.js"></script>
<script src="assets/lightbox/js/lightbox.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDeKBBPJTG3v5w3cNPAgM6ZsJiPyL1mP_o&sensor=false"></script>
<script src="js/main.js"></script>
<script src="js/script.js"></script>
<script type="text/javascript">
$(".rotate").textrotator({
animation: "fade",
separator: ",",
speed: 2000
});
</script>
</body>
</html>