From 11acd6b6b40bce529f64576dff2bfb6f9b61ce73 Mon Sep 17 00:00:00 2001 From: Aaryan Mehta Date: Mon, 16 Feb 2026 22:13:39 -0800 Subject: [PATCH 1/5] feat: Add a new modern organic theme and configure the server to default to index.html as the landing page. --- public/about.html | 328 +++--------- public/index.html | 1204 ++++++++++++++++++--------------------------- public/login.html | 254 +++------- public/style.css | 601 ++++++++++++++++++++++ src/server.js | 8 +- 5 files changed, 1213 insertions(+), 1182 deletions(-) create mode 100644 public/style.css diff --git a/public/about.html b/public/about.html index 045dc12..9d7e545 100644 --- a/public/about.html +++ b/public/about.html @@ -6,319 +6,141 @@ About AutoRemind - - - + -
-

About AutoRemind

+
+

About Us

+

Building tools for students, by students.

-
+
-
+

Who We Are

AutoRemind is being developed by students and researchers in Dan Garcia's R&D group at UC Berkeley, as part of the AFA-Tooling ecosystem. We're committed to creating practical tools - that - solve real problems for students and educators. + that solve real problems for students and educators.

Our work is grounded in the belief that better tools can help students stay organized, reduce stress, and focus on what matters: learning.

-
+
-
+

Our Berkeley Affiliation

AutoRemind is developed within the UC Berkeley EECS department as a research and teaching tool. While we benefit from UC Berkeley's resources and expertise, AutoRemind is not an - official - communication channel of the university. + official communication channel of the university.

For official university communications, please refer to your course syllabus and the official UC Berkeley communication channels provided by your instructor or department.

-
+
-
+

What AutoRemind Does

AutoRemind connects to your course platform (LMS) to send timely reminders about upcoming and overdue assignments. We understand that students juggle many responsibilities, work, extracurriculars, health, personal challenges, - and an extra layer of structure - can make a real difference. + and an extra layer of structure can make a real difference.

AutoRemind is designed to support:

-
    +
    • Students managing multiple courses and deadlines
    • Neurodivergent learners who benefit from external reminders and structure
    • First-generation students navigating new academic environments
    • @@ -328,34 +150,28 @@

      What AutoRemind Does

      You choose your reminder channels (email, SMS, or Discord), how far in advance you want to be notified, and which assignment statuses you want to hear about. It's entirely in your control.

      -
+
-
+

Share Your Feedback

We're constantly working to improve AutoRemind. Whether you're an instructor looking to support your students or a student with ideas for new features, we'd love to hear from you.

-

- Have suggestions? Found a bug? Or just want to share how AutoRemind has helped you? - -

-
+
+ Reach out to us +
+
- -
- - Thanks for using AutoRemind. -
- - © 2025 AutoRemind. Developed at UC Berkeley. - -
+

+ Part of the AFA-Tooling ecosystem.
+ © 2026 AutoRemind. Developed at UC Berkeley. +

diff --git a/public/index.html b/public/index.html index 525b63e..b43abcf 100644 --- a/public/index.html +++ b/public/index.html @@ -4,7 +4,17 @@ - AutoRemind + AutoRemind | Your Academic Autopilot + + + + + + + + @@ -57,587 +67,268 @@ })(); - + - - +
+ style="position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; background: #fcfcf9; z-index: 9999;">
+ style="width: 50px; height: 50px; margin-bottom: 24px; border: 4px solid rgba(47, 71, 44, 0.1); border-top: 4px solid #2f472c; border-radius: 50%; animation: spin 1s linear infinite;">
-
Loading AutoRemind...
+
+ Loading AutoRemind...
+
- - - - -
-

Never miss an assignment.

-
- - -
-
- -
-
Preferred Name
-
- - + + + +
+
+

Your Academic Autopilot.

+

Sync your assignments from everywhere. Get pinged where you actually look.

+ +
+ +
+ + + + Syncs with Canvas +
+
+ + + + Discord Alerts
+
+ + + + Email Summaries +
+
-
Reminder Channels
-

Turn reminders on via:

- -
    -
  • - -
  • -
  • - - - -
  • -
  • - - - -
  • -
- - +
+
+
+
- -
-
Frequency & Timing
+ +
+
+
+ + +
+

Personal Details

+ +
+ + +
+ +
+

Notification Channels

+ +
+ +
+ +
+ + +
+ + +
+ + +
+ + +
+
+
-
- - - days before deadline. + +
+

Timeline Settings

+ +
+ +
+
+ + days before +
+
+ +
+
+

+ Set to 0 for due-day reminders. Max 7 days in advance. +

+
+ + +
-
- 0 - - 7 + +
+

Customize Your Reminders

+ Log In to Configure
-
+
-
- +
+ -
@@ -437,6 +459,7 @@

