diff --git a/src/routePlanner/index.tsx b/src/routePlanner/index.tsx index 7d7e3af..0d188a1 100644 --- a/src/routePlanner/index.tsx +++ b/src/routePlanner/index.tsx @@ -15,6 +15,9 @@ export const RoutePlanner = () => { return (
+
+

Route builder

+
-

Markers

-
    - {markers.map((marker, i) => ( - - ))} -
- +
    + {markers.map((marker, i) => ( + + ))} +
); }; diff --git a/src/routePlanner/style.css b/src/routePlanner/style.css index 43354f2..59d2a8d 100644 --- a/src/routePlanner/style.css +++ b/src/routePlanner/style.css @@ -4,12 +4,17 @@ section.route-planner { column-gap: 1rem; row-gap: 1rem; grid-template-columns: 1fr 2fr; - grid-template-rows: 1fr min-content; + grid-template-rows: min-content 1fr min-content; grid-template-areas: + "header map" "markers map" "export map"; } +section.route-planner > section.header { + grid-area: header; +} + section.route-planner > section.markers { grid-area: markers; } @@ -83,6 +88,7 @@ section.route-planner .map-container .leaflet-tooltip-pane .text { grid-template-columns: 1fr; grid-template-rows: 1fr min-content 2fr; grid-template-areas: + "header" "markers" "export" "map";