2 Commits
0.0.5 ... 0.0.6

Author SHA1 Message Date
cfa1d44dbc Run prettier 2026-02-07 00:38:56 +00:00
ca5e78e2b1 Add OwlBoard styling 2026-02-07 00:31:37 +00:00
5 changed files with 1309 additions and 1300 deletions

View File

@@ -6,4 +6,4 @@ bun.lock
bun.lockb bun.lockb
# Miscellaneous # Miscellaneous
/static/ #/static/

View File

@@ -5,12 +5,6 @@
let searchTerm = ''; let searchTerm = '';
const formatDate = (dateVal: string | null) => {
if (!dateVal) return '---';
const d = new Date(dateVal);
return d.toLocaleDateString('en-GB', { day: '2-digit', month: 'short', year: '2-digit' });
};
$: filteredMaps = data.maps.filter( $: filteredMaps = data.maps.filter(
(m) => (m) =>
m.routeId.toString().includes(searchTerm) || m.routeId.toString().includes(searchTerm) ||
@@ -26,6 +20,21 @@
return checkedDate > oneYearAgo ? 'verified' : 'stale'; return checkedDate > oneYearAgo ? 'verified' : 'stale';
}; };
const formatDate = (dateVal: string | null) => {
if (!dateVal) return 'N/A';
const date = new Date(dateVal);
// Check for invalid dates to avoid "NaN/NaN/NaN"
if (isNaN(date.getTime())) return 'Invalid Date';
const d = date.getDate().toString().padStart(2, '0');
const m = (date.getMonth() + 1).toString().padStart(2, '0');
const y = date.getFullYear().toString().slice(-2);
return `${d}/${m}/${y}`;
};
</script> </script>
<div class="page-wrapper"> <div class="page-wrapper">
@@ -91,9 +100,9 @@
</div> </div>
<div class="card-footer"> <div class="card-footer">
<span>Created: {formatDate(map.created)}</span> <span>Created on {formatDate(map.created)}</span>
{#if map.checked} {#if map.checked}
<span>• Checked: {formatDate(map.checked)}</span> <span>• Checked & Updated on {formatDate(map.checked)}</span>
{/if} {/if}
</div> </div>
</a> </a>
@@ -107,7 +116,8 @@
/* Mobile-First Base Styles */ /* Mobile-First Base Styles */
:global(body) { :global(body) {
margin: 0; margin: 0;
background-color: #f8fafc; background-color: #404c55;
background-image: radial-gradient(#2b343c, #404c55);
color: #0f172a; color: #0f172a;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
} }
@@ -120,13 +130,19 @@
.main-header { .main-header {
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #3c6f79;
color: #ebebeb;
} }
.brand-container { .brand-container {
margin: 15px;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 1rem; gap: 1rem;
margin-bottom: 1.5rem;
} }
.main-logo { .main-logo {
@@ -191,6 +207,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1rem; gap: 1rem;
padding-top: 90px;
} }
.card { .card {

View File

@@ -145,13 +145,19 @@
} }
.top-nav { .top-nav {
position: fixed;
width: 100%;
box-sizing: border-box;
top: 0;
left: 0;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
background: #0f172a; background: #3c6f79;
color: white; color: #e1ebeb;
gap: 1rem; gap: 1rem;
z-index: 10000;
} }
.nav-cluster { .nav-cluster {
@@ -167,19 +173,18 @@
justify-content: center; justify-content: center;
width: 36px; width: 36px;
height: 36px; height: 36px;
background: #1e293b; background: #404c55;
border: 1px solid #334155; border: 1px solid #334155;
border-radius: 8px; border-radius: 8px;
color: #94a3b8; color: #e1ebeb;
text-decoration: none; text-decoration: none;
font-size: 1.2rem; font-size: 1.2rem;
flex-shrink: 0; /* Keeps button from squishing on mobile */ flex-shrink: 0;
transition: all 0.3s ease;
} }
.home-link:hover { .home-link:hover {
background: #334155; background: #2d2d2d;
color: white;
border-color: #475569;
} }
.route-stack { .route-stack {
@@ -193,13 +198,14 @@
font-weight: 800; font-weight: 800;
margin: 0; margin: 0;
white-space: nowrap; white-space: nowrap;
color: #cce9e9;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.secondary-station { .secondary-station {
font-size: 0.7rem; font-size: 0.7rem;
color: #94a3b8; color: #cce9e9;
text-transform: uppercase; text-transform: uppercase;
font-weight: 600; font-weight: 600;
} }
@@ -209,30 +215,10 @@
gap: 0.5rem; gap: 0.5rem;
} }
.icon-btn {
background: #1e293b;
border: 1px solid #334155;
color: white;
padding: 0.4rem 0.6rem;
border-radius: 6px;
font-size: 0.75rem;
font-weight: bold;
cursor: pointer;
white-space: nowrap;
}
.map-spine { .map-spine {
padding-top: 72px; padding-top: 72px;
} }
.secondary-station {
font-size: 0.85rem;
font-weight: 500;
color: #64748b;
letter-spacing: 0.025em;
margin-top: 2px;
}
@media (min-width: 768px) { @media (min-width: 768px) {
.primary-station { .primary-station {
font-size: 1.5rem; font-size: 1.5rem;
@@ -268,6 +254,7 @@
inset: 0; inset: 0;
background: rgba(0, 0, 0, 0.4); background: rgba(0, 0, 0, 0.4);
z-index: 150; z-index: 150;
transition: all 0.3s ease;
} }
.filter-drawer { .filter-drawer {
@@ -275,7 +262,7 @@
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
background: white; background: #3c6f79;
z-index: 200; z-index: 200;
border-radius: 20px 20px 0 0; border-radius: 20px 20px 0 0;
box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.15); box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.15);
@@ -288,17 +275,17 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 1.25rem 1.5rem 0.75rem; padding: 1.25rem 1.5rem 0.75rem;
border-bottom: 1px solid #f1f5f9; border-bottom: 1px solid #e1ebeb;
} }
.drawer-header h3 { .drawer-header h3 {
margin: 0; margin: 0;
font-size: 1rem; font-size: 1rem;
color: #1e293b; color: #e1ebeb;
} }
.close-icon { .close-icon {
background: #f1f5f9; background: #404c55;
border: none; border: none;
border-radius: 50%; border-radius: 50%;
width: 32px; width: 32px;
@@ -307,7 +294,12 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
cursor: pointer; cursor: pointer;
color: #64748b; color: #e1ebeb;
transition: all 0.3s ease;
}
.close-icon:hover {
background: #2d2d2d;
} }
.drawer-content { .drawer-content {
@@ -324,14 +316,14 @@
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border-radius: 999px; border-radius: 999px;
border: 1px solid #e2e8f0; border: 1px solid #e2e8f0;
background: #f8fafc; background: #ff6060;
font-size: 0.875rem; font-size: 0.875rem;
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: all 0.2s;
} }
.filter-chip.active { .filter-chip.active {
background: #1e293b; background: #00725b;
color: white; color: white;
border-color: #1e293b; border-color: #1e293b;
} }
@@ -346,23 +338,22 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 0.4rem; gap: 0.4rem;
border: none;
padding: 0.5rem 0.8rem; padding: 0.5rem 0.8rem;
border-radius: 12px; border-radius: 12px;
border: 1px solid #e2e8f0; background: #404c55;
background: #f8fafc; color: #e1ebeb;
color: #475569;
font-size: 0.75rem; font-size: 0.75rem;
font-weight: 700; font-weight: 700;
cursor: pointer; cursor: pointer;
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.02em; letter-spacing: 0.02em;
transition: all 0.3s ease;
} }
.icon-btn:hover { .icon-btn:hover {
background: #f1f5f9; background: #2d2d2d;
border-color: #cbd5e1;
color: #1e293b;
} }
.icon-btn:active { .icon-btn:active {

View File

@@ -1179,7 +1179,7 @@ routeDetail:
diverges: right diverges: right
direction: up direction: up
elecBranch: none elecBranch: none
description: to Southern Lines (Waterloo/Guildford) description: Up/Dn Reading Spur to Southern Lines (Waterloo/Guildford)
miles: 35 miles: 35
chains: 40 chains: 40
@@ -1187,6 +1187,7 @@ routeDetail:
position: under position: under
category: rail category: rail
name: Low Level Tunnel name: Low Level Tunnel
description: Reading Low Level line
miles: 35 miles: 35
chains: 40 chains: 40
@@ -1250,4 +1251,4 @@ routeDetail:
- type: continues - type: continues
routeName: Reading West Jn - Bristol TM routeName: Reading West Jn - Bristol TM
routeId: "0002" routeId: '0002'

View File

@@ -13,7 +13,7 @@ elecEnd:
routeDetail: routeDetail:
- type: continues - type: continues
routeName: Paddington - Reading West Jn routeName: Paddington - Reading West Jn
routeId: "0001" routeId: '0001'
- type: crossovers - type: crossovers
name: Scours Lane Junction name: Scours Lane Junction
description: Line diverges description: Line diverges