Unsubscribe

} const appCard = document.querySelector('.app-card'); + const unsubLink = document.getElementById('unsubscribe-link'); if (user) { // Logged In @@ -444,6 +467,8 @@

Unsubscribe

emailEl.style.display = 'inline-block'; logoutBtn.style.display = 'inline-block'; loginLink.style.display = 'none'; + // Show unsubscribe + if (unsubLink) unsubLink.parentElement.style.display = 'block'; // Unlock App if (appCard) appCard.classList.remove('app-locked'); @@ -458,6 +483,8 @@

Unsubscribe

emailEl.style.display = 'none'; logoutBtn.style.display = 'none'; loginLink.style.display = 'inline-flex'; + // Hide unsubscribe + if (unsubLink) unsubLink.parentElement.style.display = 'none'; // Lock App if (appCard) appCard.classList.add('app-locked'); @@ -599,6 +626,25 @@

Unsubscribe

document.getElementById('success-modal').style.display = 'none'; }); + // Wire up the new Save Button to the same logic + const saveBtn = document.getElementById('save-settings-btn'); + if (saveBtn) { + saveBtn.addEventListener('click', async () => { + // Re-use the save logic used by the agreement modal + // But we can skip the agreement modal if we want, or just trigger it. + // For now, let's trigger the same flow as it handles validation/auth checks. + + // If not logged in, redirect + if (!window.auth || !window.auth.user) { + window.location.href = 'login.html'; + return; + } + + // Trigger the save directly + document.getElementById('agree-btn').click(); + }); + } + // --- Unsubscribe Logic --- const unsubModal = document.getElementById('unsubscribe-modal'); document.getElementById('unsubscribe-link').addEventListener('click', (e) => { diff --git a/public/login.html b/public/login.html index 2eaca9f..9a4d4a9 100644 --- a/public/login.html +++ b/public/login.html @@ -36,6 +36,17 @@ max-width: 420px; border: 1px solid rgba(0, 0, 0, 0.05); } + + .error-message { + background: #fef2f2; + color: #d32f2f; + padding: 12px; + border-radius: 8px; + font-size: 14px; + margin-bottom: 20px; + border: 1px solid #fecaca; + display: none; + } @@ -53,7 +64,17 @@ @@ -66,18 +87,34 @@

Welcome Back

Sign in to manage your notifications and stay on top of your coursework.

- - -

- Powered by Supabase Auth -

@@ -133,19 +170,48 @@

Welcome Back

