Implement the following plan:

Homepage Quotes Feature

Add rotating quotes about AI to the homepage that fade in/out on either side of the terminal prompt.

Design

┌─────────────────────────────────────────────────────────────────────┐
│                      CS 199 UAI • Spring 2026                       │
│                    Using and Understanding AI                        │
│                                                                      │
│  ┌─────────────┐   ╔═══════════════════════╗   ┌─────────────┐      │
│  │ "Quote..."  │   ║                       ║   │ "Quote..."  │      │
│  │   — Author  │   ║   Terminal Prompt     ║   │   — Author  │      │
│  │   (fade)    │   ║                       ║   │   (fade)    │      │
│  └─────────────┘   ╚═══════════════════════╝   └─────────────┘      │
│                                                                      │
│                University of Illinois Urbana-Champaign              │
└─────────────────────────────────────────────────────────────────────┘

Behavior:

• Quotes appear one at a time, alternating sides (left, then right, etc.)
• Each quote fades in over ~1s, displays for ~6s, fades out over ~1s
• Staggered timing so quotes overlap slightly for visual interest
• Random selection from quote pool (no immediate repeats)
• Randomized vertical position within safe bounds (e.g., 20%-80% of container height)
• Position calculated to ensure quote is fully visible (accounting for quote height)

Files to Create/Modify

1. content/quotes.ts (NEW)

Store quotes as a TypeScript array for type safety and easy imports:

export interface Quote {
  text: string;
  author: string;
  source?: string;  // Book, article, interview, etc.
  year?: number;
}

export const quotes: Quote[] = [
  // Positive/Exciting
  {
    text: "We are at an inflection point...",
    author: "Satya Nadella",
    source: "Microsoft Ignite 2023",
    year: 2023
  },
  // Cautionary
  {
    text: "The development of full artificial intelligence...",
    author: "Stephen Hawking",
    source: "BBC Interview",
    year: 2014
  },
  // ... 15-20 quotes total
];

Quote selection criteria:

• Mix of positive/optimistic and cautionary perspectives
• Emphasis on the current moment being pivotal
• Authors from diverse backgrounds (tech leaders, scientists, philosophers, ethicists)
• All verifiable with citations

2. apps/web/components/floating-quotes.tsx (NEW)

Client component that manages quote display and animations:

"use client";

import { useState, useEffect } from "react";
import { quotes } from "@content/quotes";

interface QuoteState {
  index: number;
  visible: boolean;
  topPercent: number;  // Random vertical position (20-80%)
}

export function FloatingQuotes() {
  const [leftQuote, setLeftQuote] = useState<QuoteState | null>(null);
  const [rightQuote, setRightQuote] = useState<QuoteState | null>(null);

  // Generate random position within safe bounds
  const getRandomTop = () => Math.floor(Math.random() * 60) + 20; // 20-80%

  // Rotation timer: fade in left -> wait -> fade out -> fade in right -> etc.
  useEffect(() => {
    // Timer logic with staggered left/right alternation
  }, []);

  return (
    <>
      {/* Left quote - positioned with random top % */}
      {leftQuote && (
        <div
          className="absolute left-4 max-w-xs transition-all duration-1000"
          style={{ top: `${leftQuote.topPercent}%` }}
        >
          <QuoteCard quote={quotes[leftQuote.index]} visible={leftQuote.visible} />
        </div>
      )}

      {/* Right quote - positioned with random top % */}
      {rightQuote && (
        <div
          className="absolute right-4 max-w-xs transition-all duration-1000"
          style={{ top: `${rightQuote.topPercent}%` }}
        >
          <QuoteCard quote={quotes[rightQuote.index]} visible={rightQuote.visible} />
        </div>
      )}
    </>
  );
}

Animation approach:

• Use CSS transitions with opacity and transform (translateY for subtle entrance)
• State-driven visibility toggling
• transition-all duration-1000 for smooth fades
• Random top percentage (20-80%) ensures quotes stay within visible area
• New position generated each time a quote appears

3. apps/web/app/page.tsx (MODIFY)

Wrap existing content in a relative container and add FloatingQuotes:

export default function HomePage() {
  return (
    <main className="relative ...">
      {/* Existing header */}
      {/* Terminal prompt */}
      {/* Existing footer */}

      {/* Floating quotes on sides - hidden on mobile */}
      <FloatingQuotes />
    </main>
  );
}

