-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathportfolio.html
More file actions
167 lines (145 loc) · 10.2 KB
/
portfolio.html
File metadata and controls
167 lines (145 loc) · 10.2 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
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
<!DOCTYPE html>
<html lang = "en">
<head>
<link rel="preconnect" href="https://fonts.gstatic.com">
<meta charset = "utf-8">
<meta name = "viewport" content = "width=device-width, initial-scale = 1"
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="https://kit.fontawesome.com/24d374bfa6.js" crossorigin="anonymous"></script>
<link rel = "stylesheet" href = "new.css">
<link rel = "stylesheet" href = "ico-moon/style.css">
<title>Portfolio</title>
<!--TODO: fix image getting bigger when resizing window-->
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand mb-0 h1 site-logo" href="index.html"><span class = "un-animation">Kevin Ha</span></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav ml-auto">
<a class="nav-item nav-link" href="index.html"><span class = "un-animation">About</span></a>
<a class="nav-item nav-link" href="resume.html"><span class ="un-animation">Resume</span></a>
<a class="nav-item nav-link active" href="portfolio.html"><span class ="un-animation">Portfolio</span></a>
<a class="nav-item nav-link" href="artwork.html"><span class ="un-animation">Artwork</span></a>
</div>
</div>
</nav>
<div class = "section-header">
<h3>Portfolio</h3>
<h4>A list of some of the work I've done.</h4>
</div>
<div class = "container-fluid portfolio">
<div class = "row justify-content-center">
<div id = "carouselExampleControls" class = "carousel slide" data-ride = "carousel" data-interval="false">
<div class = "carousel-inner">
<div class = "carousel-item active">
<div class = "ddrbot">
<div class = "card mb-3">
<div class = "row no-gutters">
<div class = "col-lg-6">
<video controls class = "img-fluid" muted autoplay loop playsinline>
<source src = "WebsiteVideos/ddrbot.mp4" type = "video/mp4">
</video>
</div>
<div class = "col-lg-6 text-center my-auto">
<div class = "card-body">
<h4 class = "card-title">Dance Dance Revolution Bot</h4>
<h5 class = "card-title">Summer 2019 | <a href = "https://github.com/KevinHa48/DDRBot" class = "source-links">Source Code</a></h5>
<p class = "card-text">Python project that generates a random set of songs for players that is easily accessed through the gaming chat platform, Discord.</p>
</div>
<ul class = "list-group list-group-flush tech">
<li class = "list-group-item">
<div class = "d-flex lan-use justify-content-around">
<i class="fab fa-python fa-3x" title = "Python"></i>
<span class ="icon-soup port-icon" title = "BeautifulSoup"></span>
<i class="fab fa-discord fa-3x" title = "Discord"></i>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class = "carousel-item">
<div class = "covidapp">
<div class = "card mb-3">
<div class = "row no-gutters">
<div class = "col-lg-4 text-center">
<video controls class = "img-fluid co-vid" muted autoplay loop playsinline>
<source src = "WebsiteVideos/covidvid.mp4" type = "video/mp4">
</video>
</div>
<div class = "col-lg-8 text-center my-auto">
<div class = "card-body">
<h4 class = "card-title">COVID-19 Checklist App</h4>
<h5 class = "card-title">Summer 2020 | <a href = "https://github.com/jgerega107/covidapp" class = "source-links">Source Code</a></h5>
<p class = "card-text">A simple Android app submission for DuckHacks 2020 that provides an interactive
UI for diagnosing COVID-19 symptoms, nearby testing centers, and a live chatroom.</p>
</div>
<ul class = "list-group list-group-flush tech">
<li class = "list-group-item">
<div class = "d-flex lan-use justify-content-around">
<i class="fab fa-java fa-3x" title = "Java"></i>
<i class = "fab fa-android fa-3x" title = "Android"></i>
<span class ="icon-firebase port-icon" title = "Google Cloud Firebase">
<span class ="path1"><span class = "path2"></span><span class = "path3"></span><span class ="path4"></span></span>
</span>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class = "carousel-item">
<div class = "my-site">
<div class = "card mb-3">
<div class = "row no-gutters">
<div class = "col-lg-6 text-center">
<img src = "img/site-collage.png" class = "img-fluid">
</div>
<div class = "col-lg-6 text-center my-auto">
<div class = "card-body">
<h4 class = "card-title">My Personal Website!</h4>
<h5 class = "card-title">Winter 2021 | <a href = "https://github.com/KevinHa48/MySite" class = "source-links">Source Code</a></h5>
<p class = "card-text">The website you are looking at right now! A simple website I built from scratch and with the help of Bootstrap.</p>
</div>
<ul class = "list-group list-group-flush tech">
<li class = "list-group-item">
<div class = "d-flex lan-use justify-content-around">
<i class= "fab fa-html5 fa-3x" title = "HTML5"></i>
<i class = "fab fa-css3-alt fa-3x" title = "CSS3"></i>
<i class = "fab fa-bootstrap fa-3x" title = "Bootstrap"></i>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<a class = "carousel-control-prev" href = "#carouselExampleControls" role = "button" data-slide = "prev">
<i class="fas fa-arrow-left fa-3x"></i>
<span class = "sr-only">Previous</span>
</a>
<a class = "carousel-control-next" href = "#carouselExampleControls" role = "button" data-slide = "next">
<i class="fas fa-arrow-right fa-3x"></i>
<span class = "sr-only">Next</span>
</a>
</body>
</html>