Use footer on any full width pages

acteng · Dec 17, 2024 · 01bc85c · 01bc85c
1 parent bb3d009
commit 01bc85c
Show file tree

Hide file tree

Showing 8 changed files with 144 additions and 108 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/lib/common/About.svelte b/src/lib/common/About.svelte
diff --git a/src/pages/About.svelte b/src/pages/About.svelte
@@ -0,0 +1,108 @@
+<script lang="ts">
+  import "../style/main.css";
+  // @ts-expect-error no declarations
+  import { initAll } from "govuk-frontend";
+    import { Footer } from "govuk-svelte";
+  import { Beta, ExternalLink, Header } from "lib/common";
+  import { onMount } from "svelte";
+
+  onMount(async () => {
+    // For govuk components. Must happen here.
+    initAll();
+  });
+</script>
+
+<div class="govuk-width-container govuk-prose">
+  <Header />
+  <Beta />
+
+  <h1 style="margin-top: 30px">About Plan Your Active Travel Schemes</h1>
+
+  <p>
+    Plan Your Active Travel Schemes is an
+    <ExternalLink href="https://github.com/acteng/atip">
+      open source project
+    </ExternalLink> supported by Active Travel England and developed by:
+  </p>
+
+  <ul>
+    <li>
+      <ExternalLink
+        href="https://www.turing.ac.uk/people/researchers/dustin-carlino"
+      >
+        Dustin Carlino
+      </ExternalLink>: lead developer, from The Alan Turing Institute
+    </li>
+    <li>
+      <ExternalLink href="https://github.com/Pete-Y-CS">
+        Peter York
+      </ExternalLink>
+    </li>
+    <li>
+      With UX design led by
+      <ExternalLink href="https://www.linkedin.com/in/jadene-aderonmu-b4713771">
+        Jadene Aderonmu
+      </ExternalLink>
+    </li>
+    <li>
+      With great thanks to our various users for feedback, testing, and ideas
+    </li>
+  </ul>
+
+  <p>
+    Plan Your Active Travel Schemes builds on
+    <ExternalLink href="https://www.openstreetmap.org/about">
+      OpenStreetMap
+    </ExternalLink>
+    contributors,
+    <ExternalLink href="https://maplibre.org/">MapLibre</ExternalLink>,
+    <ExternalLink href="https://github.com/dimfeld/svelte-maplibre/">
+      svelte-maplibre
+    </ExternalLink>,
+    <ExternalLink href="https://georust.org/">GeoRust</ExternalLink>,
+    <ExternalLink href="https://material.io/resources/icons/">
+      Material icons
+    </ExternalLink>, and other open source projects.
+  </p>
+
+  <p>
+    We want your feedback about Plan Your Active Travel Schemes! Please <ExternalLink
+      href="https://github.com/acteng/atip/issues/new"
+    >
+      start an issue on Github
+    </ExternalLink>
+    or email
+    <a href="mailto:[email protected]">
+      [email protected]
+    </a>
+    .
+  </p>
+
+  <hr />
+
+  <h2>Recent changes</h2>
+  <ul>
+    <li>
+      <b>Public Beta</b>
+      launched December 2024, with various UI improvements, better integration of
+      browse and sketch tools, and official public access.
+    </li>
+    <li>
+      <b>v2</b>
+      launched on 2 June 2023. Changes: a complete UI rewrite, new draw tools, drawing
+      areas snapped to roads, splitting routes, multiple data schemas, speed limit
+      layer, lane visualization layer
+    </li>
+    <li>
+      <b>v1</b>
+      launched in March 2023
+    </li>
+  </ul>
+</div>
+
+<Footer
+  aboutHref="about.html"
+  privacyHref="privacy.html"
+  accessibilityHref="accessibility.html"
+  cookiesHref={undefined}
+/>
diff --git a/src/pages/AccessibilityStatement.svelte b/src/pages/AccessibilityStatement.svelte
@@ -2,6 +2,7 @@
   import "../style/main.css";
   // @ts-expect-error no declarations
   import { initAll } from "govuk-frontend";