4. apps/web/styles/globals.css (MODIFY)

Add quote-specific styles if needed:

.quote-card {
  /* Subtle styling matching terminal aesthetic */
}

Quote Content

Include 40-50 quotes with diverse voices and perspectives:

Tech Leaders:

• Satya Nadella (Microsoft)
• Bill Gates (Microsoft founder)
• Jensen Huang (NVIDIA)
• Sundar Pichai (Google)
• Sam Altman (OpenAI)
• Dario Amodei (Anthropic)
• Fei-Fei Li (Stanford, AI4ALL)

AI Researchers & Scientists:

• Demis Hassabis (DeepMind)
• Yann LeCun (Meta AI)
• Geoffrey Hinton ("Godfather of AI")
• Yoshua Bengio (Mila)
• Andrew Ng (Stanford, Coursera)
• Ilya Sutskever (OpenAI co-founder)

Diverse Voices in AI Ethics & Policy:

• Timnit Gebru (DAIR Institute)
• Joy Buolamwini (Algorithmic Justice League)
• Safiya Noble (UCLA, author of "Algorithms of Oppression")
• Ruha Benjamin (Princeton, author of "Race After Technology")
• Meredith Whittaker (Signal, AI Now Institute)
• Kate Crawford (Microsoft Research, author of "Atlas of AI")
• Rumman Chowdhury (former Twitter ML Ethics)

Philosophers & Ethicists:

• Nick Bostrom (Future of Humanity Institute)
• Max Tegmark (MIT, Future of Life Institute)
• Stuart Russell (UC Berkeley)
• Toby Ord (Oxford, author of "The Precipice")

Historical Figures:

• Alan Turing
• John McCarthy
• Marvin Minsky
• Grace Hopper

Public Figures & Authors:

• Stephen Hawking
• Elon Musk
• Kai-Fu Lee (author of "AI Superpowers")
• Cathy O'Neil (author of "Weapons of Math Destruction")
• Sherry Turkle (MIT, author of "Alone Together")

Each quote must:

• Have a verifiable source (book, interview, article, speech)
• Be relevant to the current AI moment
• Be concise enough to read in a few seconds
• Include year when possible

Responsive Behavior

• Desktop (lg+): Quotes visible on both sides
• Tablet (md): Quotes may be smaller or single-sided
• Mobile (sm): Quotes hidden (terminal takes full width)

Use Tailwind responsive classes: hidden lg:block

Implementation Order

1. Create content/quotes.ts with curated quote collection
2. Create FloatingQuotes component with animation logic
3. Update homepage to include the component
4. Add any necessary CSS
5. Test animations and timing

Verification

1. Run bun run dev and visit homepage
2. Verify quotes appear on desktop, fade in/out smoothly
3. Verify quotes are hidden on mobile viewport
4. Verify no layout shift when quotes appear/disappear
5. Run bun run tsc to check types
6. Deploy to dev site and test

If you need specific details from before exiting plan mode (like exact code snippets, error messages, or content you generated), read the full transcript at: ~/.claude/projects/-Users-challen-www-usingandunderstanding-ai/254e38c0-9bee-45d2-8ad3-e58b92f74ba6.jsonl

I see a few quotes but then they stop. Let's make sure to only display one at a time. And let's move them closer to the chat window: either right justified on the left and left on the right or centered in the gutters. But probably just a certain distance from the chat window.

It would be nice to have a bit of randomness here: a bias towards switching sides but not every time. A bit of randomness as far as height, amount of time on screen, and so on.

Nice! Let's have them display a bit longer overall. And can we add links to the quotes? At least to the authors who have Wikipedia pages?

I meant for the quote authors. It would also be great to link each quote to the article or video where it came from, assuming that's also possible. So each quote could have two links: one from the body to the source (optional, but encouraged) and a second from the author to their Wikipedia profile (if they have one).

Let's not have quotes appear with their top below midway down the page. Also the links do not work: they aren't clickable.

Nope. Links are still not clickable. The pointer doesn't change either. Perhaps a problem with the container?

Nice! Next, can we have the quote source on its own line?

OK. Please remove any noted trolls, like Elon Musk. Also please remove any source name links that you're not 100% sure about.

Wait. The Andrew Ng one was OK. Can we add a skill so that you can use yt-dlp to look up stuff like this? Even just the video description should be able to hlep.

