Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 14 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>NJ Weekend Trip Planner Dashboard</title>
<meta http-equiv="refresh" content="0; url=mockup/index.html" />
</head>
<body>
<p>
Redirecting to
<a href="mockup/index.html">NJ Weekend Trip Planner Dashboard</a>...
</p>
</body>
</html>
155 changes: 115 additions & 40 deletions mockup/css/styles.css
Original file line number Diff line number Diff line change
@@ -1,69 +1,108 @@
html {
font-size: 24px;
font-family: sans-serif;
}

html,
body {
padding: 0;
height: 100%;
margin: 0;
padding: 0;
font-size: 16px;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
sans-serif;
}


main {
display: flex;
flex-direction: row;
height: 100vh;
}

.map-section {
position: relative;
width: 100%;
height: 50vh;
background-color: silver;
flex: 2 1 50%;
display: flex;
flex-direction: column;
background-color: #f3f4f6;
}

.station-list-section {
flex: 1 1 40%;
display: flex;
flex-direction: column;
overflow-y: auto;
background-color: #ffffff;
}


.map-search-controls {
display: flex;
box-sizing: border-box;
margin: 0;
border: none;
padding: 0.5rem;
padding: 0.4rem 0.6rem;
width: 100%;
gap: 0.5rem;
gap: 0.4rem;
justify-content: space-between;
position: relative;
background-color: #e5e7eb;
z-index: 1;
}

.map-search-controls input {
box-sizing: border-box;
border: 1px solid gray;
border: 1px solid #9ca3af;
border-radius: 4px;
font-size: 0.9rem;
font-size: 0.85rem;
font-family: monospace;
padding: 0.2rem 0.3rem;
}

[name="address-search"] {
background-image: url("../img/location.svg");
background-size: 1em;
background-repeat: no-repeat;
background-position: 98% center;
padding-right: 1.2em;
width: 60%
padding-right: 1.4em;
width: 60%;
}

[name="time-search"] {
width: 40%;
}

.map {
position: absolute;
top: 0;
flex: 1;
}

#map {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}

.bike-search-controls {
border: 0;
padding: 0.5rem;
padding: 0.5rem 0.75rem;
display: flex;
justify-content: space-between
justify-content: space-between;
align-items: center;
font-size: 0.85rem;
background-color: #f9fafb;
position: sticky;
top: 0;
z-index: 1;
border-bottom: 1px solid #e5e7eb;
}

.electric-bikes-only-label {
display: flex;
gap: 0.3rem;
align-items: center;
}

.min-battery-level-label {
display: flex;
gap: 0.4rem;
align-items: center;
}

.min-battery-level-label input[type="range"] {
width: 7rem;
}

.station-list {
Expand All @@ -74,33 +113,34 @@ body {

.station-list .station {
display: grid;
grid-template-areas: "name name"
"blank distance"
"bikes-info docks-info"
"drop-off-info pick-up-info"
"details details";
grid-template-areas:
"name name"
"blank distance"
"bikes-info docks-info"
"drop-off-info pick-up-info"
"details details";
grid-template-columns: 1fr 1fr;

padding: 0.5rem;
border-bottom: 1px solid black;
padding: 0.5rem 0.75rem;
border-bottom: 1px solid #e5e7eb;
font-size: 0.9rem;
}

.station-list .station:first-child {
border-top: 1px solid black;
border-top: 1px solid #e5e7eb;
}

.station .name {
grid-area: name;
font-weight: bold;
font-weight: 600;
}

.station .distance {
grid-area: distance;
justify-self: end;

font-size: 0.8em;
font-style: italic;
padding-bottom: 0.5rem
padding-bottom: 0.2rem;
}

.station .available-bikes {
Expand All @@ -124,14 +164,49 @@ body {
.station .details {
grid-area: details;
justify-self: center;
width: 100%;
}

.station .details .chart {
box-sizing: border-box;
margin-top: 0.5rem;
padding: 0.5rem;
margin-top: 0.4rem;
padding: 0.4rem;
width: 100%;
height: 4rem;
background-color: silver;
height: 3.5rem;
background-color: #e5e7eb;
font-size: 0.8rem;
}

/* POI category checkbox layout */
.poi-category-panel {
margin-top: 0.5rem;
}

.poi-category-panel .control-label {
font-weight: 600;
margin-bottom: 0.25rem;
display: block;
}

}
.poi-cat-item {
display: block;
margin: 0.15rem 0;
font-size: 0.9rem;
}

.poi-cat-item input[type="checkbox"] {
margin-right: 0.4rem;
}

.poi-category-panel {
margin-top: 0.75rem;
padding-top: 0.5rem;
border-top: 1px solid #ddd;
}

.poi-cat-item {
display: flex;
align-items: center;
gap: 0.4rem;
margin: 0.2rem 0;
}
1 change: 1 addition & 0 deletions mockup/data/NJ_Fishnet_CenterPoints.geojson

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions mockup/data/NJ_Fishnet_CenterPoints_WGS84.cpg
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
UTF-8
Binary file added mockup/data/NJ_Fishnet_CenterPoints_WGS84.dbf
Binary file not shown.
1 change: 1 addition & 0 deletions mockup/data/NJ_Fishnet_CenterPoints_WGS84.geojson

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions mockup/data/NJ_Fishnet_CenterPoints_WGS84.prj
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
PROJCS["WGS_1984_Web_Mercator_Auxiliary_Sphere",GEOGCS["GCS_WGS_1984",DATUM["D_WGS_1984",SPHEROID["WGS_1984",6378137.0,298.257223563]],PRIMEM["Greenwich",0.0],UNIT["Degree",0.0174532925199433]],PROJECTION["Mercator_Auxiliary_Sphere"],PARAMETER["False_Easting",0.0],PARAMETER["False_Northing",0.0],PARAMETER["Central_Meridian",0.0],PARAMETER["Standard_Parallel_1",0.0],PARAMETER["Auxiliary_Sphere_Type",0.0],UNIT["Meter",1.0]]
Binary file added mockup/data/NJ_Fishnet_CenterPoints_WGS84.sbn
Binary file not shown.
Binary file added mockup/data/NJ_Fishnet_CenterPoints_WGS84.sbx
Binary file not shown.
Binary file added mockup/data/NJ_Fishnet_CenterPoints_WGS84.shp
Binary file not shown.
Loading