-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
341 lines (292 loc) · 16.8 KB
/
about.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
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--=============== FAVICON ===============-->
<link rel="shortcut icon" href="assets/img/favicon.ico" type="image/x-icon">
<!--=============== REMIXICONS ===============-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/remixicon/3.5.0/remixicon.css">
<!--=============== CSS ===============-->
<link rel="stylesheet" href="assets/css/styles.css">
<title>About - Prince</title>
</head>
<body>
<!--==================== HEADER ====================-->
<header class="header header-pages" id="header">
<nav class="nav container">
<a href="index.html" class="nav__logo">Prince</a>
<div class="nav__menu" id="nav-menu">
<ul class="nav__list">
<li class="nav__item">
<a href="index.html" class="nav__link">Home</a>
</li>
<li class="nav__item">
<a href="about.html" class="nav__link">About</a>
</li>
<li class="nav__item">
<a href="work.html" class="nav__link">Work</a>
</li>
<li class="nav__item">
<a href="contact.html" class="button">Contact</a>
</li>
<li class="nav__item">
<select id="languageSwitcher" class="nav__link" aria-label="Language Selector">
<option value="en" aria-label="English" data-href="about.html">English</option>
<!-- <option value="es" aria-label="Español" data-href="index_es.html">Español</option> -->
<option value="zh" aria-label="中文" data-href="about_zh.html">中文</option>
<!-- Add more languages as needed -->
</select>
</li>
</ul>
<!-- Close button -->
<div class="nav__close" id="nav-close">
<i class="ri-close-line"></i>
</div>
</div>
<div class="nav__actions">
<!-- Theme button -->
<i class="ri-moon-line change-theme" id="theme-button"></i>
<!-- Toggle button -->
<div class="nav__toggle" id="nav-toggle">
<i class="ri-menu-line"></i>
</div>
</div>
</nav>
</header>
<!--==================== MAIN ====================-->
<main class="main">
<!--==================== ABOUT ====================-->
<section class="about section">
<h2 class="section__title">
About Me
</h2>
<div class="about__container about__page container grid">
<div class="about__perfil perfil">
<div class="perfil__content">
<img src="assets/img/about-perfil.png" alt="image" class="perfil__img">
</div>
</div>
<div class="about__content grid">
<div class="about__data grid">
<div class="about__info grid">
<h1 class="about__name">Prince Otchere</h1>
<h2 class="about__profession">Equity Derivatives Trader</h2>
<!-- <br> -->
<p class="about__description">
Passionate about developing and testing websites,
I have 10+ years of experience in chemistry and
technology. For 2+ years, I have been <b>buying
and selling options</b> in varying market conditions.
The experience of trading futures is similar except funds
are settled the same day. So futures move quicker.
</p>
<!-- <p class="about__description">
Fun fact. I was born in Ghana. That means your parents or
grandparents want you to be a doctor, a lawyer or
an engineer. I checked one of those boxes with the
one I prefer most. The engineer. Maybe I should get the others
for extra credit. Kidding but not kidding.
</p> -->
<!-- <p class="about__description">
Though not fully aware of all of the
implications, it seems like the tech industry is
moving towards generative AI and will transform the
landscape of the workplace in another iterative cycle.
</p> -->
<!-- <p class="about__description">
Same thing for crypto.
I like Bitcoin but another time.
</p> -->
<!-- <p>
Whereas with options, there is a business day cool down time for funds
to settle.
Although it
is the most highly leveraged yet regulated financial instrument,
I won't talk about futures here.
</p> -->
<!-- fun fact but omit it -->
<!-- <p class="about__description">
Similarly, I like Bitcoin and even made my mom a nice figure when she bought all of those Dogecoins in 2019.
</p>
<p class="about__description">
One of my favorite books to read is <b>The Little Prince</b>,
the inspiration for this site.
</p> -->
<p class="about__description">
For informal inquiries, <b>DM me</b> on
Instagram.
</p>
<p class="about__description">
For formal inquiries, <b>email me</b> by filling the
Contact form with a message and sending it.
</p>
<br/>
<a href="contact.html" class="about__button button">Contact</a>
</div>
<div class="about__skills">
<h3 class="about__skills-title">Trading Skills*</h3>
<div class="about__skills-content grid">
<!-- <div>
Removed attributes target="_blank" rel="noopener"
<img src="assets/img/about-thinkorswim.svg" alt="Think or swim image" class="about__skills-img">
<p class="about__skills-img-subtitle">thinkorswim</p>
</div> -->
<a href="https://www.tradingview.com/markets/stocks-usa/market-movers-large-cap/">
<img src="assets/img/about-trading-view.svg" alt="Trading View image" class="about__skills-img">
</a>
<a href="https://www.webull.com/options">
<img src="assets/img/about-webull.svg" alt="Webull image" class="about__skills-img">
</a>
<!-- <a href="https://app.tradezella.com/auth/register">
<img src="assets/img/about-tradezella.svg" alt="Tradezella image" class="about__skills-img">
</a> -->
<!-- <img src="assets/img/about-ninjatrader.svg" alt="Ninja trader image" class="about__skills-img"> -->
</div>
</div>
<div class="about__skills">
<h3 class="about__skills-title">Web Skills</h3>
<div class="about__skills-content grid">
<a href="https://nodejs.org/">
<img src="assets/img/about-node-js.svg" alt="Node.js image" class="about__skills-img">
</a>
<a href="https://sass-lang.com/">
<img src="assets/img/about-sass.svg" alt="Sass image" class="about__skills-img">
</a>
<a href="https://git-scm.com/">
<img src="assets/img/about-git.svg" alt="Git image" class="about__skills-img">
</a>
</div>
</div>
<div class="about__skills">
<h3 class="about__skills-title">QA Skills</h3>
<div class="about__skills-content grid">
<a href="https://www.atlassian.com/software/jira">
<img src="assets/img/about-jira.svg" alt="Jira image" class="about__skills-img">
</a>
<a href="https://docs.deque.com/devtools-for-web/4/en/devtools-extension">
<img src="assets/img/about-axe-devtools.svg" alt="Axe DevTools image" class="about__skills-img">
</a>
<a href="https://www.nvaccess.org/download/">
<img src="assets/img/about-nvda.svg" alt="NVDA image" class="about__skills-img">
</a>
</div>
</div>
<p>* All skills displayed are highlights. Not an exhaustive list.</p>
<!-- <div class="about__skills">
<h3 class="about__skills-title">Design Skills</h3>
<div class="about__skills-content grid">
<img src="assets/img/about-figma.svg" alt="Figma image" class="about__skills-img">
<img src="assets/img/about-sketch.svg" alt="Sketch image" class="about__skills-img">
<img src="assets/img/about-photoshop.svg" alt="image" class="about__skills-img">
<img src="assets/img/about-illustrator.svg" alt="image" class="about__skills-img">
</div>
</div>
<div class="about__skills">
<h3 class="about__skills-title">Frontend Skills</h3>
<div class="about__skills-content grid">
<img src="assets/img/about-html.svg" alt="HTML5 image" class="about__skills-img">
<img src="assets/img/about-css.svg" alt="CSS3 image" class="about__skills-img">
<img src="assets/img/about-sass.svg" alt="Sass image" class="about__skills-img">
<img src="assets/img/about-tailwind-css.svg" alt="image" class="about__skills-img">
<img src="assets/img/about-javascript.svg" alt="Javascript image" class="about__skills-img">
<img src="assets/img/about-react.svg" alt="React image" class="about__skills-img">
</div>
</div>
<div class="about__skills">
<h3 class="about__skills-title">Backend Skills</h3>
<div class="about__skills-content grid">
<img src="assets/img/about-node-js.svg" alt="Node.js image" class="about__skills-img">
<img src="assets/img/about-mongo-db.svg" alt="Mongo DB image" class="about__skills-img">
<img src="assets/img/about-my-sql-db.svg" alt="My SQL image" class="about__skills-img">
</div>
</div>
<div class="about__skills">
<h3 class="about__skills-title">DevOps Skills</h3>
<div class="about__skills-content grid">
<img src="assets/img/about-aws.svg" alt="AWS image" class="about__skills-img">
<img src="assets/img/about-jenkins.svg" alt="Jenkins image" class="about__skills-img">
<img src="assets/img/about-k8s.svg" alt="Kubernetes image" class="about__skills-img">
</div>
</div>
<div class="about__skills">
<h3 class="about__skills-title">Extra Skills</h3>
<div class="about__skills-content grid">
<img src="assets/img/about-git.svg" alt="Git image" class="about__skills-img">
Github icon needs to appear white in dark mode for better color contrast
<img src="assets/img/about-github-light.svg" alt="Github image" class="about__skills-img">
<img src="assets/img/about-jira.svg" alt="Jira image" class="about__skills-img">
<img src="assets/img/about-axe-devtools.svg" alt="Axe DevTools image" class="about__skills-img">
<img src="assets/img/about-nvda.svg" alt="NVDA image" class="about__skills-img">
<img src="assets/img/about-splunk.svg" alt="Splunk image" class="about__skills-img">
New Relic icon not accessible in dark dark mode. Color contrast issue
<img src="assets/img/about-new-relic.svg" alt="New Relic image" class="about__skills-img">
</div> -->
</div>
</div>
</section>
</main>
<!--==================== FOOTER ====================-->
<footer class="footer">
<div class="footer__container container grid">
<div class="footer__content grid">
<a href="index.html" class="footer__logo">Prince</a>
<!-- <a href="https://michael-osei-morgan.netlify.app/" class="footer__logo">Michael</a> -->
<ul class="footer__links">
<li>
<a href="about.html" class="footer__link">About</a>
</li>
<li>
<a href="work.html" class="footer__link">Work</a>
</li>
<li>
<a href="contact.html" class="footer__link">Contact</a>
</li>
</ul>
<div class="footer__social">
<a href="https://www.instagram.com/lilprincexyz/"
class="footer__social-link"
aria-label="Prince Instagram">
<i class="ri-instagram-line"></i>
</a>
<!-- <a href="https://www.facebook.com/princecodes/"
target="_blank" class="footer__social-link"
aria-label="Prince's Facebook profile">
<i class="ri-facebook-circle-fill"></i>
</a> -->
<a href="https://twitter.com/lilprincexyz_/"
class="footer__social-link"
aria-label="Prince's X/Twitter profile">
<i class="ri-twitter-x-line"></i>
</a>
<a href="https://github.com/lilprincexyz/"
class="footer__social-link"
aria-label="Prince's Github profile">
<i class="ri-github-fill"></i>
</a>
<a href="https://www.linkedin.com/in/lilprincexyz/"
class="footer__social-link"
aria-label="Prince Linkedin">
<i class="ri-linkedin-box-fill"></i>
</a>
</div>
</div>
<span class="footer__copy">
© All Rights Reserved By Bedimcode
</span>
</div>
</footer>
<!--========== SCROLL UP ==========-->
<!-- <a href="#" class="scrollup" id="scroll-up"
aria-label="Scroll back to the top">
<i class="ri-arrow-up-line"></i>
</a> -->
<!--=============== MAIN JS ===============-->
<script src="assets/js/main.js"></script>
<!--=============== SWIPER JS ===============-->
<script src="assets/js/swiper-bundle.min.js"></script>
<!--=============== INDEX JS ===============-->
<script src="assets/js/index.js"></script>
<script src="assets/js/lang.js"></script>
</body>
</html>