And maybe use the same approach to double-check the other YouTube links? It would be nice to include those if they are correct.

Can we get to 64 quotes? That would be great! A good computer science number.

OK.

Yes, more is fine! I like the one about natural stupidity :-). Do we have quotes also discussing things like the implications for human intelligence? And quotes from philosophers of technology like McLuhan, Postman, Carr, and Ellul?

Regarding human intelligence I was thinking along the lines of questions about what is intelligence, what is creativity, perhaps neuroscientists who are using AI to study the brain. Of course something from Lee Sedol regarding Move 37 is always welcome.

I think that quote from Nicholas Carr is actually the title of an essay, since the second half doesn't make sense as a sentence.

This session is being continued from a previous conversation that ran out of context. The summary below covers the earlier portion of the conversation.

Analysis: Let me analyze the conversation chronologically to capture all important details:

1. Initial Request: User asked to implement a homepage quotes feature based on a detailed plan that included:

   • Rotating quotes about AI on either side of the terminal prompt
   • Fade in/out animations
   • Randomized vertical positioning
   • 40-50 quotes from diverse voices
   • Create content/quotes.ts and apps/web/components/floating-quotes.tsx
   • Modify homepage to include the component

2. Initial Implementation:

   • Created content/quotes.ts with Quote interface and ~47 quotes
   • Created FloatingQuotes component with left/right alternating display
   • Modified apps/web/app/page.tsx to include the component
   • Fixed TypeScript errors related to array access returning undefined

3. User Feedback Round 1: "I see a few quotes but then they stop. Let's make sure to only display one at a time. And let's move them closer to the chat window"

4. User Feedback Round 2: "It would be nice to have a bit of randomness here: a bias towards switching sides but not every time. A bit of randomness as far as height, amount of time on screen, and so on."

5. Rewrote component with:

   • One quote at a time
   • 70% chance to switch sides
   • Random vertical position (25-75% initially)
   • Random display time (5-8 seconds, later 8-12)
   • Random pause between quotes (1-3 seconds)
   • Positioned closer to terminal using calc(50% + 400px)

6. User Feedback Round 3: "Let's have them display a bit longer overall. And can we add links to the quotes?"

   • Added sourceUrl and authorUrl fields
   • Links open in new tab

7. User Feedback Round 4: "Let's not have quotes appear with their top below midway down the page. Also the links do not work: they aren't clickable."

   • Changed vertical range to 15-45%
   • Removed pointer-events-none but links still didn't work

8. User Feedback Round 5: Links still not clickable - found the issue was z-index. Content div had z-10, quotes needed z-20.

9. User Feedback Round 6: "can we have the quote source on its own line?"

   • Modified QuoteCard to put source on separate line

10. User Feedback Round 7: "remove any noted trolls, like Elon Musk. Also please remove any source name links that you're not 100% sure about."

    • Removed 3 Elon Musk quotes
    • Removed uncertain YouTube URLs

11. User Feedback Round 8: "The Andrew Ng one was OK. Can we add a skill so that you can use yt-dlp to look up stuff like this?"

    • Created .claude/skills/yt-lookup.md skill
    • Used yt-dlp to verify YouTube videos
    • Found correct URLs for Sundar Pichai, Jensen Huang, Geoffrey Hinton (60 Minutes, not CBS), Sam Altman, Andrew Ng

12. User Feedback Round 9: "one quote max per author rule" and expand to 64 quotes

    • Removed duplicate authors
    • Added new quotes from computing pioneers, philosophers, etc.

13. User Feedback Round 10: Asked for quotes from philosophers of technology (McLuhan, Postman, Carr, Ellul) and about human intelligence, creativity, Lee Sedol on Move 37

14. Current Issue: User noted the Nicholas Carr quote "Is Google making us stupid? What the Internet is doing to our brains." is actually an essay title, not a proper sentence quote.

Key files:

• ~/www/usingandunderstanding.ai/content/quotes.ts
• ~/www/usingandunderstanding.ai/apps/web/components/floating-quotes.tsx
• ~/www/usingandunderstanding.ai/apps/web/app/page.tsx
• ~/www/usingandunderstanding.ai/.claude/skills/yt-lookup.md

Current state: ~78 quotes but with duplicates (McLuhan, Postman, Turing now have 2 each after recent additions). Just removed McLuhan duplicate and Postman duplicate. Still need to handle Turing duplicate and fix the Carr quote.

Summary:

