/
future.html
156 lines (136 loc) · 7.35 KB
/
future.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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<!--Styling CSS-->
<!-- <link rel="stylesheet" href="style/style.css"> -->
<style>
embed {
width: 90%;
height: 500px;
padding-left: 150px;
/* pointer-events: none; */
}
@media (max-width: 768px) {
embed {
width: 100%;
padding-left: 0;
/* height: 50%; */
}
}
#jumbo {
padding-bottom: 0px;
margin-bottom: 0px;
}
small {
font-size: xx-small;
}
#footer_border {
position: absolute;
left: 0;
right: 0;
width: 100%;
border-bottom: .5px solid;
border-color: darkgray;
}
img {
pointer-events: none;
}
</style>
<title>B.Harden's Portfolio</title>
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-md navbar-dark sticky-top" style="background-color: #000033;"> <!--htmlcolorcodes.com/color-chart/ (#000033)-->
<div class="container-fluid">
<a class="navbar-brand" href="index.html">
<img class="img-responsive" src="img\total-solar-eclipse_v1.jpg" data-toggle="tooltip" title="Return to Home Page">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="experience.html">Experience</a>
</li>
<li class="nav-item">
<a class="nav-link" href="projects.html">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" href="hobbies.html">Hobbies</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="future.html">Future</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Content-->
<div class="jumbotron" id="jumbo">
<h1 class="display-4">The Future</h1>
<p class="lead">
Welcome to The Future page 🔮. Here is where I discuss research I would like to conduct in the future.
</p>
<hr class="my-4">
<main role="main">
<section>
<!-- Research -->
<div class="card">
<div class="card-body">
<h5 class="card-title">Research</h5>
<p id="text" class="card-text font-italic">
Below is a research proposal I created that reviews using technologies such as virtual reality (vr), android robots and artificial intelligence for the training of Robotics Control Policies.
I propose conducting this type of research in order to not only create more human-like robotics potentially capable of "emotions"
but to also gain a better understanding of humans. This task was inspired by previous research conducted by roboticist Hiroshi Ishiguro,
Open.ai and many others.
</p>
<!-- Display warning about ?-mark symbols that show up in doc when viewed in browser. -->
<div id="info" class="font-italic font-weight-bold">*** The ?-mark symbols that show up in the document are due to formating issues in the browser. The ?-marks either represent an apostrofe (') or a raised, exponent-like digit that represents a reference to the footnotes. I have no idea why they show in some places an not others. Sorry! ***</div>
<br>
<br>
<embed src="img\VR Training for HRI(2018).htm#toolbar=0">
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer>
<hr class="my-2">
<div class="container text-center">
<div class="row">
<div class="col">
<table class="table table-sm text-left">
<thead>
<tr>
<th class="font-weight-normal" scope="col" style="font-size: small; padding-left: 60px; padding-bottom: 0px; border: none;">Contact</th>
<th class="font-weight-normal" scope="col" style="font-size: small; padding-left: 9px; padding-bottom: 0px; border: none;">Social</th>
</tr>
</thead>
<tbody>
<tr>
<td class="font-weight-light" style="font-size: smaller; border: none;">Email: b.harden92@gmail.com</td>
<td style="border: none; font-size: smaller;"><a href="https://www.linkedin.com/in/brandon-harden-social">linkedin</a></td>
</tbody>
</table>
</div>
</div>
<!-- <div id="footer_border"></div> -->
<small class="text-muted">Copyright ©2023 b-harden.github.io/Portfolio/</small>
</div>
</footer>
</div>
<!-- Scripts for JavaScript functionality--> <!-- jQuery must come first, then Popper.js, and then BootStrap's JavaScript plugins-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>