-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
150 lines (132 loc) · 7.49 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
139
140
141
142
143
144
145
146
147
148
149
150
<!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">
<meta name="description" content="About me">
<meta name="author" content="Jerr">
<title>Home Page</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<!-- Custom styles for this template -->
<link href="styles/index.css" rel="stylesheet">
<link href="styles/standard.css" rel="stylesheet">
</head>
<body class="dusk-grad">
<main role="main">
<div class="container">
<!-- Nav Bar -->
<header>
<nav class="navbar navbar-expand-md navbar-light">
<div class="container d-flex justify-content-between"> <!-- Center Header -->
<a class="navbar-brand black-text" href="index.html">
<h2>Jerry</h2>
</a>
<!-- collapsed controls -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div id="navbarCollapse" class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="extrafiles/jerry_chen_resume.pdf">Resume</a>
</li>
<!-- <li class="nav-item">
<a class="nav-link" href="about.html">About</a>
</li> -->
<!-- <li class="nav-item">
<a class="nav-link" href="gallary/showcase.html">Gallary</a>
</li> -->
<!-- <li class="nav-item">
<a class="nav-link" href="vent/cover.html">Blog</a>
</li> -->
</ul>
</div>
</div>
</nav>
</header>
<!-- Header Portion -->
<section class="jumbotron text-center cover-bg">
<!-- 80px padding added to prevent nav from overlapping, temp -->
<div class="container">
<img class="rounded-circle border" src="images/bw_selfie.jpg" alt="Profile Photo" width="200" height="200">
<h1 class="jumbotron-heading text-border">Jerry | UIUC 2019</h1>
<!-- <p class="lead text-muted">Something short and leading about the collection below—its contents, the creator, etc. Make it short and sweet, but not too short so folks don't simply skip over it entirely.</p> -->
<p>
<a href="https://github.com/jerr-chen" class="btn">
<img src="images/github_icon.png" width=50 height=50 alt="Github Icon">
</a>
<a href="https://www.linkedin.com/in/jerry-chen/" class="btn">
<img src="images/linkedin_icon.png" width=50 height=50 alt="LinkedIn Icon">
</a>
<a href="https://www.instagram.com/jerr_chen" class="btn">
<img src="images/instagram_icon.png" width=50 height=50 alt="Instagram Icon">
</a>
</p>
</div>
</section>
</div>
<!-- CONTENT -->
<div class="container marketing">
<div class="container text-left" style="width: 85%;">
<p class="lead black-text">
</p>
</div>
<!-- START THE FEATURETTES -->
<div class="row featurette">
<div class="col-md-7 text-center">
<h2 class="featurette-heading text-border">Hiking in the Smokey Mountains. <span class="text-muted">4950 feet up!</span></h2>
<p class="lead black-text">
That's me sitting by a checkpoint marker for Mt. Conte 2.2 miles from the entrance of the trail. At the time of the hike, the trails were icey and took a while to safely reach the marker, but in the end, the view showed a blanket of snow from the night before as far as you can see. It was breathtakingly beautiful.<br>
</p>
<a class="btn btn-primary btn-margin" href="gallary/national_parks.html" role="button">58 National Parks! See More »</a>
</div>
<div class="col-md-5">
<img class="featurette-image img-fluid mx-auto border" data-src="holder.js/500x500/auto" alt="4950ft Alum Cave Bluff" width=500 height=500 src="images/smokey_mt_marker.jpg" data-holder-rendered="true">
</div>
</div>
<!-- <hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7 order-md-2 text-center">
<h2 class="featurette-heading text-border">I love to cook. <span class="text-muted">See for yourself!</span></h2>
<p class="lead black-text">
I asked my dad to teach me how to make his broth. This is a photo of my attempt at making ramen with the broth and korean wheat noodles with various toppings. I was missing something from the broth, but the soft-boiled eggs definitely made the dish better with its creamy yolk.
</p>
<a class="btn btn-primary btn-margin" href="#" role="button">Recipes See More »</a>
</div>
<div class="col-md-5 order-md-1">
<img class="featurette-image img-fluid mx-auto border" data-src="holder.js/500x500/auto" alt="500x500" width=500 height=500 src="images/ramen.jpg" data-holder-rendered="true">
</div>
</div> -->
<!-- <hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7 text-center">
<h2 class="featurette-heading text-border"><span class="text-muted"></span></h2>
<p class="lead black-text">
</p>
<a class="btn btn-primary btn-margin" href="#" role="button">See More! »</a>
</div>
<div class="col-md-5">
<img class="featurette-image img-fluid mx-auto border" data-src="holder.js/500x500/auto" alt="500x500" width=500 height=500 src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22500%22%20height%3D%22500%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20500%20500%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_1639065e6e5%20text%20%7B%20fill%3A%23AAAAAA%3Bfont-weight%3Abold%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A25pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_1639065e6e5%22%3E%3Crect%20width%3D%22500%22%20height%3D%22500%22%20fill%3D%22%23EEEEEE%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22185.13333129882812%22%20y%3D%22261.27999954223634%22%3E500x500%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" data-holder-rendered="true">
</div>
</div> -->
<hr class="featurette-divider" style="margin-bottom: 0rem;">
</div>
<!-- FOOTER -->
<footer class="container text-center" id="footer">
<p>
<a href="#">Back to top</a><br>
Hosted on <a href="https://pages.github.com/">GitHub</a><br>
Built with <a href="https://getbootstrap.com/">Bootstrap</a><br>
Copyright © 2018
</p>
</footer>
</main>
<!-- Bootstrap core JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<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.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
</body>
</html>