1. Primary Request and Intent: The user requested implementation of a floating quotes feature for an AI course homepage that displays rotating quotes about AI on either side of a terminal prompt. Key requirements evolved through feedback:

   • One quote at a time (not simultaneous left/right)
   • Randomized behavior: side switching (70% bias), vertical position (15-45%), display duration (8-12s), pause between quotes (1-3s)
   • Positioned close to the terminal widget
   • Clickable links: quote text links to source, author name links to Wikipedia
   • Links open in new tabs
   • Source displayed on its own line
   • One quote maximum per author
   • Target of 64+ quotes from diverse voices
   • Remove trolls (Elon Musk)
   • Only include verified source URLs
   • Include philosophers of technology (McLuhan, Postman, Carr, Ellul)
   • Include quotes about human intelligence, creativity, and Lee Sedol's Move 37 quote

2. Key Technical Concepts:

   • React client components with "use client" directive
   • useState/useEffect/useRef hooks for animation timing
   • CSS transitions for fade in/out (transition-all duration-1000)
   • Absolute positioning with calc() for placement relative to center
   • z-index layering (z-20 for quotes above z-10 content)
   • TypeScript interfaces for Quote type
   • yt-dlp CLI tool for YouTube video verification
   • Tailwind CSS responsive classes (hidden xl:block)

3. Files and Code Sections:

   • ~/www/usingandunderstanding.ai/content/quotes.ts

     • Central data file containing all quotes
     • Quote interface with optional sourceUrl and authorUrl

     export interface Quote {
       text: string;
       author: string;
       source?: string;
       year?: number;
       sourceUrl?: string;
       authorUrl?: string;
     }
     

     • Currently contains ~78 quotes but needs deduplication

   • ~/www/usingandunderstanding.ai/apps/web/components/floating-quotes.tsx

     • Client component managing quote display and animations
     • Key features: random side selection, random timing, fade animations

     "use client";
     import { useState, useEffect, useRef } from "react";
     import { quotes, type Quote } from "@content/quotes";
     
     type Side = "left" | "right";
     
     interface QuoteState {
       index: number;
       visible: boolean;
       topPercent: number;
       side: Side;
     }
     
     // QuoteCard renders with links
     function QuoteCard({ quote, visible, side }: { quote: Quote; visible: boolean; side: Side }) {
       const quoteText = <span>&ldquo;{quote.text}&rdquo;</span>;
       const sourceInfo = quote.source && (
         <span className="text-foreground-muted/50 mt-1 block not-italic">
           {quote.source}
           {quote.year && ` (${quote.year})`}
         </span>
       );
       // ... renders with sourceUrl link on quote, authorUrl link on author
     }
     
     export function FloatingQuotes() {
       // Uses refs to avoid stale closures
       const usedIndicesRef = useRef<number[]>([]);
       const lastSideRef = useRef<Side>("right");
       
       // 70% chance to switch sides
       const getNextSide = (): Side => {
         const shouldSwitch = Math.random() < 0.7;
         // ...
       };
       
       // Random position 15-45%
       const getRandomTop = () => Math.floor(Math.random() * 30) + 15;
       
       // Random display 8-12 seconds
       const getRandomDisplayTime = () => 8000 + Math.floor(Math.random() * 4000);
       
       // Containers use z-20 to appear above content (z-10)
       return (
         <>
           <div className="absolute z-20 hidden w-44 xl:block"
             style={{ top: `${topPercent}%`, right: "calc(50% + 400px)" }}>
             {/* QuoteCard */}
           </div>
           {/* Similar for right side with left: calc(50% + 400px) */}
         </>
       );
     }
     

   • ~/www/usingandunderstanding.ai/apps/web/app/page.tsx

     • Added FloatingQuotes import and component

     import { FloatingQuotes } from "@/components/floating-quotes";
     // In JSX, after background pattern div:
     <FloatingQuotes />
     

   • ~/www/usingandunderstanding.ai/.claude/skills/yt-lookup.md

     • Skill for verifying YouTube videos using yt-dlp

     # YouTube Video Lookup
     Use `yt-dlp` to look up YouTube video metadata for verification purposes.
     
     ## Usage
     yt-dlp --dump-json --no-download "VIDEO_URL" 2>/dev/null | jq '{title, uploader, upload_date, description}'
     
     # Search YouTube
     yt-dlp --dump-json --no-download "ytsearch1:SEARCH_QUERY" 2>/dev/null | jq '{title, uploader, webpage_url}'
     

