Skip to content

Commit 3176afc

Browse files
DannyW618DannyW618
committed
Initial commit
0 parents  commit 3176afc

4 files changed

Lines changed: 537 additions & 0 deletions

File tree

‎.github/workflows/static.yml‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
name: Deploy static content to Pages
2+
3+
on:
4+
push:
5+
branches: ["main"]
6+
7+
# Allows you to run this workflow manually from the Actions tab
8+
workflow_dispatch:
9+
10+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
11+
permissions:
12+
contents: read
13+
pages: write
14+
id-token: write
15+
16+
# Allow only one concurrent deployment
17+
concurrency:
18+
group: "pages"
19+
cancel-in-progress: false
20+
21+
jobs:
22+
# Single deploy job since we're just deploying
23+
deploy:
24+
environment:
25+
name: github-pages
26+
url: ${{ steps.deployment.outputs.page_url }}
27+
runs-on: ubuntu-latest
28+
steps:
29+
- name: Checkout
30+
uses: actions/checkout@v4
31+
32+
- name: Setup Pages
33+
uses: actions/configure-pages@v5
34+
35+
- name: Upload artifact
36+
uses: actions/upload-pages-artifact@v3
37+
with:
38+
# Upload entire repository
39+
path: '.'
40+
41+
- name: Deploy to GitHub Pages
42+
id: deployment
43+
uses: actions/deploy-pages@v4

‎index.html‎

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>INFS4205/7205 Course Hub</title>
8+
<link rel="stylesheet" href="styles.css">
9+
<!-- Optional: Inter font for that premium feel if we want to load it -->
10+
<style>
11+
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;800&display=swap');
12+
13+
body {
14+
font-family: 'Inter', sans-serif;
15+
}
16+
</style>
17+
</head>
18+
19+
<body>
20+
21+
<nav class="navbar">
22+
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
23+
<!-- Sun Icon (hidden in dark mode) -->
24+
<svg class="icon sun-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
25+
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
26+
style="display: none;">
27+
<circle cx="12" cy="12" r="5"></circle>
28+
<line x1="12" y1="1" x2="12" y2="3"></line>
29+
<line x1="12" y1="21" x2="12" y2="23"></line>
30+
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
31+
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
32+
<line x1="1" y1="12" x2="3" y2="12"></line>
33+
<line x1="21" y1="12" x2="23" y2="12"></line>
34+
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
35+
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
36+
</svg>
37+
38+
<!-- Moon Icon (hidden in light mode) -->
39+
<svg class="icon moon-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
40+
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
41+
style="display: none;">
42+
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
43+
</svg>
44+
</button>
45+
</nav>
46+
47+
<main class="flex-col items-center justify-center py-12 px-4">
48+
<div class="container text-center">
49+
50+
<div style="margin-bottom: 3rem;">
51+
<h1>INFS4205/7205 Course Hub</h1>
52+
<p style="font-size: 1.125rem; max-width: 42rem; margin: 0 auto;">
53+
Welcome to the resource hub for INFS4205/7205. Explore the agent demos and vibe
54+
coding tutorials below.
55+
</p>
56+
</div>
57+
58+
<div class="card-grid">
59+
<!-- Card 1: LangGraph Agent Demo -->
60+
<article class="card">
61+
<div style="text-align: left;">
62+
<h2 class="card-title">LangGraph Agent Demo</h2>
63+
<p class="card-desc">
64+
Explore the interactive LangGraph personalised agent demonstration. See how agents reason
65+
and execute
66+
tasks with local models.
67+
</p>
68+
<div class="button-group">
69+
<a href="https://infs4205-7205.github.io/LangGraph_Agent_Demo/" class="btn btn-primary"
70+
target="_blank" rel="noopener noreferrer">
71+
View Demo
72+
</a>
73+
<a href="https://github.com/INFS4205-7205/LangGraph_Agent_Demo" class="btn btn-outline"
74+
target="_blank" rel="noopener noreferrer">
75+
<span style="margin-right: 0.5rem;">
76+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"
77+
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
78+
stroke-linejoin="round">
79+
<path
80+
d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4">
81+
</path>
82+
<path d="M9 18c-4.51 2-5-2-7-2"></path>
83+
</svg>
84+
</span>
85+
View Code
86+
</a>
87+
</div>
88+
</div>
89+
</article>
90+
91+
<!-- Card 2: VibeCoding Tutorial -->
92+
<article class="card">
93+
<div style="text-align: left;">
94+
<h2 class="card-title">VibeCoding Tutorial</h2>
95+
<p class="card-desc">
96+
Learn how to build software faster with Coding Agents. A comprehensive guide from first
97+
prompts to detailed configurations.
98+
</p>
99+
<div class="button-group">
100+
<a href="https://infs4205-7205.github.io/VibeCoding_Tutorial/" class="btn btn-primary"
101+
target="_blank" rel="noopener noreferrer">
102+
Start Tutorial
103+
</a>
104+
</div>
105+
</div>
106+
</article>
107+
</div>
108+
109+
</div>
110+
</main>
111+
112+
<footer class="py-6" style="margin-top: auto;">
113+
<div class="container text-center">
114+
<p style="font-size: 0.875rem; line-height: 1.6; color: var(--muted-foreground);">
115+
Team: <span style="font-weight: 600; color: var(--foreground);">Danny Wang</span><sup>*</sup>, Yadan
116+
Luo<sup>†</sup>, Zhuoxiao Chen, Yan Jiang, Xiangyu Sun, Xuwei Xu, Fengyi Zhang, Zhizhen Zhang.
117+
</p>
118+
<p style="font-size: 0.75rem; color: var(--muted-foreground); margin-top: 0.5rem;">
119+
* Author, † Coordinator.
120+
</p>
121+
</div>
122+
</footer>
123+
124+
<script src="script.js"></script>
125+
</body>
126+
127+
</html>