+    import { Footer } from "govuk-svelte";
   import { Beta, Header } from "lib/common";
   import { onMount } from "svelte";
 
@@ -130,3 +131,10 @@
     against WCAG guidelines.
   </p>
 </div>
+
+<Footer
+  aboutHref="about.html"
+  privacyHref="privacy.html"
+  accessibilityHref="accessibility.html"
+  cookiesHref={undefined}
+/>
diff --git a/src/pages/CleanLocalStorage.svelte b/src/pages/CleanLocalStorage.svelte
@@ -2,7 +2,7 @@
   import "../style/main.css";
   // @ts-expect-error no declarations
   import { initAll } from "govuk-frontend";
-  import { SecondaryButton, ButtonGroup, WarningButton } from "govuk-svelte";
+  import { SecondaryButton, ButtonGroup, WarningButton, Footer } from "govuk-svelte";
   import {
     downloadGeneratedFile,
     measureLocalStorageSizes,
@@ -110,3 +110,10 @@
     </table>
   </table>
 </div>
+
+<Footer
+  aboutHref="about.html"
+  privacyHref="privacy.html"
+  accessibilityHref="accessibility.html"
+  cookiesHref={undefined}
+/>
diff --git a/src/pages/LandingPage.svelte b/src/pages/LandingPage.svelte
@@ -2,13 +2,10 @@
   import "../style/main.css";
   // @ts-expect-error no declarations
   import { initAll } from "govuk-frontend";
-  import { DefaultButton, Footer, SecondaryButton } from "govuk-svelte";
-  import About from "lib/common/About.svelte";
+  import { DefaultButton, Footer } from "govuk-svelte";
   import { Beta, ExternalLink, Header } from "lib/common";
   import { onMount } from "svelte";
 
-  let showAbout = false;
-
   onMount(async () => {
     // For govuk components. Must happen here.
     initAll();
@@ -50,17 +47,11 @@
     hospital locations, and authority boundaries.
   </p>
   <DefaultButton on:click={goToBrowser}>Start browsing</DefaultButton>
-
-  <h3>Further information</h3>
-
-  <SecondaryButton on:click={() => (showAbout = true)}>
-    About this tool
-  </SecondaryButton>
-  <About bind:open={showAbout} />
 </div>
 
 <Footer
-  accessibilityHref="accessibility.html"
+  aboutHref="about.html"
   privacyHref="privacy.html"
+  accessibilityHref="accessibility.html"
   cookiesHref={undefined}
 />
diff --git a/src/pages/ManageFiles.svelte b/src/pages/ManageFiles.svelte
@@ -7,6 +7,7 @@
     WarningButton,
     SecondaryButton,
     ErrorMessage,
+    Footer,
   } from "govuk-svelte";
   import {
     getKey,
@@ -202,6 +203,13 @@
   </div>
 </div>
 
+<Footer
+  aboutHref="about.html"
+  privacyHref="privacy.html"
+  accessibilityHref="accessibility.html"
+  cookiesHref={undefined}
+/>
+
 <style>
   .green-bar {
     border-top: 0.3rem solid #007161;

diff --git a/src/pages/PrivacyStatement.svelte b/src/pages/PrivacyStatement.svelte
@@ -2,6 +2,7 @@
   import "../style/main.css";
   // @ts-expect-error no declarations
   import { initAll } from "govuk-frontend";
+  import { Footer } from "govuk-svelte";
   import { Beta, Header, ExternalLink } from "lib/common";
   import { onMount } from "svelte";
 
@@ -105,3 +106,10 @@
     </ExternalLink>.
   </p>
 </div>
+
+<Footer
+  aboutHref="about.html"
+  privacyHref="privacy.html"
+  accessibilityHref="accessibility.html"
+  cookiesHref={undefined}
+/>