4. Errors and fixes:

   • TypeScript error with array access returning undefined: Fixed by adding null checks and using ?? 0 fallback
   • Quotes stopping after a few cycles: Original interval logic was buggy; rewrote with simpler setTimeout chain
   • Links not clickable (first attempt): Removed pointer-events-none from containers - didn't work
   • Links still not clickable: Content div had z-10, quotes were behind it. Fixed by adding z-20 to quote containers
   • Duplicate authors: Used grep/sort/uniq to identify duplicates, removed extras to maintain one-per-author rule
   • Unverified YouTube URLs: Created yt-dlp skill and verified videos, corrected several URLs (e.g., Hinton was 60 Minutes not CBS)

5. Problem Solving:

   • Verified YouTube URLs using yt-dlp searches
   • Found correct video IDs for: Sundar Pichai (jxEo3Epc43Y), Jensen Huang (DiGB5uAYKAg), Geoffrey Hinton 60 Minutes (qrvK_KuIeJk), Sam Altman Lex Fridman (L_Guz73e6fw), Andrew Ng (21EiKfQYZXc)
   • Ongoing: Need to fix remaining duplicate authors (Alan Turing has 2 quotes now) and fix the Nicholas Carr quote which is an essay title, not a proper quote

6. All user messages:

   • "Implement the following plan: [detailed plan for homepage quotes feature]"
   • "I see a few quotes but then they stop. Let's make sure to only display one at a time. And let's move them closer to the chat window: either right justified on the left and left on the right or centered in the gutters. But probably just a certain distance from the chat window."
   • "It would be nice to have a bit of randomness here: a bias towards switching sides but not every time. A bit of randomness as far as height, amount of time on screen, and so on."
   • "Nice! Let's have them display a bit longer overall. And can we add links to the quotes? At least to the authors who have Wikipedia pages?"
   • "I meant for the quote authors. It would also be great to link each quote to the article or video where it came from, assuming that's also possible. So each quote could have two links: one from the body to the source (optional, but encouraged) and a second from the author to their Wikipedia profile (if they have one)."
   • "Let's not have quotes appear with their top below midway down the page. Also the links do not work: they aren't clickable."
   • "Nope. Links are still not clickable. The pointer doesn't change either. Perhaps a problem with the container?"
   • "Nice! Next, can we have the quote source on its own line?"
   • "OK. Please remove any noted trolls, like Elon Musk. Also please remove any source name links that you're not 100% sure about."
   • "Wait. The Andrew Ng one was OK. Can we add a skill so that you can use yt-dlp to look up stuff like this? Even just the video description should be able to help."
   • "And maybe use the same approach to double-check the other YouTube links? It would be nice to include those if they are correct."
   • "Can we find quotes with similar sentiments just not from Elon? And also let's have a one quote max per author rule."
   • "Can we get to 64 quotes? That would be great! A good computer science number."
   • "OK."
   • "Yes, more is fine! I like the one about natural stupidity :-). Do we have quotes also discussing things like the implications for human intelligence? And quotes from philosophers of technology like McLuhan, Postman, Carr, and Ellul?"
   • "Regarding human intelligence I was thinking along the lines of questions about what is intelligence, what is creativity, perhaps neuroscientists who are using AI to study the brain. Of course something from Lee Sedol regarding Move 37 is always welcome."
   • "I think that quote from Nicholas Carr is actually the title of an essay, since the second half doesn't make sense as a sentence."

7. Pending Tasks:

   • Fix remaining duplicate authors (Alan Turing now has 2 quotes)
   • Fix the Nicholas Carr quote - currently using the essay title which isn't a proper quote
   • Verify final quote count and ensure one-per-author rule is enforced

8. Current Work: Was in the process of adding quotes from philosophers of technology and about human intelligence/creativity. Added quotes from:

   • Marshall McLuhan (removed duplicate, kept "We become what we behold")
   • Neil Postman (removed duplicate, kept Huxley/Orwell quote)
   • Nicholas Carr (needs fixing - essay title not a quote)
   • Jacques Ellul
   • Lee Sedol (Move 37 quote)
   • Melanie Mitchell
   • Santiago Ramón y Cajal
   • Steve Jobs
   • Emily Dickinson
   • Michio Kaku
   • Added second Alan Turing quote (needs removal - violates one-per-author)

   User's last message: "I think that quote from Nicholas Carr is actually the title of an essay, since the second half doesn't make sense as a sentence."

