From 5d56fe7e8e93a6c5494cf49b34aed5736a91f358 Mon Sep 17 00:00:00 2001
From: altaf-creator <dev@altafcreator.com>
Date: Sat, 4 Jul 2026 19:39:03 +0800
Subject: push blog urban0

---
 www/about/index.html               |  20 ++++++++++++++++----
 www/assets/images/hero/selfie0.jpg | Bin 0 -> 1176950 bytes
 www/scripts/constants.js           |   4 ++--
 www/style.css                      |  15 +++++++++++++++
 4 files changed, 33 insertions(+), 6 deletions(-)
 create mode 100644 www/assets/images/hero/selfie0.jpg

(limited to 'www')

diff --git a/www/about/index.html b/www/about/index.html
index af6e1a8..bc49f24 100644
--- a/www/about/index.html
+++ b/www/about/index.html
@@ -42,9 +42,11 @@
 	<section style="border-top: none;">
 		<div class="center-grid">
 			<div class="div-sizing">
-				<div class="flex-container flex-container-dynamicwrap" style="gap: 30px">
-					<img src="/assets/images/hero/logo.png" alt=""
-						style="box-sizing: border-box; height: 240px; width: 240px; object-fit: cover;" class="img">
+				<div class="flex-container flex-container-dynamicwrap flex-y-center" style="gap: 30px">
+					<div class="shadow-filter">
+					<img src="/assets/images/hero/selfie0.jpg" alt=""
+						style="box-sizing: border-box; width: 300px; object-fit: cover;" class="img">
+					</div>
 					<div>
 						<span class="heading">About Me</span>
 						<p>
@@ -194,7 +196,7 @@
 						<div>
 							<span class="half-opacity-text"><i class="fa-solid fa-people-group"></i> Leadership</span>
 							<h2>CCA Vice President for Infocomm (Media Creation) Club</h2>
-							<p>Became one of the presidents for Ngee Ann Secondary School's Infocomm (Media Creation) Club CCA. (Achievements)</p>
+							<p>Became one of the presidents for Ngee Ann Secondary School's Infocomm (Media Creation) Club CCA.</p>
 							<p><a class="link" href="/events/infocomm/">Read more &rarr;</a></p>
 						</div>
 					</div>
@@ -352,6 +354,16 @@
 					<div class="timeline-milestone">
 						<h1 class="colored-text">Future?</h1>
 					</div>
+					<div class="timeline-item shadow-filter">
+						<div>
+							<p>Expand knowledge.</p>
+						</div>
+					</div>
+					<div class="timeline-item shadow-filter timeline-highlight">
+						<div>
+							<p>Hopes, tech for good, human-centric, contribute back to my community and beyond.</p>
+						</div>
+					</div>
 				</div>
 			</div>
 		</div>
diff --git a/www/assets/images/hero/selfie0.jpg b/www/assets/images/hero/selfie0.jpg
new file mode 100644
index 0000000..706da8c
Binary files /dev/null and b/www/assets/images/hero/selfie0.jpg differ
diff --git a/www/scripts/constants.js b/www/scripts/constants.js
index 1c2812e..b2b7894 100644
--- a/www/scripts/constants.js
+++ b/www/scripts/constants.js
@@ -1,2 +1,2 @@
-const API_URL = "https://altafcreator.com/api"
-//const API_URL = "http://localhost:9091/api"
+//const API_URL = "https://altafcreator.com/api"
+const API_URL = "http://localhost:9091/api"
diff --git a/www/style.css b/www/style.css
index 85f1697..a625346 100644
--- a/www/style.css
+++ b/www/style.css
@@ -1209,11 +1209,20 @@ img {
 	background-color: #7ec5c9;
 }
 
+.timeline-future > .timeline-item::after {
+	background-color: color-mix(in srgb, var(--accent1) 65%, transparent);
+}
+
 .timeline-before > .timeline-highlight::after {
 	background-color: white;
 	border-color: #7ec5c9;
 }
 
+.timeline-future > .timeline-highlight::after {
+	background-color: white;
+	border-color: color-mix(in srgb, var(--accent1) 65%, transparent);
+}
+
 .timeline-future::after {
 	background: repeating-linear-gradient(180deg, var(--accent1), var(--accent1) 10px, transparent 10px, transparent 20px);
 	-webkit-mask-image: linear-gradient(180deg, black 0, rgba(0, 0, 0, 0.5) 200px, rgba(0, 0, 0, 0.5) calc(100% - 200px), transparent 100%);
@@ -1728,6 +1737,12 @@ li:target {
 	section:first-of-type > .center-grid {
 		min-height: calc(100vh - 80px);
 	}
+
+	#title {
+		font-size: 2rem;
+		line-height: 2.2rem;
+		font-weight: normal;
+	}
 }
 
 
-- 
cgit v1.2.3