Skip to content

Commit 47d7adf

Browse files
johnrsojohnrso
committed
change blog formatting
1 parent 5ca06eb commit 47d7adf

File tree

7 files changed

+221
-7
lines changed

7 files changed

+221
-7
lines changed

‎_layouts/blog.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html lang="en-us">
2+
<html>
3+
<head>
4+
<title>{{ page.title }}</title>
5+
<link rel="stylesheet" href="/css/blog.css">
6+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine">
7+
<link rel="icon" href="/media/img/favicon.png" type="image/png">
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
9+
<meta name="author" content="John So">
10+
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
11+
</head>
12+
<body>
13+
<div class="outer-container">
14+
<div class="flex-container">
15+
{{ content }}
16+
</div>
17+
</div>
18+
</body>
19+
</html>

‎_layouts/default.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html>
33
<head>
44
<title>{{ page.title }}</title>
5-
<link rel="stylesheet" href="/index.css">
5+
<link rel="stylesheet" href="/css/index.css">
66
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine">
77
<link rel="icon" href="/media/img/favicon.png" type="image/png">
88
<meta name="viewport" content="width=device-width, initial-scale=1.0">

‎_layouts/post.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
layout: default
2+
layout: blog
33
---
44
<div class="text-container">
55

‎_posts/2024-03-17-1ht.markdown

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@ date: 2024-03-17 13:32:03 -0700
66
categories: jekyll update
77

88
---
9-
A short and informal life update: I have made the executive decision to start a blog! I mainly want to run this as a combination of a research journal, readings, and thoughts as they come up. The past few months have really changed how I view the world and myself, and I want to capture the metamorphosis of my thoughts as they happen.
9+
A short and informal life update: I have made the executive decision to start a blog! I mainly want to run this as a combination of a research journal, readings, and thoughts as they come up. The past few months have really changed how I view the world and myself, and I want to capture the metamorphosis of my thoughts as they happen.
1010
\
1111
\
12-
I've been intending to start writing for quite a while now. I actually attempted to kick one off earlier this academic year (which lasted for a total of 1 post). One large blocker, which I never overcame previously, was a pressure to put out "polished" content. My mindset this time is that I'm writing this for my own benefit; if others find it interesting, that's a bonus. The other large blocker was a lack of time to focus on what I found important, and moreso trying to figure out what is actually important. Hopefully this time goes different.
12+
I've been intending to start writing for quite a while now. I actually attempted to kick one off earlier this academic year (which lasted for a total of 1 post). One large blocker, which I never overcame previously, was a pressure to put out "polished" content. My mindset this time is that I'm writing this for my own benefit; if others find it interesting, that's a bonus. Specifically, for these _one hour thoughts_ posts, I'll be writing for one hour, do minor edits, and then publish them as they are. The other large blocker was a lack of time to focus on what I found important, and moreso trying to figure out what is actually important. Hopefully this time goes different.
1313
\
1414
\
1515
I recently wrapped up the second quarter of my Master's program at Stanford, and my time here thus far can be characterized by pretty serious burnout, and not adjusting well to the change in environment. I've often found myself comparing the opportunities I've received at Stanford and the hypothetical opportunities I would have received at Berkeley, mainly in terms of work; I haven't found nearly as much fulfillment or interest in the research or courses that I've been doing here. It does feel at times that I feel that I'm starting from the bottom of the metaphorical ladder, which is all the more frustrating considering the progress I had made while an undergrad. More importantly, there were threads that needed to be wrapped up at Berkeley, which took much longer because of commitments that I had made at Stanford that didn't align well with what I wanted to do. This is the source of my burnout; I think about work in terms of "effort in, fulfillment out", and for the past few months, this ratio has been very low.

‎blog.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
layout: default
2+
layout: blog
33
title: joso journal
44
---
55

@@ -12,7 +12,7 @@ <h1>joso journal</h1>
1212
</div>
1313
</div>
1414
<div class="text-container">
15-
<p>A very informal collection of things I've made and thoughts I've thought:</p>
15+
<p>A very informal collection of things I've made and thoughts I've thought.</p>
1616
<ul class="posts">
1717
{% for post in site.posts %}
1818
<li><span>{{ post.date | date_to_string }}</span> &raquo; <a href="{{ post.url }}">{{ post.title }}</a></li>

‎css/blog.css

