-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
124 lines (124 loc) · 5.05 KB
/
Copy pathindex.html
File metadata and controls
124 lines (124 loc) · 5.05 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
<!DOCTYPE html>
<html>
<head>
<title>Jonathan Hui</title>
<meta charset="UTF-8">
<!--change "max-width" to "device-width" if needed-->
<meta name="viewport" content="width=max-width initial-scale=1.0">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
<link rel="stylesheet" href="style.css">
<link rel="apple-touch-icon" sizes="180x180" href="./media/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./media/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./media/favicon/favicon-16x16.png">
<link rel="manifest" href="./media/favicon/site.webmanifest">
<meta property="og:image" content="./media/banner.png">
<meta property="og:site_name" content="jhui.gq">
</head>
<body>
<div class="view-wrapper">
<!--
<video autoplay loop muted playsinline>
<source src="https://ia800508.us.archive.org/3/items/Stars_2D/Stars.mp4" type="video/mp4">
</video>
-->
<div class="main" >
<div class="flex-container">
<div class="blob" style="min-width: 28rem; max-width: 28rem">
<h1 class="hello-anim" style="font-family: 'Courier New';">hello :)</h1>
</div>
<a href="https://jhui.gq" style="display: flex; align-self: flex-end;">
<div class="bloblink" style="padding: 1.6rem;">
<h2 style="margin: 0;">🏠</h2>
</div>
</a>
<div class="clear"></div>
</div>
<div class="flex-container">
<div class="blob" style="padding: 2rem">
<p style="text-align: center">Ni-Howdy! My name is Jonathan and I am an undergraduate at UCLA studying Computer Science. This is my personal site, so make yourself at home and feel free to hire me while you're here.</p>
</div>
<div class="clear"></div>
</div>
<div class="flex-container">
<div class="blob" id="fw1">
<h2>👀</h2>
<p style="text-align:center; max-width: 32rem;"><i>I am currently pursuing a gap term and am seeking internship opportunities for the 2021 calendar year.</i></p>
</div>
<div class="blob" style="display: flex; flex-direction: column;">
<h2>💼</h2>
<div class="space-container">
<a target="_blank" href="https://docs.google.com/viewer?url=https://docs.google.com/document/d/1rLk08w7pi-JqWFdiXaac7_1UfWSfTFyy-y74dSR7u_4/export?format=pdf">
<img class="img-link" src="media/icons/res.png" style="width:6rem; border-radius: 10%">
</a>
<a target="_blank" href="https://linkedin.com/in/jphui">
<img class="img-link" src="media/icons/in_white.png" style="width:6rem; border-radius: 17%">
</a>
<a target="_blank" href="https://github.com/jphui">
<img class="img-link" src="media/icons/gh3.png" style="width:6rem; border-radius: 50%">
</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="flex-container">
<a target="_blank" href="https://eggman.ml" style="display: flex; flex: 1">
<div class="bloblink" style="display: flex;">
<img src="media/icons/genie.png"
style="
height: 85%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
opacity: .25;">
<div
style="
position: relative;
z-index: 2;
margin: auto;
text-align:center;">
<p>Click this blob to meet my</p>
<p><b>Email Generator Genie</b><br>(aka E.G.G. Man)</p>
<p>
He is a Java webapp that will create a mock "spam email" after you train him with your input.
Go check him out, he complains about being bored too often!
</p>
</div>
</div>
</a>
<div class="flex-container-reverse">
<div class="blob" id="fw2" style="padding: 0">
<div style="padding: 3rem; ">
<img src="media/pfp.png"
style=" display: block;
margin: auto;
width:20rem;
border-radius: 1rem;">
</div>
<span style="display: block;
width: 100%;
text-align: center;
margin-top: 0;
padding-bottom: 1rem">
© 2020 <a style="color:crimson" target="_blank" href="mailto:jonjonhui999@gmail.com">Jonathan Hui</a>
</span>
</div>
<div class="blob">
<h2>🧑🏻</h2>
<p>hobbies <span style="color:#99AAB5">🎮,🏋️,🏕️ </span></p>
<p>food <a target="_blank" style="text-decoration:underline;" href="https://www.olivegarden.com/alfredo-sauce">Olive Garden Alfredo</a></p>
<p>movie <span style="color:#99AAB5">Disney's <a target="_blank" style="text-decoration:underline;" href="https://www.youtube.com/watch?v=XubM62q9nlw">Up</a></span></p>
<p>show <span style="color:#99AAB5">Clone Wars</span></p>
<p>book <span style="color:#99AAB5">Ready Player One</span></p>
<p>artist <span style="color:#99AAB5">Joji</span></p>
<p>emoji 🤔</p>
<p>mother's maiden name <span style="color:#99AAB5">nice try</span></p>
</div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
</body>
</html>