Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified public/recruitment/fa26/recruitment-timeline.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions scripts/validate-seo-build.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -154,6 +154,12 @@ for (const page of pages) {
assert.match(mainHtml, /There is no live Model Context Protocol endpoint or manifest/i);
assert.match(mainHtml, /Same-URL Accept: text\/markdown content negotiation is not provided/i);
}
if (page.path === "/signup/") {
assert.match(mainHtml, /Updated Fall 2026 recruitment timeline/);
assert.match(mainHtml, /September 9/);
assert.match(mainHtml, /VLSB 2030/);
assert.doesNotMatch(mainHtml, /September 7/);
}
}

const robots = await fs.readFile(path.join(distDirectory, "robots.txt"), "utf8");
Expand Down
6 changes: 3 additions & 3 deletions src/components/RecruitmentBanner.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { useEffect, useLayoutEffect, useState } from "react";
import { ArrowRight, Dna, X } from "lucide-react";
import { Link } from "react-router-dom";

const dismissalKey = "compbio-fall-2026-recruitment-dismissed";
const dismissalKey = "compbio-fall-2026-recruitment-update-2026-09-03-dismissed";
const coffeeChatLink =
"https://docs.google.com/document/d/1ZGq3KV4MprEdPDUu8v7QO9AuGSpB2eEmsyVCCK9nLDU/edit?usp=sharing";
const useBrowserLayoutEffect =
Expand Down Expand Up @@ -51,9 +51,9 @@ const RecruitmentBanner = () => {
<Dna className="h-4 w-4 shrink-0 text-label" aria-hidden="true" />
<p className="min-w-0 text-[13px] leading-5 text-foreground">
<strong className="font-bold text-heading">
We are currently recruiting for Fall 2026.
Fall 2026 recruitment timeline updated.
</strong>{" "}
Sign up and schedule a coffee chat.
Apply by September 11 at 5 PM.
</p>
</div>

Expand Down
52 changes: 39 additions & 13 deletions src/pages/SignUp.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { publicAssetPath } from "@/lib/publicAsset";

const INTEREST_FORM = "https://forms.gle/EQmWP1JWzDzrFji79";
const NEWSLETTER_FORM = "https://forms.gle/qCxn93mfunF3Dtep7";
const RECRUITMENT_POST = "https://www.instagram.com/p/DcUXakNy7cj/";
const INSTAGRAM_PROFILE = "https://www.instagram.com/ucb_compbio/";
const COFFEE_CHAT_LINK =
"https://docs.google.com/document/d/1ZGq3KV4MprEdPDUu8v7QO9AuGSpB2eEmsyVCCK9nLDU/edit?usp=sharing";

Expand All @@ -32,6 +32,17 @@ const forms = [
},
];

const recruitmentEvents = [
{ date: "August 26", title: "Applications and coffee chats open" },
{ date: "August 27", title: "Calapalooza and tabling" },
{ date: "September 2", title: "Info session #1", details: "8–10 PM · Hildebrand B56" },
{ date: "September 3", title: "Meet the PMs and officers", details: "6–8 PM · the Glade" },
{ date: "September 8", title: "Applicant social", details: "6–8 PM · location TBD" },
{ date: "September 9", title: "Info session #2", details: "8–10 PM · VLSB 2030" },
{ date: "September 11", title: "Application due", details: "5 PM" },
{ date: "September 12–13", title: "Interviews" },
];

const socials = [
{
name: "Instagram",
Expand Down Expand Up @@ -66,36 +77,51 @@ const SignUp = () => (
<article className="overflow-hidden rounded border border-border bg-card lg:col-span-2">
<div className="grid lg:grid-cols-[minmax(280px,0.72fr)_1.28fr]">
<a
href={RECRUITMENT_POST}
href={INSTAGRAM_PROFILE}
target="_blank"
rel="noopener noreferrer"
aria-label="View the Fall 2026 recruitment timeline on Instagram (opens in a new tab)"
className="group relative block overflow-hidden bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
aria-label="View current Fall 2026 recruitment updates on Instagram (opens in a new tab)"
className="group relative block aspect-[4/5] self-start overflow-hidden bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
>
<img
src={publicAssetPath("/recruitment/fa26/recruitment-timeline.webp")}
alt="Fall 2026 recruitment timeline: applications open August 26, Calapalooza August 27, info sessions September 2 and 7, officers event September 3, applicant social September 8, applications due September 11 at 5 PM, and interviews September 12–13."
alt="Updated Fall 2026 recruitment timeline graphic"
width="1080"
height="1350"
loading="eager"
decoding="async"
className="h-full max-h-[42rem] w-full object-cover object-top transition-transform duration-300 group-hover:scale-[1.015]"
className="h-full w-full object-contain object-top transition-opacity duration-300 group-hover:opacity-95"
/>
<span className="absolute inset-x-4 bottom-4 flex items-center justify-between gap-3 rounded bg-background/95 px-4 py-3 text-sm font-bold text-heading shadow-sm backdrop-blur-sm">
View the original post
View current updates
<ExternalLink className="h-4 w-4 shrink-0 text-link" aria-hidden="true" />
</span>
</a>

<div className="flex flex-col justify-center p-6 md:p-8 lg:p-10">
<p className="eyebrow">Fall 2026 recruitment</p>
<h2 className="mt-3 text-3xl font-bold text-heading">Fall 2026 recruitment is open</h2>
<h2 className="mt-3 text-3xl font-bold text-heading">Updated Fall 2026 recruitment timeline</h2>
<p className="mt-4 max-w-[52ch] text-sm leading-relaxed text-muted-foreground">
Applications and coffee chats are open now. Meet us at Calapalooza, join an info
session, and get to know our project managers and officers before applications
close September 11 at 5 PM.
Applications and coffee chats are open. Join us at an upcoming event before
applications close September 11 at 5 PM.
</p>

<dl className="mt-6 grid gap-x-6 gap-y-4 sm:grid-cols-2">
{recruitmentEvents.map((event) => (
<div key={`${event.date}-${event.title}`}>
<dt className="text-[11px] font-bold uppercase tracking-[0.14em] text-label">
{event.date}
</dt>
<dd className="mt-1 text-sm font-bold text-heading">{event.title}</dd>
{event.details ? (
<dd className="mt-0.5 text-xs leading-relaxed text-muted-foreground">
{event.details}
</dd>
) : null}
</div>
))}
</dl>

<div className="mt-7 flex flex-wrap gap-3">
<EnhancedButton asChild variant="gold" size="lg">
<a href={INTEREST_FORM} target="_blank" rel="noopener noreferrer">
Expand All @@ -112,8 +138,8 @@ const SignUp = () => (
</a>
</EnhancedButton>
<EnhancedButton asChild variant="outline" size="lg">
<a href={RECRUITMENT_POST} target="_blank" rel="noopener noreferrer">
View timeline on Instagram
<a href={INSTAGRAM_PROFILE} target="_blank" rel="noopener noreferrer">
View updates on Instagram
<ExternalLink />
<span className="sr-only"> (opens in a new tab)</span>
</a>
Expand Down