Skip to content

Commit 3b6ef0d

Browse files
zh1pengzh1peng
authored
Merge pull request #2 from TaskBeacon/k8id7l-codex/verify-taskbeacon-website-repo
Redesign site with modular pages
2 parents 14e1348 + 626a5ff commit 3b6ef0d

File tree

13 files changed

+265
-67
lines changed

13 files changed

+265
-67
lines changed

‎README.md‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1 @@
1-
# TAPS-Website
2-
Task and Paradigm Structure
31

4-
## Editing Content
5-
6-
All section text on the homepage is loaded from Markdown files in the
7-
`content/` directory. Edit those files to change the copy without touching the
8-
HTML.

‎assets/team/.gitkeep‎

Whitespace-only changes.

‎content/future.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Explore LLM-powered generation of cognitive tasks using natural language.

‎content/tasks.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
Find exciting tasks and their variations.
2+
3+
More details coming soon.

‎css/.gitkeep‎

Whitespace-only changes.

‎css/style.css‎

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
body {
2+
font-family: 'Inter', sans-serif;
3+
background: #fdfdfd;
4+
color: #222;
5+
margin: 0;
6+
padding: 0;
7+
}
8+
9+
.header {
10+
display: flex;
11+
justify-content: space-between;
12+
align-items: center;
13+
padding: 1rem 2rem;
14+
background: #fff;
15+
border-bottom: 2px solid #eee;
16+
}
17+
18+
.logo {
19+
display: flex;
20+
align-items: center;
21+
font-weight: 700;
22+
font-size: 1.5rem;
23+
}
24+
25+
.logo-icon {
26+
margin-right: 10px;
27+
font-size: 32px;
28+
}
29+
30+
.nav button {
31+
background: none;
32+
border: none;
33+
font-size: 1rem;
34+
cursor: pointer;
35+
}
36+
37+
.dropdown {
38+
position: absolute;
39+
background: white;
40+
list-style: none;
41+
border: 1px solid #ddd;
42+
margin-top: 10px;
43+
padding: 0;
44+
right: 2rem;
45+
z-index: 10;
46+
}
47+
48+
.dropdown li {
49+
padding: 0.5rem 1rem;
50+
border-bottom: 1px solid #eee;
51+
}
52+
53+
.dropdown li a {
54+
text-decoration: none;
55+
color: #222;
56+
}
57+
58+
.hidden {
59+
display: none;
60+
}
61+
62+
.container {
63+
padding: 2rem;
64+
max-width: 900px;
65+
margin: auto;
66+
}
67+
68+
.card {
69+
display: flex;
70+
background: #fff;
71+
border: 1px solid #ddd;
72+
padding: 1rem;
73+
margin-bottom: 1.5rem;
74+
align-items: center;
75+
border-radius: 6px;
76+
}
77+
78+
.card .icon {
79+
font-size: 48px;
80+
margin-right: 1.2rem;
81+
}
82+
83+
.card h2 {
84+
margin: 0 0 0.5rem 0;
85+
}
86+
87+
.team {
88+
margin-top: 3rem;
89+
}
90+
91+
.team-grid {
92+
display: flex;
93+
gap: 2rem;
94+
flex-wrap: wrap;
95+
}
96+
97+
.member {
98+
text-align: center;
99+
}
100+
101+
.member .icon {
102+
font-size: 64px;
103+
display: block;
104+
margin-bottom: 0.5rem;
105+
}

‎future.html‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6+
<title>Future Directions - TaskBeacon</title>
7+
<link rel="stylesheet" href="css/style.css"/>
8+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet"/>
9+
</head>
10+
<body>
11+
<header class="header">
12+
<div class="logo">
13+
<span class="logo-icon" role="img" aria-label="Beacon">📡</span>
14+
<span>TaskBeacon</span>
15+
</div>
16+
<nav class="nav">
17+
<button id="menu-button">Menu ▾</button>
18+
<ul class="dropdown hidden" id="dropdown-menu">
19+
<li><a href="index.html">Home</a></li>
20+
<li><a href="taps.html">TAPS</a></li>
21+
<li><a href="psyflow.html">PsyFlow</a></li>
22+
<li><a href="tasks.html">Tasks</a></li>
23+
</ul>
24+
</nav>
25+
</header>
26+
27+
<main class="container">
28+
<h1>Future Directions</h1>
29+
<p>Explore upcoming ideas and features for TaskBeacon.</p>
30+
</main>
31+
32+
<script src="js/menu.js"></script>
33+
</body>
34+
</html>

‎index.html‎

Lines changed: 0 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -4,67 +4,7 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
66
<title>TaskBeacon</title>
7-
<link rel="stylesheet" href="styles/main.css"/>
8-
<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
9-
</head>
10-
<body>
11-
<div class="container">
12-
<header>
13-
<h1>🟡 TASKBEACON</h1>
14-
<button class="btn">Browse Tasks</button>
15-
</header>
167

17-
<section class="hero">
18-
<h2>STANDARDIZING COGNITIVE TASKS</h2>
19-
<p>A platform for visioning and sharing standard cognitive tasks</p>
20-
</section>
21-
22-
<section class="features">
23-
<div class="card" id="taps-section">
24-
<span class="icon" role="img" aria-label="TAPS icon">📝</span>
25-
<h3>STANDARD STRUCTURE</h3>
26-
<div class="content" data-src="content/taps.md">Loading...</div>
27-
</div>
28-
<div class="card" id="psyflow-section">
29-
<span class="icon" role="img" aria-label="Psyflow icon">🧠</span>
30-
<h3>PSYFLOW FRAMEWORK</h3>
31-
<div class="content" data-src="content/psyflow.md">Loading...</div>
32-
</div>
33-
<div class="card" id="library-section">
34-
<span class="icon" role="img" aria-label="Library icon">📚</span>
35-
<h3>BROWSE TASK LIBRARY</h3>
36-
<div class="content" data-src="content/library.md">Loading...</div>
37-
</div>
38-
</section>
39-
40-
<section class="task-library">
41-
<h2>TASK LIBRARY</h2>
42-
<ul class="content" data-src="content/task-list.md"></ul>
43-
</section>
44-
45-
<footer>
46-
<button class="btn">GET STARTED</button>
47-
</footer>
48-
</div>
49-
50-
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/showdown.min.js"></script>
51-
<script>
52-
const converter = new showdown.Converter();
53-
document.querySelectorAll('.content').forEach(async element => {
54-
const src = element.getAttribute('data-src');
55-
if (src) {
56-
try {
57-
const response = await fetch(src);
58-
const text = await response.text();
59-
if (element.tagName.toLowerCase() === 'ul') {
60-
// convert lines to list items
61-
const items = text.split(/\r?\n/).filter(Boolean).map(t => `<li>${converter.makeHtml(t)}</li>`).join('');
62-
element.innerHTML = items;
63-
} else {
64-
element.innerHTML = converter.makeHtml(text);
65-
}
66-
} catch (err) {
67-
element.textContent = 'Content failed to load.';
688
}
699
}
7010
});

‎js/.gitkeep‎

Whitespace-only changes.

‎js/menu.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
document.getElementById('menu-button').addEventListener('click', () => {
2+
document.getElementById('dropdown-menu').classList.toggle('hidden');
3+
});

0 commit comments

Comments
 (0)