Lines changed: 196 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,196 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300');
2+
3+
* {
4+
box-sizing: border-box;
5+
line-height: 1.5;
6+
font-size: 16px;
7+
}
8+
9+
body {
10+
margin: 0;
11+
padding: 0;
12+
font-family: 'Roboto', sans-serif;
13+
background-color: rgb(30, 30, 30);
14+
color: rgb(200, 200, 200);
15+
}
16+
17+
button {
18+
border: none;
19+
cursor: pointer;
20+
appearance: none;
21+
background-color: inherit;
22+
}
23+
24+
.light {
25+
background-color: rgb(245, 245, 245);
26+
color: #333;
27+
}
28+
29+
h1 {
30+
font-size: 26px;
31+
margin: 0;
32+
}
33+
34+
h2 {
35+
font-size: 22px;
36+
margin: 0;
37+
}
38+
39+
h3 {
40+
font-size: 18px;
41+
margin: 0;
42+
}
43+
44+
p {
45+
color: rgb(175, 175, 175);
46+
margin: 0px 0 2px 0;
47+
}
48+
49+
hr {
50+
border-color: rgb(125, 125, 125);
51+
width: 100%;
52+
margin: 20px 0 20px 0;
53+
}
54+
55+
.light hr {
56+
border-color: #ddd;
57+
}
58+
59+
/* reduce the left margin of lists */
60+
ol, ul {
61+
padding-left: 20px; /* Adjust the value as needed */
62+
color: rgb(175, 175, 175);
63+
}
64+
65+
li {
66+
margin: 0;
67+
color: rgb(175, 175, 175);
68+
}
69+
70+
.light p {
71+
color: #555;
72+
}
73+
74+
.light ol, .light ul {
75+
color: #555;
76+
}
77+
78+
.light li {
79+
color: #555;
80+
}
81+
82+
a {
83+
color: rgb(146, 174, 227);
84+
text-decoration: none;
85+
}
86+
87+
.light a {
88+
/* lighter blue */
89+
color: rgb(0, 0, 170);
90+
}
91+
92+
a:hover { text-decoration: underline;}
93+
94+
/* layout */
95+
96+
.outer-container {
97+
display: flex;
98+
justify-content: center;
99+
align-items: flex-start;
100+
}
101+
102+
.flex-container {
103+
width: 100%;
104+
max-width: 700px;
105+
padding: 20px;
106+
}
107+
108+
.text-container {
109+
flex: 100;
110+
min-width: 250px;
111+
display: flex;
112+
text-align: justify;
113+
text-justify: inter-word;
114+
flex-direction: column;
115+
justify-content: space-between;
116+
align-items: left;
117+
margin:10px;
118+
}
119+
120+
.section {
121+
display: flex;
122+
flex-wrap: wrap;
123+
margin-top: 5px;
124+
}
125+
126+
.subsection {
127+
display: flex;
128+
flex-wrap: wrap;
129+
flex-direction: row-reverse;
130+
justify-content: center;
131+
width: 100%;
132+
margin-bottom: 5px;
133+
}
134+
135+
/* heading and footer */
136+
137+
.footer {
138+
display: flex;
139+
flex-direction: row;
140+
justify-content: right;
141+
align-items: right;
142+
margin-bottom: 15px;
143+
}
144+
145+
.title-text {
146+
margin-top: 5px;
147+
}
148+
149+
/* media */
150+
151+
.title-img {
152+
height: 75px;
153+
width: 75px;
154+
}
155+
156+
.title-img * {
157+
width: 100%;
158+
border-radius: 3px;
159+
border: 1px solid rgb(50, 50, 50);
160+
}
161+
162+
.light .title-img * {
163+
border: 1px solid #ddd;
164+
}
165+
166+
.project-media {
167+
margin: 10px;
168+
width: 100%;
169+
max-width: 150px;
170+
}
171+
172+
.project-media * {
173+
border-radius: 3px;
174+
width: 100%;
175+
}
176+
177+
/* papers */
178+
179+
.badge {
180+
display: inline-block;
181+
padding: 0.25em 0.4em;
182+
margin-right: 5px;
183+
font-size: 80%;
184+
text-align: center;
185+
white-space: nowrap;
186+
border-radius: 5px;
187+
vertical-align: baseline;
188+
}
189+
190+
.conference {
191+
background-color: rgb(33, 61, 90);
192+
}
193+
194+
.light .conference {
195+
background-color: rgb(210, 222, 235);
196+
}

‎index.css renamed to ‎css/index.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,6 @@ li {
8080
}
8181

8282
a {
83-
font-size: 14px;
8483
color: rgb(146, 174, 227);
8584
text-decoration: none;
8685
}

0 commit comments

Comments
 (0)