cesnimda/jobtrackingapp
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix(applications): preserve mobile title space and selected link contrast

Browse Source
This commit is contained in:
cesnimda
2026-11-10 23:22:40 +01:00
parent aac0f3b3a9
commit 64603f5602
2 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
job-tracker-ui/e2e/table-density.spec.ts
+5 -2
View File
@@ -12,6 +12,9 @@ async function login(api: APIRequestContext, email: string) {
}
const test = base.extend<{ owner: { headers: Record<string, string>; ids: number[] } }>({
owner: async ({ playwright, page, context }, provide) => {
await context.route("**/*", route => ["localhost", "127.0.0.1", "[::1]"].includes(new URL(route.request().url()).hostname)
? route.continue()
: route.abort());
const admin = await playwright.request.newContext();
try {
const adminHeaders = await login(admin, "e2e@example.test");
@@ -136,8 +139,8 @@ for (const mode of ["light", "dark"] as const) for (const language of ["en", "nb
if (width === 390 && value === "comfortable") {
await page.evaluate(() => window.scrollTo(0, 0));
await capture(page, info, `jobs-top-phone-${suffix}`);
await main.getByRole("button", { name: t.jobTableStatus, exact: true }).click();
await expect(page.getByRole("menuitem", { name: t.statusOffer, exact: true })).toBeVisible();
await first.getByRole("button", { name: new RegExp(`^${t.jobTableActions}:`) }).click();
await expect(page.getByRole("menuitem", { name: t.jobTableSetStatus.replace("{status}", t.statusOffer), exact: true })).toBeVisible();
await page.keyboard.press("Escape");
}
// Geometric containment alone misses a title squeezed into one-letter lines.
job-tracker-ui/src/components/JobTable.tsx
+4 -3
View File
@@ -13,6 +13,7 @@ import {
IconButton,
InputAdornment,
InputLabel,
Link,
Menu,
MenuItem,
Paper,
@@ -766,7 +767,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
>
<Stack spacing="var(--app-list-gap)">
<Box sx={{ display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 1, flexWrap: "wrap" }}>
<Box sx={{ display: "flex", alignItems: "flex-start", gap: 1, minWidth: 0, flex: "1 1 120px" }}>
<Box sx={{ display: "flex", alignItems: "flex-start", gap: 1, minWidth: 0, flex: "1 1 210px" }}>
{showSelection ? <Checkbox inputProps={{ "aria-label": t("jobTableSelectJob", { title: job.jobTitle }) }} checked={isSelected} onChange={(e) => toggleSelected(job.id, e.target.checked)} sx={{ mt: -0.5, ml: -1 }} /> : null}
<Box sx={{ minWidth: 0 }}>
<Typography sx={{ fontWeight: 700, fontSize: 16, lineHeight: 1.35, overflowWrap: "anywhere" }}>
@@ -825,7 +826,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
{columns.jobUrl && job.jobUrl ? (
<Box>
<Typography variant="overline" sx={{ color: "text.secondary" }}>{t("settingsColumnJobUrl")}</Typography>
<Typography variant="body2"><a href={job.jobUrl} target="_blank" rel="noreferrer">{t("jobTableOpenListing")}</a></Typography>
<Typography variant="body2"><Link href={job.jobUrl} target="_blank" rel="noreferrer" underline="always">{t("jobTableOpenListing")}</Link></Typography>
</Box>
) : null}
@@ -913,7 +914,7 @@ export default function JobTable({ refreshToken, pageSize, onPageSizeChange, col
{columns.dateApplied ? <TableCell>{appliedDateLabel}</TableCell> : null}
{columns.daysSince ? <TableCell>{job.daysSince ?? "—"}</TableCell> : null}
<TableCell>{job.deadline ? new Date(job.deadline).toLocaleDateString(language === "nb" ? "nb-NO" : "en") : "—"}</TableCell>
{columns.jobUrl ? <TableCell>{job.jobUrl ? <a href={job.jobUrl} target="_blank" rel="noreferrer">{t("jobTableLink")}</a> : ""}</TableCell> : null}
{columns.jobUrl ? <TableCell>{job.jobUrl ? <Link href={job.jobUrl} target="_blank" rel="noreferrer" underline="always">{t("jobTableLink")}</Link> : ""}</TableCell> : null}
<TableCell align="right">{rowActions(job)}</TableCell>
</TableRow>
);