edward/bristol-eurostar
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

Move inline styles to CSS classes; update README

Browse source 
Extract repeated inline styles from templates into named CSS classes in
base.html: layout helpers, buttons, form groups, alert boxes, results table
rules, row highlight classes, typography utilities, and empty-state styles.
Remove the per-page <style> block from results.html.

Update README to reflect current destinations, GraphQL data source, Circle
Line timetable, configurable connection range, and GWR fare table.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Edward Betts 2026-04-04 15:39:04 +01:00
parent e6f310f517
commit 71be0dd8cf
4 changed files with 214 additions and 97 deletions
Download patch file Download diff file Expand all files Collapse all files

94
templates/base.html
View file

@ -185,9 +185,103 @@
.card {
padding: 1.25rem;
}
.col-transfer { display: none; }
}
a { color: #00539f; }
/* Card helpers */
.card > h2:first-child { margin-top: 0; }
.card-scroll { overflow-x: auto; }
/* Form groups */
.form-group { margin-bottom: 1.2rem; }
.form-group-lg { margin-bottom: 1.5rem; }
/* Buttons */
.btn-primary {
background: #00539f;
color: #fff;
border: none;
padding: 0.75rem 2rem;
font-size: 1rem;
font-weight: 600;
border-radius: 4px;
cursor: pointer;
}
.btn-nav {
padding: 0.3rem 0.75rem;
border: 1px solid #cbd5e0;
border-radius: 4px;
text-decoration: none;
color: #00539f;
font-size: 0.9rem;
}
/* Inline select */
.select-inline {
padding: 0.3rem 0.6rem;
font-size: 0.9rem;
border: 1px solid #cbd5e0;
border-radius: 4px;
}
/* Alert boxes */
.alert {
margin-top: 1rem;
padding: 0.75rem 1rem;
border-radius: 4px;
}
.alert-error {
background: #fff5f5;
border: 1px solid #fc8181;
color: #c53030;
}
.alert-warning {
background: #fffbeb;
border: 1px solid #f6e05e;
color: #744210;
}
/* Results page layout */
.back-link { margin-bottom: 1rem; }
.date-nav { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
.switcher-section { margin: 0.9rem 0 1rem; }
.section-label { font-size: 0.9rem; font-weight: 600; margin-bottom: 0.45rem; }
.filter-row { margin-top: 0.75rem; display: flex; gap: 1.5rem; align-items: center; }
.filter-label { font-size: 0.9rem; font-weight: 600; margin-right: 0.5rem; }
.card-meta { color: #4a5568; margin: 0; }
.footnote { margin-top: 1rem; font-size: 0.82rem; color: #718096; }
/* Results table */
.results-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.results-table th,
.results-table td { padding: 0.6rem 0.8rem; }
.results-table thead tr { border-bottom: 2px solid #e2e8f0; text-align: left; }
.results-table tbody tr { border-bottom: 1px solid #e2e8f0; }
.row-fast { background: #f0fff4; }
.row-slow { background: #fff5f5; }
.row-alt { background: #f7fafc; }
.row-unreachable { background: #f7fafc; color: #a0aec0; }
/* Empty state */
.empty-state { color: #4a5568; text-align: center; padding: 3rem 2rem; }
.empty-state p { margin: 0; }
.empty-state p:first-child { font-size: 1.1rem; margin-bottom: 0.5rem; }
.empty-state p:last-child { font-size: 0.9rem; }
/* Utilities */
.text-muted { color: #718096; }
.text-dimmed { color: #a0aec0; }
.text-green { color: #276749; }
.text-red { color: #c53030; }
.text-blue { color: #00539f; }
.text-sm { font-size: 0.85rem; }
.text-xs { font-size: 0.75rem; }
.nowrap { white-space: nowrap; }
.font-bold { font-weight: 600; }
.font-normal { font-weight: 400; }
</style>
</head>
<body>