ge-aerospace/shopdb-flask
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Revert "Show recertification four at a time, two by two"

Browse Source 
This reverts commit af60a77399.
This commit is contained in:
cproudlock
2026-08-07 09:44:26 -04:00
parent af60a77399
commit a52e192501
1 changed files with 12 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
frontend/src/views/ShopfloorDashboard.vue
View File

@@ -252,10 +252,9 @@ const recertDescriptions = computed(() => {
return out return out
}) })
// Recertification shows a rotating 2x2 block: one page of tiles at a time so it // Recertification shows as a single rotating row: one page of tiles at a time
// stays compact on any screen, cycling through everyone due. Eight across left // so it stays compact on any screen, cycling through everyone due.
// each tile too narrow to read at floor distance. const RECERT_PAGE_SIZE = 8
const RECERT_PAGE_SIZE = 4
const currentRecertPage = ref(0) const currentRecertPage = ref(0)
const recertPageCount = computed(() => const recertPageCount = computed(() =>
Math.max(1, Math.ceil(recertifications.value.length / RECERT_PAGE_SIZE)) Math.max(1, Math.ceil(recertifications.value.length / RECERT_PAGE_SIZE))
@@ -578,29 +577,26 @@ function handlePhotoError(e) {
margin: -4px 0 14px; margin: -4px 0 14px;
line-height: 1.35; line-height: 1.35;
} }
/* 2x2 block that cycles through pages of employees */ /* Single row that cycles through pages of employees */
.recert-row { .recert-row {
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(8, 1fr);
gap: 14px; gap: 14px;
} }
.recert-tile { .recert-tile {
background: linear-gradient(135deg, #1e3a5f 0%, #0d2137 100%); background: linear-gradient(135deg, #1e3a5f 0%, #0d2137 100%);
border: 2px solid #0d6efd; border: 2px solid #0d6efd;
border-radius: 10px; border-radius: 10px;
padding: 14px 18px; padding: 14px 10px;
/* Photo beside the name rather than above it: two rows of stacked tiles
would double the section's height, and the whole board is scaled to fit
one screen, so height here shrinks everything else. */
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
gap: 18px; gap: 10px;
text-align: left; text-align: center;
} }
.recert-photo { .recert-photo {
width: 120px; width: 90px;
height: 120px; height: 90px;
flex: none;
border-radius: 50%; border-radius: 50%;
object-fit: cover; object-fit: cover;
border: 3px solid #0d6efd; border: 3px solid #0d6efd;
@@ -612,9 +608,7 @@ function handlePhotoError(e) {
background: #fff; background: #fff;
} }
.recert-name { .recert-name {
flex: 1; font-size: 20px;
min-width: 0;
font-size: 26px;
font-weight: 700; font-weight: 700;
line-height: 1.15; line-height: 1.15;
/* Always reserve two lines so a name that wraps does not make its tile /* Always reserve two lines so a name that wraps does not make its tile