Compare commits
12 Commits
f486d592b6
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| 35b8e07833 | |||
| f8a79f0c1a | |||
|
|
9839fab5ea | ||
| 5e9d3c35b0 | |||
| c2c1656c5c | |||
| c89c6e155c | |||
| 377b0676c2 | |||
| 851c773295 | |||
| 2a322f53c4 | |||
| 6cb54cd422 | |||
| 18418f261b | |||
| 8cd2ac9b77 |
@@ -6,18 +6,13 @@ on:
|
|||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
deploy:
|
deploy:
|
||||||
runs-on: ubuntu-latest
|
runs-on: alpine-rsync
|
||||||
if: contains(gitea.event.head_commit.message, '[deploy]')
|
if: contains(gitea.event.head_commit.message, '[deploy]')
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
- name: Checkout
|
- name: Checkout
|
||||||
uses: actions/checkout@v4
|
uses: actions/checkout@v4
|
||||||
|
|
||||||
- name: Install ssh + rsync
|
|
||||||
run: |
|
|
||||||
sudo apt-get update
|
|
||||||
sudo apt-get install -y openssh-client rsync
|
|
||||||
|
|
||||||
- name: Setup SSH
|
- name: Setup SSH
|
||||||
env:
|
env:
|
||||||
SSH_PRIVATE_KEY: ${{ secrets.SSH_PRIVATE_KEY }}
|
SSH_PRIVATE_KEY: ${{ secrets.SSH_PRIVATE_KEY }}
|
||||||
@@ -25,17 +20,16 @@ jobs:
|
|||||||
mkdir -p ~/.ssh
|
mkdir -p ~/.ssh
|
||||||
echo "$SSH_PRIVATE_KEY" > ~/.ssh/id_ed25519
|
echo "$SSH_PRIVATE_KEY" > ~/.ssh/id_ed25519
|
||||||
chmod 600 ~/.ssh/id_ed25519
|
chmod 600 ~/.ssh/id_ed25519
|
||||||
ssh-keyscan -p 22 "rchou.org" >> ~/.ssh/known_hosts
|
ssh-keyscan -p 22 "rchou.net" >> ~/.ssh/known_hosts
|
||||||
chmod 644 ~/.ssh/known_hosts
|
chmod 644 ~/.ssh/known_hosts
|
||||||
|
|
||||||
- name: Rsync to server
|
- name: Rsync to server
|
||||||
env:
|
env:
|
||||||
SSH_TARGET_DIR: /home/cab/docker/blog/src
|
SSH_TARGET_DIR: /home/cab/docker/websites/blog-src
|
||||||
RSYNC_SOURCE: .
|
RSYNC_SOURCE: .
|
||||||
run: |
|
run: |
|
||||||
rsync -rz --delete \
|
rsync -rz --delete \
|
||||||
--no-times --no-perms --no-owner --no-group \
|
--no-times --no-perms --no-owner --no-group \
|
||||||
--omit-dir-times --mkpath \
|
--omit-dir-times --mkpath \
|
||||||
-e "ssh -i ~/.ssh/id_ed25519 -p 22" \
|
-e "ssh -i ~/.ssh/id_ed25519 -p 22" \
|
||||||
"$RSYNC_SOURCE"/ "deploy@rchou.org:${SSH_TARGET_DIR}/"
|
"$RSYNC_SOURCE"/ "deploy@rchou.net:${SSH_TARGET_DIR}/"
|
||||||
|
|
||||||
|
|||||||
1
.gitignore
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
.DS_Store
|
||||||
BIN
blog/.DS_Store
vendored
@@ -1,168 +0,0 @@
|
|||||||
body {
|
|
||||||
font-family: 'IBM Plex Mono', monospace;
|
|
||||||
font-family: 'IBM Plex Sans', sans-serif;
|
|
||||||
margin: 0;
|
|
||||||
color: white;
|
|
||||||
background-color: #111;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mid {
|
|
||||||
width: 650px;
|
|
||||||
margin: auto;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
.mid {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
text-align: left;
|
|
||||||
font-size: 3.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
text-align: left;
|
|
||||||
font-size: 2.8rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
width: 650px;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
hr {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* unvisited link */
|
|
||||||
a:link {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* visited link */
|
|
||||||
a:visited {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* mouse over link */
|
|
||||||
a:hover {
|
|
||||||
color: #62bd69;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* selected link */
|
|
||||||
a:active {
|
|
||||||
color: #62bd69;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
text-align: left;
|
|
||||||
list-style-position: outside;
|
|
||||||
}
|
|
||||||
|
|
||||||
.movie-container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 10px;
|
|
||||||
width: 674px;
|
|
||||||
margin:20px auto 20px auto;
|
|
||||||
position: relative;
|
|
||||||
background-color: #222;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
.movie-container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.poster {
|
|
||||||
flex: 0 0 auto;
|
|
||||||
margin-right: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.poster img {
|
|
||||||
width: 200px;
|
|
||||||
height: 300px;
|
|
||||||
object-fit: cover;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review h2 {
|
|
||||||
font-size: 24px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.review p {
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 1.5;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
margin: auto;
|
|
||||||
width: 650px;
|
|
||||||
background: #222;
|
|
||||||
padding: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
.footer {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links {
|
|
||||||
text-align: center;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a {
|
|
||||||
color: white;
|
|
||||||
margin: 0px 5px 0px 5px;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: color 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links p {
|
|
||||||
margin: 0px 5px 0px 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(2):hover {
|
|
||||||
color:#d1479e;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(3):hover {
|
|
||||||
color:#4ba2c4;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(4):hover {
|
|
||||||
color:#1DB954;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(5):hover {
|
|
||||||
color:#d1c649;
|
|
||||||
}
|
|
||||||
@@ -1,273 +0,0 @@
|
|||||||
body {
|
|
||||||
font-family: 'IBM Plex Mono', monospace;
|
|
||||||
font-family: 'IBM Plex Sans', sans-serif;
|
|
||||||
margin: 0;
|
|
||||||
color: white;
|
|
||||||
background-color: #111;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mid {
|
|
||||||
width: 650px;
|
|
||||||
margin: auto;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
.mid {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
text-align: left;
|
|
||||||
font-size: 3.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
text-align: left;
|
|
||||||
font-size: 2.8rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
width: 650px;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
hr {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* unvisited link */
|
|
||||||
a:link {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* visited link */
|
|
||||||
a:visited {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* mouse over link */
|
|
||||||
a:hover {
|
|
||||||
color: #62bd69;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* selected link */
|
|
||||||
a:active {
|
|
||||||
color: #62bd69;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
text-align: left;
|
|
||||||
list-style-position: outside;
|
|
||||||
}
|
|
||||||
|
|
||||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic);
|
|
||||||
blockquote{
|
|
||||||
font-size: 1.4em;
|
|
||||||
width: 650px;
|
|
||||||
margin: 50px auto;
|
|
||||||
font-family: Open Sans;
|
|
||||||
font-style: italic;
|
|
||||||
color: darkgray;
|
|
||||||
padding: 1.2em 30px 1.2em 30px;
|
|
||||||
border-left: 8px solid #62bd69 ;
|
|
||||||
line-height: 1.6;
|
|
||||||
text-align: center;
|
|
||||||
position: relative;
|
|
||||||
background: #222;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
blockquote {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote::before{
|
|
||||||
font-family: Arial;
|
|
||||||
content: "\201C";
|
|
||||||
color: #62bd69;
|
|
||||||
font-size: 4em;
|
|
||||||
position: absolute;
|
|
||||||
left: 10px;
|
|
||||||
top: -10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote::after{
|
|
||||||
content: '';
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote span{
|
|
||||||
display: block;
|
|
||||||
color: white;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: bold;
|
|
||||||
margin-top: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
margin: auto;
|
|
||||||
width: 650px;
|
|
||||||
background: #222;
|
|
||||||
padding: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
.footer {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links {
|
|
||||||
text-align: center;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a {
|
|
||||||
color: white;
|
|
||||||
margin: 0px 5px 0px 5px;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: color 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links p {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
margin: 0px 5px 0px 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(2):hover {
|
|
||||||
color:#d1479e;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(3):hover {
|
|
||||||
color:#4ba2c4;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(4):hover {
|
|
||||||
color:#1DB954;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-links a:nth-child(5):hover {
|
|
||||||
color:#d1c649;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Position the image container (needed to position the left and right arrows) */
|
|
||||||
.container {
|
|
||||||
width: 650px;
|
|
||||||
margin: auto;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 650px) {
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide the images by default */
|
|
||||||
.mySlides {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add a pointer when hovering over the thumbnail images */
|
|
||||||
.cursor {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Next & previous buttons */
|
|
||||||
.prev,
|
|
||||||
.next {
|
|
||||||
cursor: pointer;
|
|
||||||
position: absolute;
|
|
||||||
top: 40%;
|
|
||||||
width: auto;
|
|
||||||
padding: 16px;
|
|
||||||
margin-top: -50px;
|
|
||||||
color: white;
|
|
||||||
background-color: rgba(0, 0, 0, 0.4);
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 20px;
|
|
||||||
border-radius: 0 3px 3px 0;
|
|
||||||
user-select: none;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Position the "next/prev button" to the right/left */
|
|
||||||
.prev {
|
|
||||||
left: 0;
|
|
||||||
border-radius: 3px 0 0 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.next {
|
|
||||||
right: 0;
|
|
||||||
border-radius: 3px 0 0 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* On hover, add a black background color with a little bit see-through */
|
|
||||||
.prev:hover,
|
|
||||||
.next:hover {
|
|
||||||
background-color: rgba(0, 0, 0, 0.8);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Number text (1/3 etc) */
|
|
||||||
.numbertext {
|
|
||||||
color: #f2f2f2;
|
|
||||||
font-size: 12px;
|
|
||||||
padding: 8px 12px;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Container for image text */
|
|
||||||
.caption-container {
|
|
||||||
text-align: center;
|
|
||||||
background-color: #222;
|
|
||||||
padding: 2px 16px;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.row:after {
|
|
||||||
content: "";
|
|
||||||
display: table;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 10 columns side by side */
|
|
||||||
.column {
|
|
||||||
float: left;
|
|
||||||
width: 10%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add a transparency effect for thumnbail images */
|
|
||||||
.demo {
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.active,
|
|
||||||
.demo:hover {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
@@ -1,6 +0,0 @@
|
|||||||
This favicon was generated using the following graphics from Twitter Twemoji:
|
|
||||||
|
|
||||||
- Graphics Title: 1f331.svg
|
|
||||||
- Graphics Author: Copyright 2020 Twitter, Inc and other contributors (https://github.com/twitter/twemoji)
|
|
||||||
- Graphics Source: https://github.com/twitter/twemoji/blob/master/assets/svg/1f331.svg
|
|
||||||
- Graphics License: CC-BY 4.0 (https://creativecommons.org/licenses/by/4.0/)
|
|
||||||
|
Before Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 439 B |
|
Before Width: | Height: | Size: 821 B |
|
Before Width: | Height: | Size: 15 KiB |
@@ -1 +0,0 @@
|
|||||||
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
|
|
||||||
BIN
blog/img/.DS_Store
vendored
|
Before Width: | Height: | Size: 1.2 MiB |
|
Before Width: | Height: | Size: 257 KiB |
|
Before Width: | Height: | Size: 944 KiB |
|
Before Width: | Height: | Size: 417 KiB |
|
Before Width: | Height: | Size: 483 KiB |
|
Before Width: | Height: | Size: 322 KiB |
|
Before Width: | Height: | Size: 945 KiB |
|
Before Width: | Height: | Size: 567 KiB |
|
Before Width: | Height: | Size: 309 KiB |
|
Before Width: | Height: | Size: 663 KiB |
191
blog/index.html
@@ -1,191 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>ryan's website</title>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta name="color-scheme" content="dark light" />
|
|
||||||
<meta name="robots" content="noindex" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
||||||
|
|
||||||
<link href="./css/style.css" rel="stylesheet" type="text/css">
|
|
||||||
|
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="./favicon/apple-touch-icon.png"/>
|
|
||||||
<link rel="icon" type="image/png" sizes="32x32" href="./favicon/favicon-32x32.png"/>
|
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="./favicon/favicon-16x16.png"/>
|
|
||||||
<link rel="manifest" href="./favicon/site.webmanifest"/>
|
|
||||||
|
|
||||||
<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=IBM+Plex+Mono:wght@500&family=IBM+Plex+Sans&display=swap" rel="stylesheet">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<div class="mid"><h1>
|
|
||||||
ryan's fanclub
|
|
||||||
</h1></div>
|
|
||||||
|
|
||||||
<hr>
|
|
||||||
<div class="mid"><p>
|
|
||||||
welcome to my lil' digital garden 🌱
|
|
||||||
<br>
|
|
||||||
<br>
|
|
||||||
i don't really post on my insta so you guys get a website instead.
|
|
||||||
<br>
|
|
||||||
because i'm just a little nerd.
|
|
||||||
<br>
|
|
||||||
that sits in his room all day.
|
|
||||||
<br>
|
|
||||||
sometimes i read books.
|
|
||||||
<br>
|
|
||||||
or watch movies and listen to music.
|
|
||||||
</p></div>
|
|
||||||
<hr>
|
|
||||||
|
|
||||||
<div class="mid"><a href="./blog/"><h2>
|
|
||||||
blog
|
|
||||||
</h2></li></div>
|
|
||||||
|
|
||||||
<div class="mid"><ul>
|
|
||||||
<li><a href="./blog/movie/">
|
|
||||||
i do movie reviews
|
|
||||||
</a></li>
|
|
||||||
<li><a href="./blog/music.html">
|
|
||||||
and also music reviews
|
|
||||||
</a></li>
|
|
||||||
<li><a href="./blog/thoughts.html">
|
|
||||||
and other random thoughts
|
|
||||||
</a></li>
|
|
||||||
</ul></div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="mid"><h2>reviews</h2></div>
|
|
||||||
|
|
||||||
<blockquote>
|
|
||||||
<span>
|
|
||||||
"he's okay occasionally i guess"
|
|
||||||
</span>
|
|
||||||
-kristal hui, jan 3. 2022
|
|
||||||
</blockquote>
|
|
||||||
|
|
||||||
<blockquote>
|
|
||||||
<span>
|
|
||||||
"so u did not like me for 9 months "
|
|
||||||
</span>
|
|
||||||
-alana, mar 4. 2023
|
|
||||||
</blockquote>
|
|
||||||
|
|
||||||
<div class="mid"><h2>pics</h2></div>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">1 / 10</div>
|
|
||||||
<img src="./img/img1.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">2 / 10</div>
|
|
||||||
<img src="./img/img2.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">3 / 10</div>
|
|
||||||
<img src="./img/img3.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">4 / 10</div>
|
|
||||||
<img src="./img/img4.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">5 / 10</div>
|
|
||||||
<img src="./img/img5.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">6 / 10</div>
|
|
||||||
<img src="./img/img6.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">7 / 10</div>
|
|
||||||
<img src="./img/img7.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">8 / 10</div>
|
|
||||||
<img src="./img/img8.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">9 / 10</div>
|
|
||||||
<img src="./img/img9.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mySlides">
|
|
||||||
<div class="numbertext">10 / 10</div>
|
|
||||||
<img src="./img/img10.jpg" style="width:100%">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<a class="prev" onclick="plusSlides(-1)">❮</a>
|
|
||||||
<a class="next" onclick="plusSlides(1)">❯</a>
|
|
||||||
|
|
||||||
<div class="caption-container">
|
|
||||||
<p id="caption"></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img1.jpg" style="width:100%" onclick="currentSlide(1)" alt="in da pow">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img2.jpg" style="width:100%" onclick="currentSlide(2)" alt="shining lights">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img3.jpg" style="width:100%" onclick="currentSlide(3)" alt="tatiana">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img4.jpg" style="width:100%" onclick="currentSlide(4)" alt="alana's hat">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img5.jpg" style="width:100%" onclick="currentSlide(5)" alt="teddy">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img6.jpg" style="width:100%" onclick="currentSlide(6)" alt="uhm.. hi!">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img7.jpg" style="width:100%" onclick="currentSlide(7)" alt="got new piercings">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img8.jpg" style="width:100%" onclick="currentSlide(8)" alt="meow">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img9.jpg" style="width:100%" onclick="currentSlide(9)" alt="travis scott bear">
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
|
||||||
<img class="demo cursor" src="./img/img10.jpg" style="width:100%" onclick="currentSlide(10)" alt="my melody girlie">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<footer class="footer social-links">
|
|
||||||
<p>
|
|
||||||
find me on:
|
|
||||||
</p>
|
|
||||||
<a href="https://www.instagram.com/ryabchow/?hl=en" target="_blank" "rel=noopener noreferer">
|
|
||||||
insta
|
|
||||||
</a>
|
|
||||||
<a href="https://www.instagram.com/cabbbbyy/?hl=en" target="_blank" "rel=noopener noreferer">
|
|
||||||
priv
|
|
||||||
</a>
|
|
||||||
<a href="https://open.spotify.com/user/r491f76w3rn3j4c2ccegjksfi" target="_blank" "rel=noopener noreferer">
|
|
||||||
spotify
|
|
||||||
</a>
|
|
||||||
<a href="https://t.snapchat.com/2PXXop3d" target="_blank" "rel=noopener noreferer">
|
|
||||||
snap
|
|
||||||
</a>
|
|
||||||
</footer>
|
|
||||||
<script src="./script.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,28 +0,0 @@
|
|||||||
let slideIndex = 1;
|
|
||||||
showSlides(slideIndex);
|
|
||||||
|
|
||||||
function plusSlides(n) {
|
|
||||||
showSlides(slideIndex += n);
|
|
||||||
}
|
|
||||||
|
|
||||||
function currentSlide(n) {
|
|
||||||
showSlides(slideIndex = n);
|
|
||||||
}
|
|
||||||
|
|
||||||
function showSlides(n) {
|
|
||||||
let i;
|
|
||||||
let slides = document.getElementsByClassName("mySlides");
|
|
||||||
let dots = document.getElementsByClassName("demo");
|
|
||||||
let captionText = document.getElementById("caption");
|
|
||||||
if (n > slides.length) {slideIndex = 1}
|
|
||||||
if (n < 1) {slideIndex = slides.length}
|
|
||||||
for (i = 0; i < slides.length; i++) {
|
|
||||||
slides[i].style.display = "none";
|
|
||||||
}
|
|
||||||
for (i = 0; i < dots.length; i++) {
|
|
||||||
dots[i].className = dots[i].className.replace(" active", "");
|
|
||||||
}
|
|
||||||
slides[slideIndex-1].style.display = "block";
|
|
||||||
dots[slideIndex-1].className += " active";
|
|
||||||
captionText.innerHTML = dots[slideIndex-1].alt;
|
|
||||||
}
|
|
||||||
31
posts/post4.md
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
#### Home is a Moving Target
|
||||||
|
## Sep 18, 2025
|
||||||
|
---
|
||||||
|
|
||||||
|
The first thing I notice when I land in Taipei isn’t the humidity, it’s the English.
|
||||||
|
The customs officer glances at my U.S. passport, smiles politely, and greets me with a crisp, "hello".
|
||||||
|
It’s friendly, but it’s also a signal: foreigner.
|
||||||
|
|
||||||
|
Back home in the States, the signals run the other way.
|
||||||
|
Strangers will tilt their heads and ask, “Where are you really from?”
|
||||||
|
To them, my black hair and last name are proof that I don’t fully belong.
|
||||||
|
|
||||||
|
Two countries, two kinds of distance.
|
||||||
|
In Taiwan, my Mandarin carries a soft American lilt.
|
||||||
|
In America, my face carries a history I can’t shed.
|
||||||
|
The result is a strange elasticity of self: I’m stretched across the Pacific, always a little too much and a little not enough.
|
||||||
|
|
||||||
|
And yet, in that stretch, there is unexpected abundance.
|
||||||
|
|
||||||
|
I love the late night chaos of a Taiwanese night market, the smoky perfume of oyster omelets, the sugar crust on fried sweet potatoes.
|
||||||
|
I also love the messy creativity of American diners, where pancakes arrive bigger than the plate and coffee refills never stop.
|
||||||
|
My playlists swing from Faye Wong ballads to Kendrick Lamar verses; my shelves hold both pu'er tea leaves and prepackaged mac and cheese.
|
||||||
|
These aren’t contradictions. They’re coordinates.
|
||||||
|
|
||||||
|
Belonging, I’ve learned, isn’t a single address.
|
||||||
|
It’s a moving target, a constellation of tastes, sounds, and memories that shift as I do.
|
||||||
|
I may always be a foreigner in Taipei and a hyphenated question mark in California, but I carry the best of both with me, like dual passports of the heart.
|
||||||
|
|
||||||
|
Maybe that’s the quiet gift of being Asian American:
|
||||||
|
To stand in the middle of two cultures, to love them both fiercely, and to know that home isn’t where people decide you fit.
|
||||||
|
Home is everything you refuse to give up.
|
||||||
28
posts/post5.md
Normal file
@@ -0,0 +1,28 @@
|
|||||||
|
#### Tipping in America
|
||||||
|
## Sep 25, 2025
|
||||||
|
---
|
||||||
|
# 1. Why tipping exists in U.S. restaurants
|
||||||
|
### Sub-minimum wage:
|
||||||
|
In most U.S. states, servers are legally allowed to be paid below the normal minimum wage (the federal "tipped minimum" is only $2.13/hr). The assumption is that tips will bring them up to at least regular minimum wage.
|
||||||
|
California is one of the few states where employers must pay full minimum wage, but even here, servers still depend heavily on tips because restaurant owners factor tips into scheduling and raise decisions.
|
||||||
|
### Tip-out culture:
|
||||||
|
The server does not keep every dollar. At the end of each shift they "tip out" a percentage of their sales (not just their tips) to runners, bussers, bartenders, and hosts. A 15% tip might leave the server with far less after sharing.
|
||||||
|
### Historical roots:
|
||||||
|
Tipping in the U.S. grew after the Civil War. Employers, especially in hospitality, used tipping as an excuse to avoid paying formerly enslaved Black workers a fair wage.
|
||||||
|
|
||||||
|
# 2. Social expectations
|
||||||
|
Restaurants with table service:
|
||||||
|
- Excellent service or fancy dining: 20–25%.
|
||||||
|
- Good service: ~18–20% of the pre-tax bill is standard.
|
||||||
|
- Okay but not terrible: ~15% is still expected unless something was truly bad.
|
||||||
|
Bars: $1–2 per simple drink or 20% of the tab.
|
||||||
|
|
||||||
|
Coffee shops/counter service: optional, but $1 in a tip jar is nice if they made something complex.
|
||||||
|
|
||||||
|
Take-out/fast casual: rounding up or $1–2 is polite but not required.
|
||||||
|
|
||||||
|
# 3. Where you can save a bit as a student
|
||||||
|
- Counter service / grab-and-go: you can skip or leave coins without being rude.
|
||||||
|
- Delivery apps: still tip (~10–15%) because drivers rely on it, but you can pick up your food yourself to avoid the fee and higher tip.
|
||||||
|
- Bars during happy hour: $1 per drink is acceptable if it’s a simple pour.
|
||||||
|
- Large groups: check for automatic gratuity—don’t double-tip by accident.
|
||||||
18
posts/post6.md
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
#### The Weight of Wanting
|
||||||
|
## Oct 14, 2025
|
||||||
|
---
|
||||||
|
At the gym, I am not a man or a woman or a queer body. I am a collection of movements. A set of repetitions. A calculus of effort and symmetry. The mirrors line the walls like an endless chorus of judges, and I study myself through them: the slope of a shoulder, the softness of a face that never quite leans masculine enough, the hint of fat that clings with memory. I used to be fat. Not in the nostalgic, “glow up” sense, but in the way that teaches you to apologize for existing in space. Now I am less fat. But my body remembers. The roundness lingers in my face, the old shame in my posture. It’s a strange inheritance, to lose weight, but not escape its ghost.
|
||||||
|
|
||||||
|
The gym is supposed to be a temple of transformation. For me, it’s also a confessional booth. Every rep feels like repentance, a small absolution for the sin of softness, of effeminacy, of wanting too much to be seen. The iron never lies, but it doesn’t forgive either. When the weight rises above my chest, I imagine I’m lifting something more abstract: the part of me that still flinches when someone calls me “fag.” The part that wants to be desired but not categorized. The part that keeps trying to reconcile masculinity and queerness in a world that demands they be kept apart.
|
||||||
|
|
||||||
|
In Santa Cruz, queerness is ambient, it hangs in the air like the mist from the ocean. Everyone is soft, ethereal, performing care. But softness doesn’t feel like safety to me. My bisexuality collapses under the gaze here. I become “the gay boy,” a decorative character in someone else’s narrative of radical inclusion. To belong, I have to lean in: to exaggerate the curve, the tone, the cadence. It’s not malicious, just exhausting. I leave each queer gathering feeling like I’ve betrayed some quieter version of myself. Every woman I've loved becomes a footnote, a phase, evidence of my confusion rather than my wholeness.
|
||||||
|
|
||||||
|
In San Jose, the pendulum swings the other way. I blend in too easily. Stussy hoodie, silver chain, jeans that sag just right. I am one of many: boys who talk about bulking and ratios, who go to raves "for the music," who hide softness under creatine and slang. Here, my queerness recedes into the background. Tolerated, not examined. There’s a freedom in that invisibility, but also a loss. I am seen as “normal,” which means I am not seen at all.
|
||||||
|
|
||||||
|
Between these two cities, my body becomes a site of negotiation. Every pound lifted, every calorie tracked, is an act of translation between two worlds that can’t seem to hold me whole. The gym becomes the only place where both versions coexist: the gayboy chasing twinkness, the abb chasing defintion. In that liminal space, aggression feels holy. A ritual through which I can access something wordless. Power, maybe. Or control. Or just the relief of motion.
|
||||||
|
|
||||||
|
But liberation has its own cruelty. There is a kind of spiritual violence in self-improvement: the belief that salvation lies on the other side of progress. That if I sculpt myself long enough, I’ll arrive somewhere better. More real. More lovable. More deserving of belonging. It’s the same old theology of the before and after photo: proof that the body is a problem to be solved, not a language to be spoken.
|
||||||
|
|
||||||
|
Sometimes, when I’m racking plates alone late at night, I catch my reflection in the darkened glass. The gym is empty, and the air hums with fluorescent fatigue. I see myself, neither saint nor sinner, neither gay nor straight. Just a body, suspended in the act of becoming.
|
||||||
|
|
||||||
|
And for a moment, that’s enough. Not freedom exactly, but something adjacent: the quiet grace of being seen by no one, and still showing up.
|
||||||
20
posts/post7.md
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
#### The Intimacy of Never Speaking Again
|
||||||
|
## Oct 22, 2025
|
||||||
|
---
|
||||||
|
There is a certain intimacy in never speaking again. Not the soft kind people romanticize in love stories, but a quieter, stranger intimacy. The kind that comes only after being fully seen. Because intimacy isn’t just late night conversations or bodies curled on a couch. It’s the rare moment two people allow themselves to be known without performance. It’s layered, deliberate. It’s to be truly, dangerously known.
|
||||||
|
|
||||||
|
People love the idea of “right person, wrong time,” but fate wasn’t the author here. There was no cosmic theft and no tragic inevitability. I made the choice. I ended it. I didn’t give you a say, or a vote, or even the dignity of mutual unraveling. I walked away first. Not because I didn’t care, but because I cared more than I was capable of holding. You were the kind of person life doesn’t hand you twice. Not perfect. Not destined. Just unrepeatable in a way that will follow me for the rest of my life. And that scared me. You took me back once. You pulled the thread of us through the tear I made and laid it, carefully, across the seam. That kind of grace is not the sort of thing you ask for a second time. So this silence is mine to keep. Not because it is merciful, or easy, or even right in any comforting way. But because I closed the door and I do not get to knock. Regret does not entitle me to return. The ending is my work. Carrying it is, too.
|
||||||
|
|
||||||
|
The silence that followed became its own intimacy, sharper than touch, heavier than memory. Silence is not forgetting. Silence is remembering without relief. It is choosing not to reopen a wound, not because the feeling is gone, but because it’s still too alive. Silence after intimacy is both a boundary and a burial ground. Some people do not come around twice, and when they do, you do not keep testing the earth where you’ve already buried something sacred.
|
||||||
|
|
||||||
|
And so we carry a private universe no one else will ever witness. To speak now would dilute it. Casual contact would cheapen it. Small talk would vandalize what was once sacred. When two people who knew each other that deeply choose not to speak, the silence becomes the final shared secret. It means you will build a life that has nothing to do with me, and I will do the same. One day, someone will ask about you, and I’ll shrug like your name is just another name. They won’t know there was a time my whole world bent around you. They won’t know the cost of what I keep in silence.I won’t call. Not in the bright hours when I feel brave, not in the dark ones when I don’t. I won’t send a message on an anniversary only we would recognize. I won’t reach for an excuse to ask about your job, the small weather of your days, or a holiday greeting. I won’t ask for a meeting under the pretense of returning something that doesn’t matter. The truth is simple. I ended us. And now my part is to keep the ending intact.
|
||||||
|
|
||||||
|
This is not penance dressed up as principle. It is acceptance. There is a line I crossed that cannot be uncrossed, and a door that stays closed because I closed it. I can love what we were and still refuse to disturb it. I can grieve without petitioning for relief. I can choose the kind of silence that protects the best of us from the worst of me.
|
||||||
|
|
||||||
|
So I will carry you the way a wallflower holds its silence at the edge of the room. I will go on building a life that has nothing to do with you, not because you were small, but because you were singular. And singular things do not survive rehearsal. They belong to their moment, and then to memory.
|
||||||
|
|
||||||
|
But I will know. And that knowing will stay, quiet as snowfall, heavy as stone.
|
||||||
|
|
||||||
|
We will not speak again. That is our last intimacy. Not closure. Not peace.
|
||||||
|
|
||||||
|
Just the echoing truth that <br> I lost something irreplaceable, <br> and I was the one who ended it.
|
||||||
@@ -16,6 +16,9 @@ document.addEventListener("DOMContentLoaded", function () {
|
|||||||
// Dynamically load posts on the home page
|
// Dynamically load posts on the home page
|
||||||
if (document.getElementById("post-list")) {
|
if (document.getElementById("post-list")) {
|
||||||
const posts = [
|
const posts = [
|
||||||
|
{ title: "The Intimacy of Never Speaking Again", date: "Oct 22, 2025", excerpt: "", file: "post7.md" },
|
||||||
|
{ title: "The Weight of Wanting", date: "Oct 14, 2025", excerpt: "", file: "post6.md" },
|
||||||
|
{ title: "Home is a Moving Target.", date: "Sep 18, 2025", excerpt: "The first thing I notice when I land in Taipei isn’t the humidity, it’s the English.", file: "post4.md" },
|
||||||
{ title: "Hemming", date: "Jul 28, 2025", excerpt: "Everything I create lives on screens", file: "post3.md" },
|
{ title: "Hemming", date: "Jul 28, 2025", excerpt: "Everything I create lives on screens", file: "post3.md" },
|
||||||
{ title: "Scars, Sadness, and Soulmates", date: "Jan 26, 2025", excerpt: "Healing isn't a prerequisite for love, being human is.", file: "post2.md" },
|
{ title: "Scars, Sadness, and Soulmates", date: "Jan 26, 2025", excerpt: "Healing isn't a prerequisite for love, being human is.", file: "post2.md" },
|
||||||
{ title: "Meaningful Action", date: "Jan 23, 2025", excerpt: "wow this is barely comprehensible", file: "post1.md" },
|
{ title: "Meaningful Action", date: "Jan 23, 2025", excerpt: "wow this is barely comprehensible", file: "post1.md" },
|
||||||
|
|||||||