-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathblog.html
145 lines (145 loc) · 8.52 KB
/
blog.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
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<title>My Blog</title>
<link rel="stylesheet" href="blog.css"/>
<link rel="icon" type="image/x-icon" href="blog.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fira+Mono:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
</head>
<body>
<section>
<h1 class="heading">
Blog
</h1>
<ul>
<li class="dates">
16-01-2023
<h1 class="blog_title">
Started a blog page
</h1>
<p>
Hooray!!
</p>
<img src="happy.jpg">
</li>
<li class="dates">
14-01-2023
<h1 class="blog_title">
Great Mates 2023 Arc Event
</h1>
<p>
I had nothing to do today so I thought what better way to step foot in UNSW for the first time this year than to meet new people.
I was super shy 👉👈 because I went alone. I approached some international students because I overheard them conversing in cantonese and since I spoke it too,
they would feel comfortable interacting with me. They were cool people. Turns out they were all here at UNSW for an exchange program. We were soon chatty and
the environment became more cordial. They mentioned apparently that the event was supposed to be for exchange students. I was completely shocked. Dumbfounded by
this, I became even more unnnerved.
</p>
<p>
When we got into groups, it was apparent that it was in fact NOT only catered for exchange students. I heaved a sigh of relief. I found everyone in our group to be
interesting one way or another. One guy travelled 3 days from some part of South America (I forgot 💀) to get to UNSW and study their masters in some biology degree
and for the first time, I met someone from the US. However, most people there were international/exchange students and only a few were local/domestic students.
</p>
<p>
After the event ended, I stayed to talk to the people that stayed. A few of them were in my group and I got to meet a couple more people. We all got together and formed a
little group. It was pretty cool. We left the area together and we walked as a whole holding our tiny conversations between each other. We sat for a bit at the UNSW sports
field appreciating the nostalgic view of rowdy children playing soccer on the field. Our conversations continued to flow smoothly like a zephyr. The sun was smiling, the
sky was a canvas painted with a spread of calming blue and dabs of purified white. Being in that moment was a serendipitous experience.
</p>
<p>
Afterwards, we went to have lunch together and then played pool. We ended the day at a bar that had a bollywood themed night and complementary drinks. The person who
suggested we come to the bar couldn't get inside because the bouncer didn't accept online passports 😭. Anyhow, the rest of us still had a great time. This entire experience
was enriching and I hope to meet such great people in future events.
</p>
<p>
Here's a photo we took that day 😄
</p>
<img src="group_photo_1.jpg">
</li>
<li class="dates">
01-01-2023
<h1 class="blog_title">
Spending New Years with friends
</h1>
<p>
Arriving at the Circular Quay at 3 P.M., I was aghast at the unprecedented amount of people at the vicinity. I was with another two friends searching for the other people
from our group that have already rendezvoused there. The air was stifling. Eager tourists continued to swarm the area claiming any area I call fireworks watching spot that they
call territory. However, the atmosphere of laughter and conversations filled the area with a communal feeling of departure and vitality. We were all excited for the new year;
excited to glimpse at the near future.
</p>
<p>
We left due to the sheer abundance of people to a more accessible firework watching spot. After some commute and walking, we arrived at Cremorne Reserve. We watched the
9 P.M. fireworks; mesmerised at the picturesque display of vibrant colours. However, internally, we were all brooding about our new years resolutions and awaiting for the
"real" fireworks display.
</p>
<p>
We had a Macca's run closeby and we moved to Milson's Point to view from another spot. It was the brink of midnight. We all stood there in awe some in sorrow. Our new
year's resolutions at the tip of our lips and our eyes fixated at the sky. The sky was a beacon for festivity and positivity. The explosions in the sky reflected the
chaotic energy as we all let go of the year before us and filled the night with laughter and cheers.
</p>
<p>
These people around me are some of the best people in my life. I hope to continue to share these moments together as we grow older together every year.
</p>
<p>
Here are some photos from that day below. 🎆🎇🎉
</p>
<img src="group_photo_2.jpg">
<img src="fireworks.jpg">
</li>
<!--</li>
<li>
01-01-2023
</li>
<li>
01-01-2023
</li>
<li>
01-01-2023
</li>-->
</ul>
</section>
<div class="bubbles">
<div class="bubble-l"></div>
<div class="bubble-l"></div>
<div class="bubble-l"></div>
<div class="bubble-l"></div>
<div class="bubble-l"></div>
<div class="bubble-r"></div>
<div class="bubble-r"></div>
<div class="bubble-r"></div>
<div class="bubble-r"></div>
<div class="bubble-r"></div>
<div class="bubble-l"></div>
<div class="bubble-l"></div>
<div class="bubble-l"></div>
<div class="bubble-r"></div>
<div class="bubble-r"></div>
</div>
</body>
</html>
<script>
window.addEventListener('scroll', function() {
const num_titles = 3;
var all_bounds = [];
for (let i = 0; i < num_titles; i ++) {
all_bounds.push(document.getElementsByClassName("blog_title")[i].getBoundingClientRect())
}
//var all_bounds = [one, two, three];
var j = 0;
for (var i of all_bounds) {
if (i.top >= 0 && i.left >= 0 && i.right <= i.right <= (window.innerWidth || document.documentElement.clientWidth)
&& i.bottom <= (window.innerHeight || document.documentElement.clientHeight)) {
document.getElementsByClassName("dates")[j].classList.add("appear");
break;
}
else {
j += 1;
}
}
});
</script>