opelly/WinStudentGoalTracker
1
0
Fork 0
mirror of https://github.com/opelly27/WinStudentGoalTracker.git synced 2026-05-20 00:38:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated button color

Browse Source
This commit is contained in:
ivan-pelly
2026-03-29 18:53:32 -07:00
parent bd360b42ff
commit 0a8d2ebb59
1 changed files with 293 additions and 304 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/index.html
+293 -304
View File
@@ -3,416 +3,405 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description"
content="WIN Student Goal Tracker — a student goal tracker and reporting system for tracking goals, documenting services, and logging critical incidents with auditability and privacy in mind.">
<meta name="description"
content="WIN Student Goal Tracker — a student goal tracker and reporting system for tracking goals, documenting services, and logging critical incidents with auditability and privacy in mind.">
<meta name="theme-color" content="#111827">
<meta name="theme-color" content="#111827">
<title>WIN — Student Goal Tracker and Reporting</title>
<title>WIN — Student Goal Tracker and Reporting</title>
<meta property="og:title" content="WIN — Student Goal Tracker and Reporting">
<meta property="og:description"
content="Track goals, services, and critical incidents for students with secure, auditable workflows designed for student support programs.">
<meta property="og:type" content="website">
<meta property="og:title" content="WIN — Student Goal Tracker and Reporting">
<meta property="og:description"
content="Track goals, services, and critical incidents for students with secure, auditable workflows designed for student support programs.">
<meta property="og:type" content="website">
<style>
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, sans-serif;
margin: 0;
background: #f5f7fa;
color: #111827;
line-height: 1.6;
}
body{
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,sans-serif;
margin:0;
background:#f5f7fa;
color:#111827;
line-height:1.6;
}
header {
background: #111827;
color: white;
padding: 3rem 1.5rem;
text-align: center;
}
header{
background:#111827;
color:white;
padding:3rem 1.5rem;
text-align:center;
}
header h1 {
margin: 0;
font-size: 2.25rem;
}
header h1{
margin:0;
font-size:2.25rem;
}
header p {
margin-top: .75rem;
opacity: .9;
max-width: 70ch;
margin-left: auto;
margin-right: auto;
}
header p{
margin-top:.75rem;
opacity:.9;
max-width:70ch;
margin-left:auto;
margin-right:auto;
}
main {
max-width: 1100px;
margin: 0 auto;
padding: 1.25rem 1rem 3rem;
}
main{
max-width:1100px;
margin:0 auto;
padding:1.25rem 1rem 3rem;
}
.grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 1rem;
}
.grid{
display:grid;
grid-template-columns:repeat(12,1fr);
gap:1rem;
}
.card {
background: white;
border-radius: 14px;
padding: 1.25rem;
box-shadow: 0 6px 18px rgba(17, 24, 39, .08);
border: 1px solid rgba(17, 24, 39, .06);
}
.card{
background:white;
border-radius:14px;
padding:1.25rem;
box-shadow:0 6px 18px rgba(17,24,39,.08);
border:1px solid rgba(17,24,39,.06);
}
.hero {
grid-column: span 12;
}
.hero{grid-column:span 12;}
.two{grid-column:span 12;}
.two {
grid-column: span 12;
}
@media (min-width:860px){
.two{grid-column:span 6;}
}
@media (min-width:860px) {
.two {
grid-column: span 6;
}
}
h2{
margin:0 0 .5rem;
font-size:1.25rem;
}
h2 {
margin: 0 0 .5rem;
font-size: 1.25rem;
}
.muted{
color:rgba(17,24,39,.75);
}
.muted {
color: rgba(17, 24, 39, .75);
}
.pill-row{
display:flex;
flex-wrap:wrap;
gap:.5rem;
margin-top:.75rem;
}
.pill-row {
display: flex;
flex-wrap: wrap;
gap: .5rem;
margin-top: .75rem;
}
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding:.6rem .9rem;
border-radius:10px;
background:#2563eb;
color:white;
text-decoration:none;
font-weight:700;
border:1px solid rgba(17,24,39,.08);
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: .6rem .9rem;
border-radius: 10px;
background: #2563eb;
color: white;
text-decoration: none;
font-weight: 700;
border: 1px solid rgba(17, 24, 39, .08);
}
.btn:hover{
background:#1d4ed8;
}
.btn:hover {
background: #1d4ed8;
}
.grid-3{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:1rem;
}
.grid-3 {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
}
.grid-4{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:1rem;
}
.grid-4 {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1rem;
}
.kpi{
text-align:center;
}
.kpi {
text-align: center;
}
.kpi strong{
display:block;
font-size:1.4rem;
}
.kpi strong {
display: block;
font-size: 1.4rem;
}
code{
white-space:nowrap;
background:#eef2ff;
padding:2px 6px;
border-radius:6px;
}
code {
white-space: nowrap;
background: #eef2ff;
padding: 2px 6px;
border-radius: 6px;
}
footer{
text-align:center;
padding:2rem;
color:rgba(17,24,39,.65);
}
</style>
footer {
text-align: center;
padding: 2rem;
color: rgba(17, 24, 39, .65);
}
</style>
</head>
<body>
<header>
<header>
<h1>WIN — Student Goal Tracker and Reporting</h1>
<h1>WIN — Student Goal Tracker and Reporting</h1>
<p>
Track student goals, document services, and log critical incidents with auditable workflows designed for student support programs.
</p>
<p>
Track student goals, document services, and log critical incidents with auditable workflows designed for student
support programs.
</p>
<!-- Live prototype + survey -->
<div style="margin-top:1.5rem">
<!-- Live prototype + survey -->
<div style="margin-top:1.5rem">
<a href="https://win.opelly.me/"
class="btn"
target="_blank"
rel="noopener noreferrer"
style="margin-right:.5rem;">
Open Live Prototype
</a>
<a href="https://win.opelly.me/" class="btn" target="_blank" rel="noopener noreferrer"
style="margin-right:.5rem;">
Open Live Prototype
</a>
<a href="https://docs.google.com/forms/d/e/1FAIpQLSd4waAGdgDC9SpA2uvelWQtpJt7sGqsFgc-PCBOMoT99LmLHA/viewform"
class="btn"
target="_blank"
rel="noopener noreferrer"
style="background:#16a34a;">
Take Evaluation Survey
</a>
<a href="https://docs.google.com/forms/d/e/1FAIpQLSd4waAGdgDC9SpA2uvelWQtpJt7sGqsFgc-PCBOMoT99LmLHA/viewform"
class="btn" target="_blank" rel="noopener noreferrer" style="background:#16a34a;">
Take Evaluation Survey
</a>
</div>
</div>
</header>
</header>
<main>
<main>
<section class="grid">
<section class="grid">
<section class="card hero">
<section class="card hero">
<h2>Project Overview</h2>
<h2>Project Overview</h2>
<p class="muted">
WIN Student Goal Tracker supports student goal tracking, services documentation,
and critical incident reporting with auditability and privacy in mind.
The system reduces manual paperwork and improves visibility into student progress.
</p>
<p class="muted">
WIN Student Goal Tracker supports student goal tracking, services documentation,
and critical incident reporting with auditability and privacy in mind.
The system reduces manual paperwork and improves visibility into student progress.
</p>
</section>
</section>
<section class="card two">
<section class="card two">
<h2>Typical Workflow</h2>
<h2>Typical Workflow</h2>
<ol>
<li>Select a student.</li>
<li>Select a goal.</li>
<li>Record progress events for that goal.</li>
<li>Record case notes and services provided.</li>
<li>If needed, log a critical incident.</li>
<li>Generate reports for program outcomes.</li>
</ol>
<ol>
<li>Select a student.</li>
<li>Select a goal.</li>
<li>Record progress events for that goal.</li>
<li>Record case notes and services provided.</li>
<li>If needed, log a critical incident.</li>
<li>Generate reports for program outcomes.</li>
</ol>
</section>
</section>
<section class="card two">
<section class="card two">
<h2>Core Features</h2>
<h2>Core Features</h2>
<ul>
<li>👤 <strong>Student profiles:</strong> demographics and program context.</li>
<li>🎯 <strong>Goal management:</strong> sub-goals, statuses, and progress tracking.</li>
<li>📝 <strong>Case documentation:</strong> notes and service tracking.</li>
<li>⚠️ <strong>Critical incidents:</strong> consistent logging and review.</li>
<li>🔎 <strong>Search &amp; filters:</strong> quickly locate students.</li>
</ul>
<ul>
<li>👤 <strong>Student profiles:</strong> demographics and program context.</li>
<li>🎯 <strong>Goal management:</strong> sub-goals, statuses, and progress tracking.</li>
<li>📝 <strong>Case documentation:</strong> notes and service tracking.</li>
<li>⚠️ <strong>Critical incidents:</strong> consistent logging and review.</li>
<li>🔎 <strong>Search &amp; filters:</strong> quickly locate students.</li>
</ul>
</section>
</section>
<section class="card two">
<section class="card two">
<h2>Project Structure</h2>
<h2>Project Structure</h2>
<ul>
<li><code>api/</code> — middle-tier services and data access</li>
<li><code>ui/</code> — front-end application</li>
<li><code>db/</code> — database structures</li>
<li><code>SECURITY.md</code> — security practices</li>
<li><code>README.md</code> — build instructions</li>
</ul>
<ul>
<li><code>api/</code> — middle-tier services and data access</li>
<li><code>ui/</code> — front-end application</li>
<li><code>db/</code> — database structures</li>
<li><code>SECURITY.md</code> — security practices</li>
<li><code>README.md</code> — build instructions</li>
</ul>
</section>
</section>
<section class="card two">
<section class="card two">
<h2>Getting Started</h2>
<h2>Getting Started</h2>
<ol>
<li>Open the <strong>live prototype</strong> to validate the core workflow.</li>
<li>Complete the 3 evaluation tasks on the prototype.</li>
<li>Submit feedback using the <strong>evaluation survey</strong>.</li>
</ol>
<ol>
<li>Open the <strong>live prototype</strong> to validate the core workflow.</li>
<li>Complete the 3 evaluation tasks on the prototype.</li>
<li>Submit feedback using the <strong>evaluation survey</strong>.</li>
</ol>
<a href="https://github.com/opelly27/WinStudentGoalTracker"
class="btn"
target="_blank"
rel="noopener noreferrer">
Go to GitHub
</a>
<a href="https://github.com/opelly27/WinStudentGoalTracker" class="btn" target="_blank"
rel="noopener noreferrer">
Go to GitHub
</a>
</section>
</section>
</section>
</section>
<section class="card" style="margin-top:1.25rem;">
<section class="card" style="margin-top:1.25rem;">
<h2>Roadmap</h2>
<h2>Roadmap</h2>
<div class="grid-3">
<div class="grid-3">
<div class="card" style="box-shadow:none;border:1px solid #e5e7eb;">
<h3>MVP</h3>
<ul>
<li>Student profiles</li>
<li>Goal creation</li>
<li>Incident logging</li>
</ul>
</div>
<div class="card" style="box-shadow:none;border:1px solid #e5e7eb;">
<h3>MVP</h3>
<ul>
<li>Student profiles</li>
<li>Goal creation</li>
<li>Incident logging</li>
</ul>
</div>
<div class="card" style="box-shadow:none;border:1px solid #e5e7eb;">
<h3>Operations</h3>
<ul>
<li>Search &amp; filters</li>
<li>Reports &amp; exports</li>
<li>Supervisor review workflow</li>
</ul>
</div>
<div class="card" style="box-shadow:none;border:1px solid #e5e7eb;">
<h3>Operations</h3>
<ul>
<li>Search &amp; filters</li>
<li>Reports &amp; exports</li>
<li>Supervisor review workflow</li>
</ul>
</div>
<div class="card" style="box-shadow:none;border:1px solid #e5e7eb;">
<h3>Compliance</h3>
<ul>
<li>Audit log viewer</li>
<li>Retention policy</li>
<li>Incident classification</li>
</ul>
</div>
<div class="card" style="box-shadow:none;border:1px solid #e5e7eb;">
<h3>Compliance</h3>
<ul>
<li>Audit log viewer</li>
<li>Retention policy</li>
<li>Incident classification</li>
</ul>
</div>
</div>
</div>
</section>
</section>
<section class="card" style="margin-top:1.25rem;">
<section class="card" style="margin-top:1.25rem;">
<h2>Team Members</h2>
<h2>Team Members</h2>
<ul>
<li><b>Armin Abaye</b> — UX/UI Lead &amp; Product Strategy</li>
<li><b>Ivan Pelly</b> — Full Stack Development Lead</li>
<li><b>Oliver Pelly</b> — Backend Systems &amp; Security Engineer</li>
<li><b>Raul Rosado</b> — Infrastructure &amp; Governance Lead</li>
<li><b>Vraj Patel</b> — Front-End Development &amp; Integration Lead</li>
</ul>
<ul>
<li><b>Armin Abaye</b> — UX/UI Lead &amp; Product Strategy</li>
<li><b>Ivan Pelly</b> — Full Stack Development Lead</li>
<li><b>Oliver Pelly</b> — Backend Systems &amp; Security Engineer</li>
<li><b>Raul Rosado</b> — Infrastructure &amp; Governance Lead</li>
<li><b>Vraj Patel</b> — Front-End Development &amp; Integration Lead</li>
</ul>
</section>
</section>
<section class="card" style="margin-top:1.25rem;" aria-labelledby="documentation">
<section class="card" style="margin-top:1.25rem;" aria-labelledby="documentation">
<h2 id="documentation">Documentation</h2>
<h2 id="documentation">Documentation</h2>
<p class="muted">
Stakeholders: open the live prototype, complete the tasks, then submit feedback using the survey.
</p>
<p class="muted">
Stakeholders: open the live prototype, complete the tasks, then submit feedback using the survey.
</p>
<div class="pill-row">
<div class="pill-row">
<a href="prototype.html" class="btn">
Prototype Page (Tasks + Links)
</a>
<a href="prototype.html" class="btn">
Prototype Page (Tasks + Links)
</a>
<a href="https://win.opelly.me/"
class="btn"
target="_blank"
rel="noopener noreferrer">
Live Prototype
</a>
<a href="https://win.opelly.me/" class="btn" target="_blank" rel="noopener noreferrer">
Live Prototype
</a>
<a href="https://docs.google.com/forms/d/e/1FAIpQLSd4waAGdgDC9SpA2uvelWQtpJt7sGqsFgc-PCBOMoT99LmLHA/viewform"
class="btn"
target="_blank"
rel="noopener noreferrer"
style="background:#16a34a;">
Prototype Evaluation Survey
</a>
<a href="https://docs.google.com/forms/d/e/1FAIpQLSd4waAGdgDC9SpA2uvelWQtpJt7sGqsFgc-PCBOMoT99LmLHA/viewform"
class="btn" target="_blank" rel="noopener noreferrer" style="background:#16a34a;">
Prototype Evaluation Survey
</a>
<a href="https://www.figma.com/design/VyuyyPsPWtZ4jU5O93TknM/C4G-WIN---Initial-Design?node-id=1-5"
class="btn"
target="_blank"
rel="noopener noreferrer">
Figma Design (Desktop)
</a>
<a href="https://www.figma.com/design/VyuyyPsPWtZ4jU5O93TknM/C4G-WIN---Initial-Design?node-id=1-5" class="btn"
target="_blank" rel="noopener noreferrer">
Figma Design (Desktop)
</a>
<a href="https://www.figma.com/design/VyuyyPsPWtZ4jU5O93TknM/C4G-WIN---Initial-Design?node-id=1-4"
class="btn"
target="_blank"
rel="noopener noreferrer">
Figma Design (Mobile)
</a>
<a href="https://www.figma.com/design/VyuyyPsPWtZ4jU5O93TknM/C4G-WIN---Initial-Design?node-id=1-4" class="btn"
target="_blank" rel="noopener noreferrer">
Figma Design (Mobile)
</a>
<a href="db.html" class="btn">Database Documentation</a>
<a href="api.html" class="btn">API Documentation</a>
<a href="ui.html" class="btn">UI Documentation</a>
<a href="um.html" class="btn">User Manual Documentation</a>
<a href="technical.html" class="btn">Technical Documentation</a>
<a href="p6video.html" class="btn">P6 Presentation Video</a>
<a href="db.html" class="btn">Database Documentation</a>
<a href="api.html" class="btn">API Documentation</a>
<a href="ui.html" class="btn">UI Documentation</a>
<a href="um.html" class="btn">User Manual Documentation</a>
<a href="technical.html" class="btn">Technical Documentation</a>
<a href="p6video.html" class="btn" style="background:#7816e9;">🎬 P6 Presentation Video</a>
</div>
</div>
</section>
</section>
<section class="card" style="margin-top:1.25rem;">
<section class="card" style="margin-top:1.25rem;">
<h2>Lighthouse Scores</h2>
<h2>Lighthouse Scores</h2>
<div class="grid-4">
<div class="grid-4">
<div class="kpi">
<strong>100</strong>
<span>Performance</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>Performance</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>Accessibility</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>Accessibility</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>Best Practices</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>Best Practices</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>SEO</span>
</div>
<div class="kpi">
<strong>100</strong>
<span>SEO</span>
</div>
</div>
</div>
<small style="display:block;text-align:center;margin-top:8px;">
Tested in a Chrome Incognito window.
</small>
<small style="display:block;text-align:center;margin-top:8px;">
Tested in a Chrome Incognito window.
</small>
</section>
</section>
</main>
</main>
<footer>
© 2026 WIN Student Goal Tracker — Built for student support and accountability.
</footer>
<footer>
© 2026 WIN Student Goal Tracker — Built for student support and accountability.
</footer>
</body>
</html>
</html>