julien/andon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(dashboard): reposition dot map labels

Browse Source 
Anchor each defect's date label at the dot's bottom-right (splaying
diagonally down-right) and move the "+N more" marker to the section's
bottom-left so it no longer collides with the A2/A3/A4 size label.
This commit is contained in:
Julien Calixte
2026-05-28 00:43:05 +02:00
parent bfb0485598
commit 743ddfa899
1 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/components/DotMap.vue
View File

@@ -86,19 +86,20 @@ function dotStyle(index: number) {
.dot__date { .dot__date {
position: absolute; position: absolute;
left: 0.7rem; /* Anchored at the dot's bottom-right corner, splaying diagonally down-right. */
bottom: 0.7rem; top: 0.5rem;
left: 0.5rem;
font-size: 0.6rem; font-size: 0.6rem;
line-height: 1; line-height: 1;
white-space: nowrap; white-space: nowrap;
/* Diagonal label, as on the physical board. */ transform: rotate(45deg);
transform: rotate(-45deg); transform-origin: top left;
transform-origin: bottom left;
} }
.dot-more { .dot-more {
position: absolute; position: absolute;
right: 0.4rem; /* Bottom-left, clear of the A2/A3/A4 size label at the bottom-right. */
left: 0.4rem;
bottom: 0.4rem; bottom: 0.4rem;
font-size: 0.7rem; font-size: 0.7rem;
font-weight: 600; font-weight: 600;