-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
128 lines (122 loc) · 5.79 KB
/
Copy pathindex.html
File metadata and controls
128 lines (122 loc) · 5.79 KB
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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="milestone" content="Portfolio">
<!-- TODO: Replace this with your title -->
<title>KodyKeo</title>
<!--
TODO: Add Bootstrap CSS link tag from:
https://getbootstrap.com/
-->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<!--
TODO: Add Bootstrap Icons link tag from:
https://icons.getbootstrap.com/
(Remember, the CDN link is towards the bottom of the page!)
-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<!-- Custom styles (these can extend the default Bootstrap styles) -->
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!-- TODO: Paste Navbar code and customize links -->
<nav class="navbar navbar-expand-lg bg-body-tertiary " id="navbar">
<div class="container-fluid">
<a class="navbar-brand" href="#"><i class="bi bi-house"></i></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#mission-section">Mission</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#skills-section">Skills</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact-section">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Hero section -->
<section id="hero-section">
<div class="tower"></div>
<div class="text-center">
<img src="img/selfie.jpg" class="img-fluid" alt="selfie">
</div>
<div class="hero-text">
<h1 class="text-center">Kody Keo</h1>
<p class="text-center">Technology to Improve the Future</p>
</div>
</section>
<!-- Mission/Meet-me section -->
<section id="mission-section">
<h2>My Mission</h2>
<div class="container">
<div class="row">
<div class="col-12 col-md-6">
<img src="img/engineering-jobs.theiet.jpg" class="rounded mx-auto d-block img-fluid border border-dark border-5">
</div>
<div class="col-12 col-md-6">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris dignissim est vel urna tempus, ut dapibus neque pretium. Praesent ornare elit urna, sit amet consectetur risus posuere a. Praesent sollicitudin ipsum ac nunc pellentesque porttitor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce vitae pellentesque turpis. Suspendisse varius nulla eu ultrices suscipit. Phasellus et nulla aliquam, gravida lectus sed, porta nunc. Phasellus nec tempus orci. Nulla facilisi. Fusce at semper ipsum. Aliquam non risus at velit consequat egestas. Sed ut imperdiet libero. Pellentesque porttitor dictum ultrices. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
</div>
</div>
</div>
</section>
<!-- Skills section -->
<section id="skills-section">
<h3 class="text-center">Skills</h3>
<div class="container text-center">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-12">
<div class="HTML"><img src="img/HTML5_logo_and_wordmark.svg.png""></div>
<p>Structuring the web's content using modern semantic HTML.</p>
</div>
<div class="col-lg-3 col-md-6 col-sm-12">
<div class="CSS"><img src="img/CSS3_logo_and_wordmark.svg"></div>
<p>Presenting beautiful web designs and interactions using modern CSS.</p>
</div>
<div class="col-lg-3 col-md-6 col-sm-12">
<div class="BootStrap"><img src="img/Bootstrap_logo.svg"></div>
<p>Rapidly developing responsive websites using the web's most popular framework.</p>
</div>
<div class="col-lg-3 col-md-6 col-sm-12">
<div class="JS"><img src="img/JavaScript-Logo.png"></div>
<p>Making interactive experiences, games, web apps, and more using javascript.</p>
</div>
</div>
</div>
</section>
<!-- Contact Section -->
<section id="contact-section">
<h4 class="text-center">Contact</h4>
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-12 col-sm-12 text-center">
<a href="https://www.linkedin.com/in/kody-keo-370716275/"><i class="bi bi-linkedin fs-1"></i></a>
</div>
<div class="col-lg-4 col-md-12 col-sm-12 text-center">
<a href="https://github.com/KataMain24"><i class="bi bi-github fs-1"></i></a>
</div>
<div class="col-lg-4 col-md-12 col-sm-12 text-center">
<a href=""><i class="bi bi-envelope fs-1"></i></a>
</div>
</div>
</div>
</section>
<!-- Footer section -->
<section id="footer-section">
<h2><i class="bi bi-c-circle"></i>Kody Keo</h2>
</section>
<!--
TODO: Paste Bootstrap JavaScript script tag from:
https://getbootstrap.com/
-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>