+
+
-
${metaRow(f)}
-
${statusBadge(f.status)} · ${escapeHtml(data.filename)}
${escapeHtml(f.company || stem(data.filename))}
${f.role ? `${escapeHtml(f.role)}
` : ""}
-
-
+
+
+
+
- ${applyBtn}${checkBtn}
-
+ ${applyBtn}${checkBtn}
+
${DOMPurify.sanitize(marked.parse(f.notes || "_No notes yet._", { gfm: true, breaks: false }))}
${materialSection(data)}
-
+
@@ -375,7 +420,7 @@ function materialSection(data) {
@@ -427,7 +472,11 @@ function downloadMaterial(data) {
}
async function discardMaterial(name) {
- if (!confirm("Discard this cover letter? You can regenerate it later.")) return;
+ if (!await confirmAction({
+ title: "Discard cover letter?",
+ message: "You can generate another cover letter later.",
+ confirmLabel: "Discard",
+ })) return;
try {
await api("DELETE", `/api/apps/${encodeURIComponent(name)}/cover-letter`);
openApp(name);
@@ -490,7 +539,11 @@ async function markStatus(data, action) {
// are passed. Then jump to the next actionable role, like Pass.
async function blacklistCompany(data) {
const company = data.fields.company || stem(data.filename);
- if (!confirm(`Blacklist "${company}"? Future polls will skip it and its open leads will be passed.`))
+ if (!await confirmAction({
+ title: `Blacklist ${company}?`,
+ message: "Future polls will skip this company and its open leads will be passed.",
+ confirmLabel: "Blacklist company",
+ }))
return;
try {
const r = await api("POST", `/api/apps/${encodeURIComponent(data.filename)}/blacklist`);
@@ -516,29 +569,34 @@ function formMarkup(f, { isNew }) {
const eyebrow = isNew ? "New application" : `Editing · ${escapeHtml(state.current)}`;
return `
-
Cover letter
- Draft a tailored letter from your résumé via the configured AI.
+Draft a tailored letter from your résumé via the configured AI.
${eyebrow}
-
+ ${eyebrow}
+ +
+
+
+ Required
+
-
+
-
+
-
+
-
+
`;
@@ -624,16 +682,19 @@ function openEdit(data) {
state.mode = "edit";
contentEl.innerHTML = formMarkup(data.fields, { isNew: false });
wireForm({ isNew: false });
+ document.title = `Edit ${data.fields.company || stem(data.filename)} | ApplyTrack`;
+ focusView("h2");
}
function openNew() {
state.mode = "new";
state.current = null;
- document.body.classList.add("m-detail"); // mobile: show the form pane
+ showDetailPane();
renderSidebar();
const today = new Date().toISOString().slice(0, 10);
contentEl.innerHTML = formMarkup({ created: today, lane: "ai", status: "lead" }, { isNew: true });
wireForm({ isNew: true });
+ document.title = "New application | ApplyTrack";
$("#f-company").focus();
}
@@ -642,7 +703,18 @@ function wireForm({ isNew }) {
state.current ? openApp(state.current) : renderEmpty();
contentEl.querySelector('[data-act="save"]').onclick = async () => {
const fields = gatherFields();
- if (!fields.company) return toast("An application needs a company.");
+ const company = $("#f-company");
+ const summary = $("#form-errors");
+ company.removeAttribute("aria-invalid");
+ summary.hidden = true;
+ if (!fields.company) {
+ company.setAttribute("aria-invalid", "true");
+ summary.textContent = "Enter a company before saving this application.";
+ summary.hidden = false;
+ summary.focus();
+ announce(summary.textContent, true);
+ return;
+ }
try {
if (isNew) {
const { filename } = await api("POST", "/api/apps", fields);
@@ -701,19 +773,22 @@ function openRaw(data) {
state.mode = "raw";
contentEl.innerHTML = `
-
-
+
@@ -546,56 +604,56 @@ function formMarkup(f, { isNew }) {
-
+
-
+
-
+
-
+
-
-
+
+
-
+
-
+
-
-
+
+
-
+
${isNew ? "" : ``}
-
-
+
+
-
- Source · ${escapeHtml(data.filename)}
-
-
-
+
`;
+ document.title = `Raw source | ApplyTrack`;
+ focusView("h2");
contentEl.querySelector('[data-act="form"]').onclick = () => openEdit(data);
contentEl.querySelector('[data-act="cancel"]').onclick = () => openApp(data.filename);
contentEl.querySelector('[data-act="save"]').onclick = async () => {
@@ -733,7 +808,11 @@ function openRaw(data) {
// ---- Delete ---------------------------------------------------------------
async function deleteApp(name) {
- if (!confirm(`Delete "${stem(name)}"? This removes the file.`)) return;
+ if (!await confirmAction({
+ title: `Delete ${stem(name)}?`,
+ message: "This permanently deletes the application and its saved cover letter.",
+ confirmLabel: "Delete application",
+ })) return;
try {
await api("DELETE", `/api/apps/${encodeURIComponent(name)}`);
await refresh();
@@ -774,13 +853,14 @@ function sourceToggles(sources) {
function boardRows() {
if (!criteriaBoards.length) {
- return `
+
-
+
Raw source for ${escapeHtml(data.filename)}
+
+
+
No ATS boards added.
`;
+ return `No ATS boards added.
`;
}
return criteriaBoards.map((b, i) =>
`
${escapeHtml(b.provider)}
${escapeHtml(b.slug)}
-
+
`).join("");
}
@@ -805,30 +885,30 @@ function criteriaMarkup(c) {
What the poller looks for
+
Saved to applications/.criteria.json · used by every poll.
-
+
-
+
-
+
-
+
Location filters
-
+
Sources
${sourceToggles(c.sources || {})}
-
+
@@ -927,15 +1007,15 @@ let resumeLinks = [];
function expRows() {
if (!resumeExperience.length)
- return `ATS boards — follow a company's Greenhouse or Lever board
-
No experience added.
`;
+ return `No experience added.
`;
return resumeExperience.map((e, i) => `
-
-
-
+
+
+
-
@@ -971,12 +1051,12 @@ function renderExperience() {
function linkRows() {
if (!resumeLinks.length)
- return `
No links added.
`;
+ return `No links added.
`;
return resumeLinks.map((l, i) => `
-
-
-
+
+
+
`).join("");
}
@@ -1006,52 +1086,52 @@ function resumeMarkup(r) {
Résumé
The facts behind your cover letters
-+
The drafting AI may assert only what's here — no invented employers, titles, or metrics.
-
+
-
+
-
+
-
+
-
+
Experience
-
+
-
+
-
+
@@ -1132,7 +1212,7 @@ function llmMarkup(s) {
Links
AI · cover-letter endpoint
Where cover letters are drafted
-+
Any OpenAI-compatible endpoint — a local model (Ollama / vLLM) or a hosted provider. Leave a field blank to inherit the instance default.
@@ -1142,36 +1222,36 @@ function llmMarkup(s) { Enable cover-letter drafting -+
Untick if you don't want to run a model — the app hides every drafting affordance and never calls an LLM for this account.
-
+
-
+
-
+
-
- ${escapeHtml(keyNote)}
+${escapeHtml(keyNote)}
+
Instance default — ${inst.base_url ? escapeHtml(inst.base_url) : "no URL"} ·
${inst.model ? escapeHtml(inst.model) : "no model"} ·
${inst.has_api_key ? "key set" : "no key"}
@@ -1325,7 +1405,11 @@ $("#import-file").addEventListener("change", async (e) => {
const prompt = shared
? "Import this shared list as new leads? Opportunities you already track are left untouched."
: "Import overwrites applications that share a name with ones in this file. Continue?";
- if (!confirm(prompt)) return;
+ if (!await confirmAction({
+ title: shared ? "Import shared opportunities?" : "Import account data?",
+ message: prompt,
+ confirmLabel: "Import",
+ })) return;
try {
const r = await api("POST", "/api/account/import", doc);
await refresh();
@@ -1350,6 +1434,7 @@ $("#import-file").addEventListener("change", async (e) => {
// the tenant-scoped /api routes, so one user's settings never touch another's.
const SETTINGS_TABS = [
+ ["accessibility", "Accessibility"],
["criteria", "Criteria"],
["resume", "Résumé"],
["ai", "AI"],
@@ -1363,26 +1448,39 @@ const SETTINGS_TABS = [
// Each loader re-reads this after its fetch and bails if it's been superseded.
let settingsGen = 0;
-async function openSettings(tab) {
+async function openSettings(tab, focusSelectedTab = false) {
if (SETTINGS_TABS.some(([k]) => k === tab)) state.settingsTab = tab;
const gen = ++settingsGen;
state.mode = "settings";
state.current = null;
- document.body.classList.add("m-detail"); // mobile: show the settings pane
+ showDetailPane();
renderSidebar();
contentEl.innerHTML = `
-
+
@@ -1465,7 +1571,7 @@ async function loadAccountTab(body) {
Export — private migration snapshot
- +
Everything: applications, criteria, blacklist. Import it on another instance to move home.
@@ -1476,7 +1582,7 @@ async function loadAccountTab(body) {
Share — anonymized opportunity list
- +
Company, role, link, location, source only — no status, notes, contacts, dates, or score. A peer imports it and every entry lands as a fresh lead.
@@ -1494,7 +1600,7 @@ async function loadAccountTab(body) {Danger zone
- +
Deletes your account and every application, setting, and session with it. Immediate and unrecoverable.
@@ -1518,8 +1624,11 @@ async function loadAccountTab(body) {
location.reload();
};
act("delete-account").onclick = async () => {
- if (!confirm("Delete your account? Every application, setting, and cover letter goes with it.")) return;
- if (!confirm("Last chance — this is immediate and unrecoverable. Really delete?")) return;
+ if (!await confirmAction({
+ title: "Delete your account?",
+ message: "Every application, setting, cover letter, and session will be deleted immediately. This cannot be undone.",
+ confirmLabel: "Delete my account",
+ })) return;
try {
await api("DELETE", "/api/account");
location.reload();
@@ -1563,7 +1672,7 @@ async function navigateList(delta) {
if (idx === -1) idx = delta > 0 ? -1 : 0;
idx = Math.max(0, Math.min(apps.length - 1, idx + delta));
await openApp(apps[idx].filename);
- const active = listEl.querySelector(".index-card.active");
+ const active = listEl.querySelector('.application-card[aria-current="true"]');
if (active) active.scrollIntoView({ block: "nearest" });
}
document.addEventListener("keydown", (e) => {
@@ -1585,37 +1694,14 @@ document.addEventListener("keydown", (e) => {
else if (e.key === "k") { e.preventDefault(); navigateList(-1); }
});
-// ---- Theme switcher -------------------------------------------------------
-
-const THEMES = ["midnight", "carbon", "dusk", "paper", "mint", "cyberdeck"];
-const MOBILE = window.matchMedia("(max-width: 767px)");
-function applyTheme(name, persist = true) {
- const theme = THEMES.includes(name) ? name : "midnight";
- document.documentElement.dataset.theme = theme;
- // Don't persist the phone-forced cyberdeck: it would otherwise leak onto desktop
- // when a desktop window is resized across the breakpoint. The saved pref stays
- // the user's explicit choice only.
- if (persist) { try { localStorage.setItem("applytrack-theme", theme); } catch (_) {} }
- document.querySelectorAll(".swatch").forEach((s) => {
- s.classList.toggle("active", s.dataset.theme === theme);
- });
-}
-function savedTheme() {
- try { return localStorage.getItem("applytrack-theme") || "midnight"; } catch (_) { return "midnight"; }
-}
-function initTheme() {
- // Phones are locked to cyberdeck (the mobile app look); desktop uses the saved
- // choice. Re-evaluate when the viewport crosses the phone breakpoint (rotation
- // or a resized desktop window).
- applyTheme(MOBILE.matches ? "cyberdeck" : savedTheme(), !MOBILE.matches);
- document.querySelectorAll(".swatch").forEach((s) => {
- s.addEventListener("click", () => applyTheme(s.dataset.theme));
- });
- MOBILE.addEventListener("change", (e) => {
- applyTheme(e.matches ? "cyberdeck" : savedTheme(), !e.matches);
- });
-}
-initTheme();
+applyPreferences(readPreferences(), false);
+
+const mobileQuery = window.matchMedia("(max-width: 767px)");
+mobileQuery.addEventListener("change", (event) => {
+ const list = $("#application-list");
+ if (!event.matches || !document.body.classList.contains("m-detail")) list.removeAttribute("aria-hidden");
+ else list.setAttribute("aria-hidden", "true");
+});
(async function boot() {
try {
diff --git a/api/ApplyTrack.Api/wwwroot/index.html b/api/ApplyTrack.Api/wwwroot/index.html
index 121863c..870b88a 100644
--- a/api/ApplyTrack.Api/wwwroot/index.html
+++ b/api/ApplyTrack.Api/wwwroot/index.html
@@ -1,108 +1,105 @@
-
+
- applytrack
-
-
+
+ ApplyTrack
-
-
-
+
+ Skip to application details
-
-
-
-
-
-
-
-
- - applytrack -
-- pipeline -
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ Track
+
+
-
+
-
-