9. Optional Next Step: Fix the Nicholas Carr quote to be an actual quote from his work rather than the essay title, and remove the duplicate Alan Turing quote to maintain the one-per-author rule.

   User's exact words: "I think that quote from Nicholas Carr is actually the title of an essay, since the second half doesn't make sense as a sentence."

If you need specific details from before compaction (like exact code snippets, error messages, or content you generated), read the full transcript at: ~/.claude/projects/-Users-challen-www-usingandunderstanding-ai/5a869c19-d0af-4f69-9e2e-89bd43143a83.jsonl Please continue the conversation from where we left it off without asking the user any further questions. Continue with the last task that you were asked to work on.

Actually, sorry. That Turing quote is great. Let's have the one quote per author be a guideline, not a hard and fast rule. Any other great ones you want to bring back?

And there are probably other quotes from early internet pioneers: Licklider, for example, and others around that time. And perhaps even earlier philosophers like Mettrier regarding materialism?

And yes, add the two above.

Your task

First, run git status, git diff, and git log --oneline -10 to understand the current state.

Then add and commit all modified files with a descriptive message. Break the changes into multiple commits if appropriate. If there are untracked files, ask if they should be added or added to the appropriate .gitignore file. The user may also want to take over at this point, so provide an abort option as well. Always check changes for unnecessary debugging statements or logging that might have been accidentally included. Prompt the user if you find any, and offer to remove each one by one. Do not use interactive git staging (git add -p) as it does not work.

Let's deploy the dev site!

It looks like the API container takes a while to terminate. Can you investigate?

Let's remove the footer from the index page since those links are already at the top. That way the chat container can also expand when used to fill that space. Oh, and let's make the window buttons actually work: red should reset the chat; green should expand the size of the chat window to fill all horizontal space (and make sure quotes appear behind it at that point). What should yellow do?

Sure! And maybe when it's collapsed the quotes can fill the space behind it?

OK. So let's improve the buttons with the Mac-like hover showing the icon underneath. When I hit the red button it resets but I can no longer type and just see a blinking cursor. The yellow button causes the title to shift downward and quotes to appear overlaid on top. I'd rather have it just roll up vertically and the quotes start to be able to appear below it, though not immediately.

OK. But the yellow button still causes layout shift, maybe due to vertical centering? What I want to happen is for the title to stay fixed. So perhaps a better layout is to have the title at a vertical offset from the top and then the chat window below, using a good amount of the rest of the vertical space? You can still use a large top margin for the title to give it breathing room.

One development question. It looks like the NextJS frontend does not update properly when you make component changes. I have to manually refresh.

OK. Let's fix the vertical quote positioning. They should be just below the top of the chat window. And let's have the default chat window be taller and take up more vertical space. Apply a small amount of vertical randomness to the quotes but not too much.

Your task

First, run git status, git diff, and git log --oneline -10 to understand the current state.

Then add and commit all modified files with a descriptive message. Break the changes into multiple commits if appropriate. If there are untracked files, ask if they should be added or added to the appropriate .gitignore file. The user may also want to take over at this point, so provide an abort option as well. Always check changes for unnecessary debugging statements or logging that might have been accidentally included. Prompt the user if you find any, and offer to remove each one by one. Do not use interactive git staging (git add -p) as it does not work.

OK. We have some new students who signed up. First, let's update the existing student ID spreadsheet. Add a Complete column and mark all existing entries as completed.

Sorry, mark as complete with just an x.

Sorry. Put the complete column earlier, after the UIN.

1

Please create a private repository on the gchallen GitHub for this project and then push it.

Call it usingandunderstanding.ai.

No no no. Just push the main branch!

OK! Now we need to add an /apply page similar to the current janky web form I'm using. You can find the form output in FORM.pdf. I want a new page at /apply that mimics the existing form format. Students should need to log in to use it. They should be able to edit responses after completion. Allow Markdown formatting and implement form validation as appropriate. Save content into the database. Also write a script to pull content from FORM.pdf and inject it into a database for migration purposes.

Applications should also be for the current semester.

Let's have appropriate form validation. For example, the rest of the form is disabled or hidden until pure elective validation is checked.

Feel free to also use progressive disclosure elsewhere as appropriate.