document.addEventListener('DOMContentLoaded', () => { waitForAuth((auth) => { if (auth) { + // If already logged in, redirect to index auth.onAuthStateChange((user, session, loading) => { if (!loading && user) { window.location.href = './index.html'; } }); - } - const loginButton = document.querySelector('.btn--login'); - if (loginButton) { - loginButton.addEventListener('click', (e) => { - e.preventDefault(); - window.location.href = './auth.html'; - }); + // Handle Google Sign In + const loginBtn = document.getElementById('google-signin-btn'); + const errorEl = document.getElementById('error-message'); + + if (loginBtn) { + loginBtn.addEventListener('click', async (e) => { + e.preventDefault(); + errorEl.style.display = 'none'; + loginBtn.disabled = true; + loginBtn.innerHTML = 'Sign in with Google...'; // Simple loading state + + try { + const { error } = await auth.signInWithGoogle(); + if (error) { + throw error; + } + // Redirect handling is done by Supabase/OAuth flow + } catch (err) { + console.error(err); + errorEl.textContent = err.message || 'Failed to sign in'; + errorEl.style.display = 'block'; + loginBtn.disabled = false; + loginBtn.innerHTML = ` + + + + + + + + Sign in with Google + `; + } + }); + } } }); }); diff --git a/public/profile.html b/public/profile.html deleted file mode 100644 index 48650ca..0000000 --- a/public/profile.html +++ /dev/null @@ -1,886 +0,0 @@ - - - - - - - AutoRemind - Edit Profile - - - - - - - - - - - - - -
-
Loading Profile...
-
- - - - - -
-

Edit Your Reminder Settings

-
- - -
-
- -
-
Preferred Name
-
- - -
- -
Reminder Channels
-

Turn reminders on via:

- -
    -
  • - -
  • -
  • - - - -
  • -
  • - - - -
  • -
-
- - -
-
Frequency & Timing
- -
- - - days before deadline. -
- -
- 0 - - 7 -
- -
-
- -
- - -
-
- - - - - -
-
- - Thanks for using AutoRemind. - - -
- - - - - - - - - \ No newline at end of file diff --git a/public/style.css b/public/style.css index cc633b4..c15c13d 100644 --- a/public/style.css +++ b/public/style.css @@ -49,10 +49,14 @@ body { font-family: var(--font-main); - background-color: var(--color-bg); + background-color: #fcfcf9; + /* Dot pattern + Gradients */ background-image: - radial-gradient(circle at 10% 10%, rgba(143, 188, 143, 0.15) 0%, transparent 40%), - radial-gradient(circle at 90% 90%, rgba(47, 71, 44, 0.08) 0%, transparent 40%); + radial-gradient(#e0e0e0 1px, transparent 1px), + radial-gradient(circle at 10% 10%, rgba(143, 188, 143, 0.25) 0%, transparent 40%), + radial-gradient(circle at 90% 90%, rgba(47, 71, 44, 0.15) 0%, transparent 40%); + background-size: 20px 20px, 100% 100%, 100% 100%; + /* Dot sizing */ background-attachment: fixed; color: var(--color-text-main); line-height: 1.6; @@ -88,36 +92,38 @@ ul { position: fixed; z-index: -1; border-radius: 50%; - filter: blur(60px); - opacity: 0.6; + filter: blur(50px); + /* Less blur for more definition */ + opacity: 0.8; + /* Higher opacity */ animation: float 20s infinite ease-in-out; } .bg-shape-1 { - width: 400px; - height: 400px; - background: rgba(143, 188, 143, 0.3); - /* Sage */ + width: 450px; + height: 450px; + background: rgba(143, 188, 143, 0.4); + /* Stronger Sage */ top: -100px; right: -100px; animation-delay: 0s; } .bg-shape-2 { - width: 500px; - height: 500px; - background: rgba(212, 225, 87, 0.15); - /* Lime tint */ + width: 550px; + height: 550px; + background: rgba(212, 225, 87, 0.25); + /* Stronger Lime */ bottom: -150px; left: -100px; animation-delay: -5s; } .bg-shape-3 { - width: 300px; - height: 300px; - background: rgba(47, 71, 44, 0.1); - /* Dark Green */ + width: 350px; + height: 350px; + background: rgba(47, 71, 44, 0.15); + /* Stronger Dark Green */ top: 40%; left: 20%; transform: translate(-50%, -50%); @@ -192,6 +198,32 @@ ul { color: var(--color-primary); } +/* Google Sign In Button */ +.btn--google { + background-color: white; + color: #1f1f1f; + border: 1px solid var(--color-border); + position: relative; + padding-left: 48px; + /* Space for icon */ + transition: var(--transition); +} + +.btn--google:hover { + background-color: #f8f9fa; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12); + border-color: #d2d2d2; +} + +.btn--google svg { + position: absolute; + left: 12px; + top: 50%; + transform: translateY(-50%); + width: 24px; + height: 24px; +} + /* Navbar */ .nav { position: sticky; From 644c8c3f9660535d5b9f654c03c60e1bfa48e7eb Mon Sep 17 00:00:00 2001 From: Aaryan Mehta Date: Tue, 17 Feb 2026 00:12:34 -0800 Subject: [PATCH 3/5] feat: implement responsive navigation, integrate user authentication UI, and refine overall styling of form elements, alerts, and color palette. --- public/about.html | 125 +++++++-- public/index.html | 243 +++++++--------- public/login.html | 46 +++- public/style.css | 685 ++++++++++++++++++++++++++-------------------- 4 files changed, 618 insertions(+), 481 deletions(-) diff --git a/public/about.html b/public/about.html index 8fa9f44..f7506b8 100644 --- a/public/about.html +++ b/public/about.html @@ -45,17 +45,23 @@ border-radius: 4px; } + .about-list { + list-style: none; + padding-left: 0; + } + .about-list li { position: relative; padding-left: 24px; margin-bottom: 12px; + color: var(--color-text-main); } .about-list li::before { content: "•"; position: absolute; left: 8px; - color: var(--color-secondary); + color: var(--color-text-main); font-weight: bold; } @@ -68,9 +74,7 @@ - -
-
+ @@ -186,6 +204,81 @@

Share Your Feedback

Source

+ + + + + + + + + \ No newline at end of file diff --git a/public/index.html b/public/index.html index 4b746da..01dac77 100644 --- a/public/index.html +++ b/public/index.html @@ -76,15 +76,14 @@ -
+ style="width: 40px; height: 40px; margin-bottom: 24px; border: 4px solid rgba(26, 46, 26, 0.1); border-top: 4px solid #1a2e1a; border-radius: 0; animation: spin 1s linear infinite;">
- Loading AutoRemind...
+ style="font-family: 'Merriweather', serif; color: #1a2e1a; font-weight: 700; font-size: 1.1rem; letter-spacing: 0.05em; text-transform: uppercase;"> + Loading...
- -
-
-
+ @@ -132,7 +140,11 @@
- AutoRemind Logo +
+ AutoRemind Logo + AutoRemind +

Your Academic Autopilot.

Sync your assignments from everywhere. Get pinged where you actually look.

@@ -143,14 +155,14 @@

Your Academic Autopilot.

- Syncs with Canvas + Syncs with your LMS
- Discord Alerts + Discord & Text Alerts
@@ -161,9 +173,7 @@

Your Academic Autopilot.

-
- -
+
@@ -285,10 +295,7 @@

Customize Your Reminders

View Source

-
- Unsubscribe from - all alerts -
+ @@ -317,24 +324,15 @@

All Set! 🎉

- -