-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
210 lines (194 loc) · 10.9 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
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">
<meta name="description" content="My own site!">
<meta name="author" content="Joey Liu">
<link rel="shortcut icon" href="img/jp.png">
<title>Joey Production</title>
<!-- Online Source -->
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Bad+Script&subset=cyrillic' rel='stylesheet' type='text/css'>
<!-- Local Source -->
<link href="css/simple-sidebar.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/stars.css">
</head>
<body class="stardust">
<div class="container">
<div id="wrapper">
<!-- Sidebar -->
<div id="sidebar-wrapper">
<ul class="sidebar-nav">
<li class="sidebar-brand"><a id="jp-left" href="#" data-page="mainPage">J.p</a></li>
<li class="main-menu">Work.</li>
<li class="secondary-menu page" data-page="logo"><a href="#">LOGO DESIGN</a></li>
<li class="secondary-menu page" data-page="web"><a href="#">WEB DESIGN</a></li>
<li class="main-menu">About.</li>
<li class="secondary-menu page" id="profile-btn" data-page="profile"><a href="#">PROFILE</a></li>
<li class="secondary-menu page" id="resume-btn" data-page="profile">
<a href="http://registry.jsonresume.org/joeytall" target='_blank'>RESUME</a>
</li>
<li class="secondary-menu"><a href="https://www.facebook.com/joeytall.liu" target="_blank"><i class="fa fa-facebook-square fa-2x"></i></a></li>
<li class="secondary-menu"><a href="https://github.com/joeytall" target="_blank"><i class="fa fa-github fa-2x"></i></a></li>
<li class="secondary-menu"><a href="http://www.linkedin.com/in/joeytall" target="_blank"><i class="fa fa-linkedin fa-2x"></i></a></li>
<li class="secondary-menu"><a href="http://instagram.com/joeytall" target="_blank"><i class="fa fa-instagram fa-2x"></i></a></li>
<li class="secondary-menu"><a href="https://www.youtube.com/user/joeytall" target="_blank"><i class="fa fa-youtube fa-2x"></i></a></li>
<li class="main-menu">Contact.</li>
<li class="secondary-menu"><a href="mailto:joeytall.liu@gmail.com" target="_blank"><i class="fa fa-envelope fa-2x"></i></a></li>
</ul>
</div>
<!-- Page content -->
<div id="page-content-wrapper">
<div class="content-header">
<a id="menu-toggle" href="#" class="fa fa-chevron-left fa-2x white"></a>
<h1 class="jp white"> Joey Production.</h1>
</div>
<!-- Keep all page content within the page-content inset div! -->
<div class="page-content inset">
<div class="content mainPage currentPage">
<i class="fa fa-rocket fa-5x fa-rotate-0" id="rocket"></i>
<div class="grid">
<div class="star star-1"></div>
<div class="star star-2"></div>
<div class="star star-3"></div>
<div class="star star-4"></div>
<div class="star star-5"></div>
<div class="star star-6"></div>
<div class="star star-7"></div>
</div>
<div class="wrap clearfix">
<section class="clearfix">
<ul class="solarsystem">
<li class="sun" data-page="logo"><a href="#"><span>Sun</span></a></li>
<li class="earth" data-page="profile"><a href="#"><span>Earth</span></a></li>
<li class="earth one fa fa-rocket fa-4x" data-page="web"><a href="#"><span>Earth<span class="moon mone"> & Moon</span></span></a></li>
</ul>
</section>
</div>
</div>
<div class="content web">
<div class="jumbotron row">
<h2>Miami Plumbing and Heating Ltd.</h2>
<p>Miami Plumbing is a multilanguage site I designed and developed for Franco.
He founded the company in 1987, which is now a master plumber and home remodelling contractor serving Vancouver, Burnaby and Surrey.</p>
<div class="col-sm-12 col-md-12 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="maimi" href="img/miami/main.png">
<img src="img/miami/main.png" alt="main">
</a>
</div>
<div class="col-sm-12 col-md-12 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="maimi" href="img/miami/service.png">
<img src="img/miami/service.png" alt="service">
</a>
</div>
<p><a class="btn btn-primary btn-lg fa fa-external-link" role="button" href="http://joeyproduction.com/portfolio/miami/index.html" target="_blank"> Live View</a></p>
</div>
</div>
<div class="content logo">
<div class="jumbotron row">
<h2>Long Xuan Tea House</h2>
<p>This Bubble Tea place is amazing. I had a blast making the branding design for them, which includes logo, stamp card, front fasial sign, etc..<br>
They conveniently located at 4685 Kingsway in Burnaby, British Columbia.
I will definitely make a website for them when I had the chance!</p>
<div class="col-sm-12 col-md-12 col-lg-12 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="lx" href="img/logo/lx.png">
<img src="img/logo/lx.png" alt="slide">
</a>
</div>
<div class="col-sm-12 col-md-6 col-lg-6 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="lx" href="img/logo/stamp_card.png">
<img src="img/logo/stamp_card.png" alt="slide">
</a>
</div>
<div class="col-sm-12 col-md-6 col-lg-6 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="lx" href="img/logo/stamp_card_back.png">
<img src="img/logo/stamp_card_back.png" alt="slide">
</a>
</div>
<div class="col-sm-12 col-md-12 col-lg-12 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="lx" href="img/logo/sign.png">
<img src="img/logo/sign.png" alt="slide">
</a>
</div>
<div class="col-sm-12 col-md-12 col-lg-12 thumbnail real">
<a class="fancybox-buttons" data-fancybox-group="lx" href="img/logo/real.jpg" title="Picture By Oscar Shi">
<img src="img/logo/real.jpg" alt="slide">
</a>
</div>
<p>Thanks to Oscar Shi for taking the wonderful picture.</p>
<a class="btn btn-primary btn-lg fa fa-external-link" role="button" href="http://journey-oscarshi.com/authentic-savoury-bubble-tea/" target="_blank"> Detail Article</a>
<a class="btn btn-success btn-lg fa fa-external-link" role="button" href="http://portfolio.oscarshi.com/" target="_blank"> Oscar Shi</a>
</div>
<div class="jumbotron row">
<h2>Health Supply</h2>
<p>Health Supply is a great startup company founded by my previous houseowner, Jason. I had an opportunity to make some graphic designs for him.</p>
<div class="col-sm-12 col-md-12 col-lg-12 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="hs" href="img/logo/hs.png">
<img src="img/logo/hs.png" alt="slide">
</a>
</div>
<div class="col-sm-12 col-md-6 col-lg-6 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="hs" href="img/logo/cover_green.png">
<img src="img/logo/cover_green.png" alt="slide">
</a>
</div>
<div class="col-sm-12 col-md-6 col-lg-6 thumbnail">
<a class="fancybox-buttons" data-fancybox-group="hs" href="img/logo/cover_yellow.png">
<img src="img/logo/cover_yellow.png" alt="slide">
</a>
</div>
</div>
</div>
<div class="content profile">
<div class="jumbotron row">
<h2>Joey Liu</h2>
<p>A goal-oriented, fast-paced software developer who always tries to write better code.</p>
<p>And this is why you can't work from home.</p>
<div class="col-lg-12 col-md-12 col-sm-12 thumbnail">
<a class="fancybox" href="img/profile.jpg" title="Joey Liu">
<img id="profilePic" src="img/profile.jpg" class="img-rounded" alt="profile"></a>
</div>
<p><a class="btn btn-primary btn-lg fa fa-external-link" role="button" target="_blank" href="https://registry.jsonresume.org/joeytall"> Resume PDF</a></p>
</div>
</div>
<div class="content blog">
<div class="jumbotron">
<h2>Stupid Online Job App Question:</h2>
<p>In 150 characters or fewer, tell us what makes you unique. <br>
Try to be creative and say something that will catch our eye!*</p>
<p><a class="btn btn-danger btn-lg" role="button">Hey, I'm Bob...</a></p>
</div>
</div>
</div>
</div>
<a href="#" class="back-to-top fa fa-chevron-up fa-2x"></a>
<div class="footer">
All Rights Reserved © 2016. Designed by Joey Liu.
</div>
</div>
</div>
<!-- JavaScript -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://ricostacruz.com/jquery.transit/jquery.transit.min.js"></script>
<script src="js/button.js"></script>
<script src="js/stars.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="fancybox/lib/jquery.mousewheel.pack.js"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.js"></script>
<!-- Optionally add helpers - button, thumbnail and/or media -->
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-buttons.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-buttons.js"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-media.js"></script>
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-thumbs.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-thumbs.js"></script>
</body>
</html>