-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
207 lines (158 loc) · 6.77 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
<!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.0">
<!-- Linked Bootstrap stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<script src="https://kit.fontawesome.com/b272d902e8.js" crossorigin="anonymous"></script>
<title>Nishad Rai</title>
</head>
<body>
<header>
<!-- Bootstrap navbar -->
<nav class="navbar navbar-expand-lg">
<div class="container-fluid">
<div class="test" id="navbarNav">
<ul class="navbar-nav test">
<li class="nav-item grow">
<a class="nav-link" href="#projects-section">Projects</a>
</li>
<li class="nav-item grow">
<a class="nav-link" href="#skills-section">Skills</a>
</li>
<li class="nav-item grow">
<a class="nav-link active" aria-current="page" href="#about-content">About Me</a>
</li>
<li class="nav-item grow">
<a class="nav-link" href="#contact-form">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<div class="nav-divider"></div>
<main>
<!-- Bootstrap jumbotron -->
<div>
<div class="container myJumbotron">
<h1 class="display-4 myJumbotronLine1">Hi, I'm <span style="color: #5bccf6">Nish</span>...</h1>
<p class="lead myJumbotronLine2">... I am a Front End Developer</p>
<div class="CV">
<img src="./images/CV Photo.jpg" style="width:15em; height:15em;" class="photo align-self-center mr-3" alt="Picture of me">
</div>
</div>
</div>
<!-- Projects -->
<section class="projects" id="projects-section">
<div class="card grow" style="width: 18rem;">
<a href="https://coincoach.netlify.app/">
<img src="./images/CoinCoachScreenshot1.png" class="card-img-top" alt="..."></a>
<div class="card-body">
<h5 class="card-title">CoinCoach</h5>
<p class="card-text">A financial app that allows you to track your expenditure and keep up-to-date on crypto news</p>
</div>
</div>
<div class="card grow" style="width: 18rem;">
<a href="https://sabrina-martorelli.github.io/BingeBuddies/">
<img src="./images/Screenshot1.png" class="card-img-top" alt="..."></a>
<div class="card-body">
<h5 class="card-title">BingeBuddies</h5>
<p class="card-text">Save time on deciding what to watch by displaying top pick trailers and genres selections</p>
</div>
</div>
<div class="card grow" style="width: 18rem;">
<a href="https://nrai14.github.io/Password-Generator/">
<img src="./images/Password Generator.png" class="card-img-top" alt="..."></a>
<div class="card-body">
<h5 class="card-title">Password Generator</h5>
<p class="card-text">Create a safe and secure password based on user input</p>
</div>
</div>
<div class="card grow" style="width: 18rem;">
<a href="https://github.com/nrai14?tab=repositories">
<img src="./images/Coming Soon.jpg" class="card-img-top" alt="..."></a>
<div class="card-body">
<h5 class="card-title">Calculator App</h5>
<p class="card-text">Let's get numerical.</p>
</div>
</div>
</section>
<!-- Skills section -->
<section class="skills" id="skills-section">
<h3>Skills <i class="fa fa-solid fa-code"></i> </h3>
<h5>Front End Experience </h5>
<br>
<ul>
<p>HTML <i class="fa fa-brands fa-html5"></i> </p>
<p>CSS <i class="fa-brands fa-css3-alt"></i></p>
<p>Bootstrap <i class="fa-brands fa-bootstrap"></i></p>
<p>JavaScript <i class="fa-brands fa-js"></i></p>
<p>GitHub <i class="fa-brands fa-github"></i></p>
<p>React <i class="fa-brands fa-react"></i></p>
<p>Node.js <i class="fa-brands fa-node-js"></i></p>
</ul>
</section>
<!-- About Me - using center-aligned media -->
</main>
<br>
<div id="row-container">
<div class="media child" id="about-content">
<div class="media-body" >
<h3 class="my-5">About Me</h3>
<div class="aboutMe">
<p>In South East Surrey, born and raised.</p>
<p>A sales environment was where I spent most of my days.</p>
<p>Prospectin', power point presentin', every week.</p>
<p>Started dreaming of a career change to seek.</p>
<br/>
<p>Then a coding career seemed pretty good,</p>
with its many interesting languages and problem solving techniques to be understood.
<p>I made this one little website and fell in love with it right there, </p>
so please feel free to look around and see what's here.</p>
</div>
</div>
</div>
<footer>
<!-- Contact form -->
<form class="child"id="contact-form">
<h4>Let's Connect!</h4>
<br>
<div class="form-group">
<label for="text">First Name</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter your first name">
</div>
<div class="form-group">
<label for="text">Last name</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter your last name">
</div>
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter your email">
<small id="emailHelp" class="form-text text-muted">Your email will never be shared elsewhere.</small>
</div>
<div class="form-group">
<label for="text">Comments</label>
<textarea type="text" class="form-control" placeholder="I would like to discuss..."></textarea>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
<!-- Footer with github and linkedin icon hyperlink -->
<section class="bottom">
<div class="box2">
<a href="https://github.com/nrai14?tab=repositories"><i class="fa-brands fa-github b-icon"></a></i>
</div>
<div class="copyright">
© Created by Nishad Rai 2022
</div>
<div class="box2">
<a href="https://www.linkedin.com/in/nish-r-b872067b/"><i class="fa-brands fa-linkedin b-icon"></a></i>
</div>
</section>
</footer>
</body>
</html>