-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
138 lines (111 loc) · 6.04 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
<!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, shrink-to-fit=no">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="robots" content="index, follow">
<meta http-equiv="cache-control" content="public">
<meta property="og:title" content="">
<meta property="og:url" content="">
<meta property="og:image" content="images/favicon.png">
<link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
<title>Wangui Kamande | Product Designer & Software Developer</title>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<!-- Bootstrap Icons -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">
<!-- Custom Styles -->
<link href="index.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="d-xxl-block navbar fixed-top navbar-expand-xl" id="theNav">
<div class="container-fluid">
<a class="navbar-brand" id="white-logo" href="#home">
<img src="images/logo.png" alt="Wangui Kamande" />
</a>
<button class="navbar-toggler black-text" type="button" onclick="openNav()" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<i class="bi bi-three-dots-vertical" id="menu"></i>
</button>
<div class="collapse navbar-collapse d-xl-flex justify-content-xl-end" id="navbarNavDropdown">
<ul class="navbar-nav dmsans" id="nav-links">
<li class="nav-item">
<a class="nav-link normal-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">work</a>
</li>
<li class="nav-item">
<a class="nav-link normal-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">about</a>
</li>
<li class="nav-item">
<a class="nav-link normal-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">contact</a>
</li>
<li class="nav-item">
<a class="nav-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">
<i class="bi bi-moon"></i>
</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- End of Navigation -->
<!-- Side Navigation -->
<div id="mobilenavigation" class="sidenav shadow-lg">
<div class="top-content">
<a class="navbar-brand" href="#home">
<img src="images/logo.png" alt="Wangui Kamande" />
</a>
<a href="javascript:void(0)" class="closebtn bi bi-x" onclick="closeNav()"></a><br><br><br><hr class="mt-md-5" />
</div>
<ul class="navbar-nav dmsans black-text text-center" id="sidenav-links">
<li class="nav-item">
<a class="nav-link normal-side-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">work</a>
</li>
<li class="nav-item">
<a class="nav-link normal-side-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">about</a>
</li>
<li class="nav-item">
<a class="nav-link normal-side-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">contact</a>
</li>
<li class="nav-item">
<a class="nav-link" type="button" href="#/" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">
<i class="bi bi-moon"></i>
</a>
</li>
</ul>
</div>
<!-- End of Side Navigation -->
<!-- Cover -->
<div id="cover">
<div class="row cover-content">
<div class="col-xxl-6 col-xl-6 col-12 d-flex align-items-center">
<div class="left-content">
<p class="dmsans hello">hello</p>
<h1>
<span class="playfair black-text">I'm</span>
<span class="playfair-heavy green-text">Wangui Kamande</span>
</h1>
<a href="#void" onclick="playAudio('images/pronunciation.mp3')" class="pronunciation grey-text d-flex dmsans">
<i class="bi bi-volume-up" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Click me"></i>
Pronunciation : / wɑ:.ŋgʊ.ɪ kʌmɑ:nde /
</a>
<h2 class="playfair black-text">
A versatile human being. A data science and machine learning enthusiast. A market intelligence analyst and visual designer. An empath who endeavours to enhance experiences and find modern solutions to modern problems.
</h2>
<a href="#/" type="button" class="btn btn-lg green-text dmsans mt-2 mt-md-4 mt-lg-3 mt-xxl-4 text-center" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Coming Soon!">View my work</a>
</div>
</div>
<div class="col-xxl-6 col-12 col-xl-6 d-xl-flex align-items-center d-none" id="the-svg">
<img src="images/wangui.svg" class="ms-xl-auto me-xl-auto ms-xxl-0 me-xxl-0" alt=""/>
</div>
</div>
</div>
<!-- End Of Cover -->
<!-- JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script>
<script src="index.js"></script>
</body>
</html>