clerie/traveldrafter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Properly size css grid

Browse Source
This commit is contained in:
clerie
2025-07-06 20:49:11 +02:00
parent 0bef06139c
commit 5b7ba0ad69
2 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
web/drafting-board.js
View File

@@ -65,6 +65,9 @@ export function drawDraftingBoard() {
let rows = display_legs.length;
element_board.style.setProperty("--drafting-board-number-locations", display_locations.length);
element_board.style.setProperty("--drafting-board-number-legs", rows);
for (let display_location of display_locations) {
let el_location_name = EL("div", {
class: [ "station-name" ],
@@ -85,7 +88,7 @@ export function drawDraftingBoard() {
"grid-column-start": grid_location_indexes[display_location.id]["column-start"],
"grid-column-end": grid_location_indexes[display_location.id]["column-end"],
"grid-row-start": 2,
"grid-row-end": rows + 2,
"grid-row-end": rows + 3,
},
});

12
web/style.css
View File

@@ -119,14 +119,14 @@ input.form-control {
#drafting-board-content {
display: grid;
min-width: 1000px;
min-height: 300px;
min-width: 100%;
min-height: 100%;
grid-template-columns: repeat(auto-fit, minmax(200px, auto) 2px minmax(200px, auto));
}
--drafting-board-number-locations: 0;
--drafting-board-number-legs: 0;
#drafting-board div {
min-height: 0px;
grid-template-columns: repeat(var(--drafting-board-number-locations), minmax(200px, auto) 2px minmax(200px, auto));
grid-template-rows: min-content repeat(var(--drafting-board-number-legs), minmax(0px, min-content)) auto;
}
#drafting-board .station-name {