‎script.js‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
document.addEventListener('DOMContentLoaded', () => {
2+
const toggleBtn = document.getElementById('theme-toggle');
3+
const sunIcon = document.querySelector('.sun-icon');
4+
const moonIcon = document.querySelector('.moon-icon');
5+
6+
// Check for saved user preference, if any, on load of the website
7+
const savedTheme = localStorage.getItem('theme');
8+
const systemPrefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
9+
10+
// Default to light if no preference is saved (as per requirements),
11+
// but honor saved preference if it exists.
12+
// If we strictly want default light on first visit regardless of system:
13+
// we just check if 'theme' is 'dark'.
14+
15+
// STRICTLY default to light if no preference is saved.
16+
// We intentionally ignore systemPrefersDark to force the "light" aesthetic by default as requested.
17+
if (savedTheme === 'dark') {
18+
document.documentElement.classList.add('dark');
19+
updateIcons(true);
20+
} else {
21+
document.documentElement.classList.remove('dark');
22+
updateIcons(false);
23+
}
24+
25+
toggleBtn.addEventListener('click', () => {
26+
const isDark = document.documentElement.classList.toggle('dark');
27+
localStorage.setItem('theme', isDark ? 'dark' : 'light');
28+
updateIcons(isDark);
29+
});
30+
31+
function updateIcons(isDark) {
32+
if (isDark) {
33+
sunIcon.style.display = 'block';
34+
moonIcon.style.display = 'none';
35+
} else {
36+
sunIcon.style.display = 'none';
37+
moonIcon.style.display = 'block';
38+
}
39+
}
40+
41+
// Interactive Background Effect
42+
// Tracks mouse position and updates CSS variables for the gradient center
43+
document.addEventListener('mousemove', (e) => {
44+
const x = e.clientX;
45+
const y = e.clientY;
46+
47+
// Update CSS variables on the body
48+
document.body.style.setProperty('--mouse-x', `${x}px`);
49+
document.body.style.setProperty('--mouse-y', `${y}px`);
50+
});
51+
});

0 commit comments

Comments
 (0)