xinyichen516.github.io/blog.html at master · xinyichen516/xinyichen516.github.io · GitHub

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
<!DOCTYPE html>
<html>
<head>
	<title>Xin Yi Chen || Blog</title>
	<link rel="stylesheet" type="text/css" href="assets/css/blogstyle.css">
	<link href="https://fonts.googleapis.com/css?family=Droid+Sans+Mono|Meddon|Open+Sans:400,600,800" rel="stylesheet">
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script>
	<script type="text/javascript">
	$(function(){
	   // See if this is a touch device
	   if ('ontouchstart' in window)
	   {
	      // Set the correct [touchscreen] body class
	      $('body').removeClass('no-touch').addClass('touch');

	      // Add the touch toggle to show text when tapped
	      $('div.boxInner img').click(function(){
	         $(this).closest('.boxInner').toggleClass('touchFocus');
	      });
	   }
	});
	</script>
</head>
<body class="no-touch">
	<nav>
		<ul>
		  <li><a href="index.html">Home</a></li>
		  <li><a href="aboutme.html">About Me</a></li>
		  <li><a href="resume.html">Resume</a></li>
		  <li><a href="contact.html">Contact Me</a></li>
		  <li><a class="active" href="blog.html">Blog</a></li>
		</ul>
	</nav>
	<div id="header">
		<span id="hellotext">Hello</span>
		<span id="lifetext">Life</span>
		<div>Click a tile to open a post! </div>
	</div>

	<div class="wrap">
		<div class="box">
			<div class="boxInner">
				<a href="blogposts/sfday.html"><img src="assets/img/bobaguys.jpg" /></a>
				<div class="titleBox">A Rare San Francisco Day</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/disney.jpg" />
				<div class="titleBox">Disney Days are WILDE</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/packingdistrict.jpg" />
				<div class="titleBox">How to Study with High Quali-TEA Aesthetics</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/republique.jpg" />
				<div class="titleBox">Why Gold Leaf is Overrated</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/starbucks.jpg" />
				<div class="titleBox">The Problem With Starbucks</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/sunset.jpg" />
				<div class="titleBox">Why I Prefer Sunsets</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/deca.jpg" />
				<div class="titleBox">How DECA Journey Made Me Who I Am</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/watch.jpg" />
				<div class="titleBox">How To Maximize Your Productivity</div>
			</div>
		</div>
		<div class="box">
			<div class="boxInner">
				<img src="assets/img/clouds.jpg" />
				<div class="titleBox">Hawaii Adventuring</div>
			</div>
		</div>
	</div>

</body>
</html>