diff options
Diffstat (limited to 'www')
| -rw-r--r-- | www/about/index.html | 34 | ||||
| -rw-r--r-- | www/assets/images/education/events/010829thAug-CapturetheJoyfulMomentWorkshopDSC02252.jpg | bin | 0 -> 1526635 bytes | |||
| -rw-r--r-- | www/assets/images/education/events/026229thAug-CapturetheJoyfulMomentWorkshopDSC02641.jpg | bin | 0 -> 1704925 bytes | |||
| -rw-r--r-- | www/assets/images/game-hero/tinkertanker-examples.png | bin | 675283 -> 675283 bytes | |||
| -rw-r--r-- | www/projects/index.html | 28 | ||||
| -rw-r--r-- | www/scripts/elements/share.js | 27 | ||||
| -rw-r--r-- | www/scripts/scroll.js | 2 | ||||
| -rw-r--r-- | www/style.css | 6 |
8 files changed, 63 insertions, 34 deletions
diff --git a/www/about/index.html b/www/about/index.html index 5eb2362..af6e1a8 100644 --- a/www/about/index.html +++ b/www/about/index.html @@ -152,7 +152,7 @@ <h2>Alarm (Al-Azhar Rawamangun) Robotics Competition</h2>
<p><b>1st place, Team</b></p>
<p>My first major robotics competition. Our team of 3 paritcipated in the creative category. A metropolitan-wide private competition.</p>
- <p><a class="link" href="/event/alarm_id/">Read more →</a></p>
+ <p><a class="link" href="/events/alarm_id/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -161,7 +161,7 @@ <h2>ASEAN Robotics Day</h2>
<p><b>4th place, Team</b></p>
<p>Created a new robot with the theme of environmental sustainability. Our team of 5 participated in the creative category. A public nation-wide and theoretically ASEAN region-wide competition.</p>
- <p><a class="link" href="/event/aseanrd_id/">Read more →</a></p>
+ <p><a class="link" href="/events/aseanrd_id/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -170,7 +170,7 @@ <h2>Trans Studio Bandung Robotics Competition</h2>
<p><b>1st place, Team</b></p>
<p>Our team of 3 refined our previous robot for the creative category. A pretty major public nation-wide competition.</p>
- <p><a class="link" href="/event/tsb_id/">Read more →</a></p>
+ <p><a class="link" href="/events/tsb_id/">Read more →</a></p>
</div>
</div>
<div class="timeline-milestone">
@@ -195,7 +195,7 @@ <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><a class="link" href="/event/infocomm/">Read more →</a></p>
+ <p><a class="link" href="/events/infocomm/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter timeline-highlight">
@@ -204,7 +204,7 @@ <h2>Yellow Ribbon Arts Competition</h2>
<p><b>Top Winner</b></p>
<p>Participated in my first ever videography competition. This competition is part of Yellow Ribbon Arts Festival 2025 hosted by Yellow Ribbon Singapore.</p>
- <p><a class="link" href="/video/stringsoffreedom/">Watch my short film →</a></p>
+ <p><a class="link" href="/videos/stringsoffreedom/">Watch my short film →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -212,7 +212,7 @@ <span class="half-opacity-text"><i class="fa-solid fa-people-group"></i> Service</span>
<h2>Class VIA Leader Committe</h2>
<p>My form class organised a beach clean-up VIA project, where I helped out organising and creating a video of it.</p>
- <p><a class="link" href="/video/s3via/">Watch our video →</a></p>
+ <p><a class="link" href="/videos/s3via/">Watch our video →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter timeline-highlight">
@@ -221,7 +221,7 @@ <h2>National Youth Tech Championship</h2>
<p><b>Champion, Team</b></p>
<p>Ngee Ann's team of 4 won the 1st place in NYTC in 2025, the premier tech and robotics competition hosted by IMDA. Featured in The Straits Times.</p>
- <p><a class="link" href="/event/nytc/">Read more →</a></p>
+ <p><a class="link" href="/events/nytc/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -229,7 +229,7 @@ <span class="half-opacity-text"><i class="fa-solid fa-people-group"></i> Service</span>
<h2>Infocomm CCA VIA at Tampines East CC</h2>
<p>Every year, Ngee Ann's Infocomm Club does VIA projects. This year, the CCA collaborated with People's Association in Tampines East to teach elderly residents videography and editing.</p>
- <p><a class="link" href="/event/infocomm/">Read more →</a></p>
+ <p><a class="link" href="/events/infocomm/#tecc">Read more →</a></p>
</div>
</div>
<!--
@@ -255,7 +255,7 @@ <span class="half-opacity-text"><i class="fa-solid fa-people-group"></i> Service</span>
<h2>MINDS Charity Carwash Video</h2>
<p>Infocomm CCA leaders volunteered to create a promotional video for MINDS Charity Carwash at MINDS Community Hub (Geylang Serai). MINDS is a non-profit social agency serving persons with intellectual disability and their families.</p>
- <p><a class="link" href="/video/minds/">Watch the video →</a></p>
+ <p><a class="link" href="/videos/minds/">Watch the video →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -263,7 +263,7 @@ <span class="half-opacity-text"><i class="fa-solid fa-people-group"></i> Service</span>
<h2>Ngee Ann Open House Video</h2>
<p>In partnership with the school, Infocomm CCA in collaboration with Photography CCA created an appreciation video for all student helpers at NAS Open House 2025.</p>
- <p><a class="link" href="/video/openhouse/">Watch our video →</a></p>
+ <p><a class="link" href="/videos/openhouse/">Watch our video →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter timeline-highlight">
@@ -271,7 +271,7 @@ <span class="half-opacity-text"><i class="fa-solid fa-briefcase"></i> Internship</span>
<h2>Internship at Tinkertanker</h2>
<p>Some of my Computing friends and me was granted an internship opportunity from our school with Tinkertanker Pte Ltd during our end of year holidays. This was my first ever internship. We got the opportunity to create some cool projects while we were there too.</p>
- <p><a class="link" href="/event/tinkertanker/">Read more →</a></p>
+ <p><a class="link" href="/events/tinkertanker/">Read more →</a></p>
</div>
</div>
<div class="timeline-milestone">
@@ -292,7 +292,7 @@ <h2>Ngee Ann Secondary School Founder's Day</h2>
<p><b>Recipient of Certificate of Merit for Computing</b></p>
<p>The school awards Certificate of Merit to the 2 top-performing students of a subject.</p>
- <p><a class="link" href="/event/foundersday/">Read more →</a></p>
+ <p><a class="link" href="/events/foundersday/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter timeline-highlight">
@@ -301,7 +301,7 @@ <h2>Ngee Ann Secondary School Founder's Day</h2>
<p><b>Infocomm CCA as Recipient of Certificate of Commendation for Outstanding Community Service</b></p>
<p>The school awards this certificate for students and student groups that has shown commitment in service and has brought real impacts, with the goal of cultivating value creators of the community.</p>
- <p><a class="link" href="/event/foundersday/">Read more →</a></p>
+ <p><a class="link" href="/events/infocomm/#fd">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -310,7 +310,7 @@ <h2>Temasek Engineering Olympiad</h2>
<p><b>Silver Medal</b></p>
<p>A 3-day engineering and electronics workshop and competition hosted by Temasek Polytechnic School of Engineering.</p>
- <p><a class="link" href="/event/temasekeng/">Read more →</a></p>
+ <p><a class="link" href="/events/temasekeng/">Read more →</a></p>
</div>
</div>
<!-- bebras? -->
@@ -320,7 +320,7 @@ <h2>National Olympiad of Informatics 2026 (and 2025)</h2>
<p><b>Bronze Medal</b></p>
<p>An algorithmic problem-solving contest open to secondary and junior college students in Singapore. I participated in 2025 and 2026, and achieved the bronze medal this year.</p>
- <p><a class="link" href="/event/noi/">Read more →</a></p>
+ <p><a class="link" href="/events/noi/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter timeline-highlight">
@@ -329,7 +329,7 @@ <h2>National Olympiad of Artificial Intelligence</h2>
<p><b>Bronze Medal</b></p>
<p>Held by NTU and AI Singapore, NOAI is a relatively new programming contest about AI programming.</p>
- <p><a class="link" href="/event/noai/">Read more →</a></p>
+ <p><a class="link" href="/events/noai/">Read more →</a></p>
</div>
</div>
<div class="timeline-item shadow-filter">
@@ -338,7 +338,7 @@ <h2>Copyright School Challenge '25/26</h2>
<p><b>2nd place</b></p>
<p>A videography competition held by CLASS Singapore with the theme "The Worlds We Make" in aligment with AFCC 2026.</p>
- <p><a class="link" href="/video/paperverse/">Watch my submission →</a></p>
+ <p><a class="link" href="/videos/paperverse/">Watch my submission →</a></p>
</div>
</div>
</div>
diff --git a/www/assets/images/education/events/010829thAug-CapturetheJoyfulMomentWorkshopDSC02252.jpg b/www/assets/images/education/events/010829thAug-CapturetheJoyfulMomentWorkshopDSC02252.jpg Binary files differnew file mode 100644 index 0000000..991e0b7 --- /dev/null +++ b/www/assets/images/education/events/010829thAug-CapturetheJoyfulMomentWorkshopDSC02252.jpg diff --git a/www/assets/images/education/events/026229thAug-CapturetheJoyfulMomentWorkshopDSC02641.jpg b/www/assets/images/education/events/026229thAug-CapturetheJoyfulMomentWorkshopDSC02641.jpg Binary files differnew file mode 100644 index 0000000..db43e65 --- /dev/null +++ b/www/assets/images/education/events/026229thAug-CapturetheJoyfulMomentWorkshopDSC02641.jpg diff --git a/www/assets/images/game-hero/tinkertanker-examples.png b/www/assets/images/game-hero/tinkertanker-examples.png Binary files differindex b510b1c..ab1c844 100644 --- a/www/assets/images/game-hero/tinkertanker-examples.png +++ b/www/assets/images/game-hero/tinkertanker-examples.png diff --git a/www/projects/index.html b/www/projects/index.html index b3cb586..cfd3ba2 100644 --- a/www/projects/index.html +++ b/www/projects/index.html @@ -332,7 +332,7 @@ <span class="heading">Videography<span class="desktop"> Projects</span></span>
<div class="flex-container flex-container-normal flex-container-dynamicwrap gap wide" style="margin-top: 1rem;">
<div class="flex video-higlight-card shadow-filter">
- <a href="/video/stringsoffreedom/" class="video-play-cover">⏵</a>
+ <a href="/videos/stringsoffreedom/" class="video-play-cover">⏵</a>
<img src="/assets/images/video-hero/stringsoffreedom.png" alt="">
<div class="img">
<h1>Strings of Freedom</h1>
@@ -341,7 +341,7 @@ </div>
</div>
<div class="flex video-higlight-card shadow-filter">
- <a href="/video/minds/" class="video-play-cover">⏵</a>
+ <a href="/videos/minds/" class="video-play-cover">⏵</a>
<img src="/assets/images/video-hero/minds.png" alt="">
<div class="img">
<h1>MINDS Charity Car Wash Promotional</h1>
@@ -353,60 +353,60 @@ <div class="video-gallery-card narrow">
<div>
<img src="/assets/images/video-hero/stringsoffreedom.png" alt="">
- <a href="/video/stringsoffreedom/" class="video-play-cover">⏵</a>
+ <a href="/videos/stringsoffreedom/" class="video-play-cover">⏵</a>
</div>
<div class="video-gallery-card-text video-gallery-card-text-accent flex-container flex-container-column flex-start gap">
- <a href="/video/stringsoffreedom/" class="link monospaced">Strings of Freedom</a>
+ <a href="/videos/stringsoffreedom/" class="link monospaced">Strings of Freedom</a>
<span>(2025) Top Winning Submission for Yellow Ribbon Arts Competition 2025.</span>
</div>
</div>
<div class="video-gallery-card narrow">
<div>
<img src="/assets/images/video-hero/minds.png" alt="">
- <a href="/video/minds/" class="video-play-cover">⏵</a>
+ <a href="/videos/minds/" class="video-play-cover">⏵</a>
</div>
<div class="video-gallery-card-text video-gallery-card-text-accent flex-container flex-container-column flex-start gap">
- <a href="/video/minds/" class="link monospaced">MINDS Charity Car Wash Promotional</a>
+ <a href="/videos/minds/" class="link monospaced">MINDS Charity Car Wash Promotional</a>
<span>(2025) Volunteer work with MINDS to promote their Charity Car Wash in 2025.</span>
</div>
</div>
<div class="video-gallery-card">
<div>
<img src="/assets/images/video-hero/paperverse.png" alt="">
- <a href="/video/paperverse/" class="video-play-cover">⏵</a>
+ <a href="/videos/paperverse/" class="video-play-cover">⏵</a>
</div>
<div class="video-gallery-card-text flex-container flex-container-normal flex-container-dynamicwrap flex-spacebetween flex-center">
- <a href="/video/paperverse/" class="link monospaced">Paperverse Hub</a>
+ <a href="/videos/paperverse/" class="link monospaced">Paperverse Hub</a>
<span>2026</span>
</div>
</div>
<div class="video-gallery-card">
<div>
<img src="/assets/images/video-hero/eid2026.png" alt="">
- <a href="/video/eid2026" class="video-play-cover">⏵</a>
+ <a href="/videos/eid2026" class="video-play-cover">⏵</a>
</div>
<div class="video-gallery-card-text flex-container flex-container-normal flex-container-dynamicwrap flex-spacebetween flex-center gap">
- <a href="/video/eid2026/" class="link monospaced">A message for this Eid</a>
+ <a href="/videos/eid2026/" class="link monospaced">A message for this Eid</a>
<span>2026</span>
</div>
</div>
<div class="video-gallery-card">
<div>
<img src="/assets/images/video-hero/openhouse.png" alt="">
- <a href="/video/openhouse/" class="video-play-cover">⏵</a>
+ <a href="/videos/openhouse/" class="video-play-cover">⏵</a>
</div>
<div class="video-gallery-card-text flex-container flex-container-normal flex-container-dynamicwrap flex-spacebetween flex-center gap">
- <a href="/video/openhouse/" class="link monspaced">Ngee Ann Open House 2025</a>
+ <a href="/videos/openhouse/" class="link monspaced">Ngee Ann Open House 2025</a>
<span><i class="fa-solid fa-people-group"></i> 2025</span>
</div>
</div>
<div class="video-gallery-card">
<div>
<img src="/assets/images/video-hero/via3rp.png" alt="">
- <a href="/video/s3via/" class="video-play-cover">⏵</a>
+ <a href="/videos/s3via/" class="video-play-cover">⏵</a>
</div>
<div class="video-gallery-card-text flex-container flex-container-normal flex-container-dynamicwrap flex-spacebetween flex-center gap">
- <a href="/video/s3via/" class="link monospaced">Secondary 3 VIA Project</a>
+ <a href="/videos/s3via/" class="link monospaced">Secondary 3 VIA Project</a>
<span>2025</span>
</div>
</div>
diff --git a/www/scripts/elements/share.js b/www/scripts/elements/share.js new file mode 100644 index 0000000..d6813ba --- /dev/null +++ b/www/scripts/elements/share.js @@ -0,0 +1,27 @@ +const shareBtn = document.getElementById("share-btn"); + +shareBtn.addEventListener("click", () => { + share(); +}); + +function share() { + const data = { + title: "altaf-creator", + text: document.title, + url: window.location, + }; + + iconChange(); + navigator.clipboard.writeText(window.location); + navigator.share(data); +} + +async function iconChange() { + shareBtn.firstChild.setAttribute("class", "fa-solid fa-copy"); + await sleep(2000); + shareBtn.firstChild.setAttribute("class", "fa-solid fa-share-nodes"); +} + +function sleep(ms) { + return new Promise(resolve => setTimeout(resolve, ms)); +} diff --git a/www/scripts/scroll.js b/www/scripts/scroll.js index 6a61015..fca8c0a 100644 --- a/www/scripts/scroll.js +++ b/www/scripts/scroll.js @@ -16,8 +16,6 @@ function progress() { });
const nodes = document.getElementsByClassName("node");
- console.log(sections);
-
if (nodes[0]) {
for (var i = 0; i < sections.length; i++) {
if (isInViewport(sections[i])) {
diff --git a/www/style.css b/www/style.css index 40d8392..3e8cb76 100644 --- a/www/style.css +++ b/www/style.css @@ -114,6 +114,7 @@ hr { .long-code {
max-height: 16rem;
margin-bottom: 1rem;
+ overflow: auto;
}
pre {
@@ -124,7 +125,6 @@ pre { color: #444;
white-space: pre;
margin: 0;
- overflow: auto;
}
li {
@@ -1556,6 +1556,10 @@ li:target { text-align: center;
}
+.max-img > img {
+ max-height: 350px;
+}
+
@media only screen and (max-width: 600px) {
:root {
--home-title-offset: 60px;
|
