fred.boniface/OwlBoard
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects 1 Releases Wiki Activity

Frontend: Add more help content

Browse Source 
Signed-off-by: Fred Boniface <fred@fjla.uk>
This commit is contained in:
Fred Boniface 2023-01-25 13:27:55 +00:00
parent b3b61258c8
commit daadc1b6bb
4 changed files with 70 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
UpNext.md
View File

@ -9,12 +9,12 @@
* Enable text search for `locationName` on find-code page.
* Recreate raster logos with the new vector file.
* Responsive text sizes for boards.
* Change dockerfile to deploy with brotli support for faster laoding.
### In Progress:
### Completed - Testing:
* Change dockerfile to deploy with brotli support for faster laoding.
* Implement calling list.
* Support multiple origins/destinations: NOT INCLUDING ON CALLING LIST
* Frontend Code Refactor

69
static/help.html
View File

@ -8,6 +8,7 @@
<meta name="author" content="Frederick Boniface">
<meta name="theme-color" content="#155bb7">
<link rel="stylesheet" type="text/css" href="./styles/main.css"/>
<link rel="stylesheet" type="text/css" href="./styles/help.css"/>
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
<link rel="manifest" type="application/json" href="./manifest.json"/>
<!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
@ -25,21 +26,61 @@
<source srcset="/images/logo/logo-full-256.webp" type="image/webp">
<img class="titleimg" src="/images/logo/logo-full-256.png" alt="OwlBoard Logo">
</picture>
<h2>Help</h2>
<p>OwlBoard gives you quick and easy access to departure boards for
<h2>Help</h2>
<p>OwlBoard gives you quick and easy access to departure boards for
all National Rail stations in the UK.</p>
<p>Just type a CRS or TIPLOC into the textbox on the homepage and tap
enter on the screen or your keypad.</p>
<p>For example, Portway Park &
Ride's CRS is 'PRI', and its TIPLOC is 'PTWYPR'; Portsmouth Harbour's
CRS is 'PMH', and its TIPLOC is 'PHBR'.</p>
<p>A CRS is always three letters,
a TIPLOC can be between 4-7 letters.</p>
<br>
<h3>Don't know the CRS or TIPLOC?</h3>
<p>Sorry, you can't search for them on OwlBoard yet but will be able to
in the future.</p>
<h3>Spotted an issue with the site?</h3>
<p>Just type a CRS, TIPLOC or STANOX into the textbox on the homepage and tap
enter on the screen or your keypad. You can also select a differnt board type,
more details on your choices below.</p>
<p>For example, Portway Park &
Ride's CRS is 'PRI', and its TIPLOC is 'PTWYPR'; Portsmouth Harbour's
CRS is 'PMH', and its TIPLOC is 'PHBR'.</p>
<p>A CRS is always three letters,
a TIPLOC can be between 4-7 letters.</p>
<br>
<h3>Don't know the CRS or TIPLOC?</h3>
<p>Sorry, you can't search by name but you can use our <a href="find-code.html">
Code Lookup</a> page to help.</p>
<h3>Board Types</h3>
<h4>Basic Board - Default</h4>
<p>The basic board shows the next 10 train arrival and departures, as well as
bus and ferry departures where available.</p>
<p>You can tap on a trains origin or destination to see service details.</p>
<br>
<h3>Glossary</h3>
<p>Some of the terms may be new to you or different from those commonly used.</p>
<table id="table">
<tr>
<th>Term</th>
<th>Definition</th>
</tr>
<tr>
<td>CAN</td>
<td>Cancelled</td>
</tr>
<tr>
<td>CRS</td>
<td>Computer Reservation System Code - correctly termed as '3ALPHA'</td>
</tr>
<tr>
<td>NLC</td>
<td>National Location Code - Used for finance & accounting</td>
</tr>
<tr>
<td>RT</td>
<td>Right rime (On time)</td>
</tr>
<tr>
<td>STANOX</td>
<td>Station Number</td>
</tr>
<tr>
<td>TIPLOC</td>
<td>Timing Point Location (Name)</td>
</tr>
</table>
<br>
<h3>Spotted an issue with the site?</h3>
<p>Let me know by <a href="./report.html">reporting an issue</a>.</p>
</body>
</html>

13
static/styles/help.css Normal file
View File

@ -0,0 +1,13 @@
/* Glossary */
table, th, td {
border: 1px solid;
border-color: lightgrey;
border-collapse: collapse;
}
#table {
color: lightgrey;
width: 80%;
max-width: 700px;
margin: auto;
}

1
static/styles/main.css
View File

@ -294,6 +294,7 @@ label {
white-space: nowrap;
transition: 0.5s;
}
/* Footer Styles */
footer {
background-color: var(--accent-color);