Adjust metric pages:

- put the previous/next metric controls inside the 3/4 width container, so long sidebars don't hide the bottom control - don't repeat the question title Also fix some HTML escape codes for questions.
acteng · Aug 15, 2024 · d5836d0 · d5836d0
1 parent c500715
commit d5836d0
Show file tree

Hide file tree

Showing 156 changed files with 303 additions and 386 deletions.
diff --git a/codegen/area_check.py b/codegen/area_check.py
@@ -27,7 +27,6 @@
 
             questions.append(
                 {
-                    "Label": label,
                     "Description": description,
                     "Cases": [],
                 }
@@ -47,7 +46,6 @@
 
         f.write("""<Question\n""")
         f.write("  idx={" + str(idx + 1) + "}\n")
-        f.write("""  label="{}"\n""".format(question["Label"]))
 
         f.write("""  cases={[\n""")
         for score, answer in question["Cases"]:

diff --git a/codegen/common.py b/codegen/common.py
@@ -4,6 +4,9 @@
 def html(x):
     x = x.replace('"', '\\"')
     x = x.replace("<", "&lt;")
+    x = x.replace(">", "&gt;")
+    x = x.replace("≤", "&le;")
+    x = x.replace("≥", "&ge;")
 
     y = ""
     is_list = False

diff --git a/codegen/path_check.py b/codegen/path_check.py
@@ -56,7 +56,6 @@
 
             f.write("""<Question\n""")
             f.write("  idx={" + str(idx) + "}\n")
-            f.write("""  label="{}"\n""".format(row["Metric"]))
 
             f.write("""  cases={[\n""")
             f.write("""    ["2", "{}"],\n""".format(html(row["Green"])))

diff --git a/codegen/path_placemaking_check.py b/codegen/path_placemaking_check.py
@@ -32,7 +32,6 @@
 
             f.write("""<Question\n""")
             f.write("  idx={" + str(idx) + "}\n")
-            f.write("""  label="{}"\n""".format(row["Metric"]))
 
             f.write("""  cases={[\n""")
             f.write("""    ["2", "{}"],\n""".format(html(row["Green"])))

diff --git a/codegen/planning.py b/codegen/planning.py
@@ -35,7 +35,6 @@ def htmlList(x):
 
             f.write("""<Question\n""")
             f.write("  idx={" + str(idx) + "}\n")
-            f.write("""  label="{}"\n""".format(row["Criterion"].strip()))
             f.write(""">\n""")
 
             f.write(

diff --git a/codegen/safety_check.py b/codegen/safety_check.py
@@ -39,7 +39,6 @@
 
             f.write("""<Question\n""")
             f.write("  idx={" + str(idx) + "}\n")
-            f.write("""  label="{}"\n""".format(row["Metric"]))
 
             f.write("""  cases={[\n""")
             f.write("""    ["2", "{}"],\n""".format(html(row["Green"])))

diff --git a/codegen/street_check.py b/codegen/street_check.py
@@ -39,7 +39,6 @@
 
             f.write("""<Question\n""")
             f.write("  idx={" + str(idx) + "}\n")
-            f.write("""  label="{}"\n""".format(row["Metric"]))
 
             f.write("""  cases={[\n""")
             f.write("""    ["2", "{}"],\n""".format(html(row["Green"])))

diff --git a/codegen/street_placemaking_check.py b/codegen/street_placemaking_check.py
@@ -32,7 +32,6 @@
 
             f.write("""<Question\n""")
             f.write("  idx={" + str(idx) + "}\n")
-            f.write("""  label="{}"\n""".format(row["Metric"]))
 
             f.write("""  cases={[\n""")
             f.write("""    ["2", "{}"],\n""".format(html(row["Green"])))

diff --git a/src/lib/nav/index.ts b/src/lib/nav/index.ts
diff --git a/src/routes/area_check/scorecard/Question.svelte b/src/routes/area_check/scorecard/Question.svelte
@@ -4,7 +4,6 @@
   import { state } from "../data";
 
   export let idx: number;
-  export let label: string;
   export let cases: [number, string][];
 
   // Note these are different than the ones used in route check
@@ -27,15 +26,13 @@
   );
 </script>
 
-<PrevNext {idx} total={13} urlPath="area_check/scorecard/q" />
-
 <div class="govuk-grid-row" style="margin: 1em">
   <div class="govuk-grid-column-one-quarter">
     <Progress currentIdx={idx} />
   </div>
 
   <div class="govuk-grid-column-three-quarters">
-    <h2>{label}</h2>
+    <PrevNext {idx} total={13} urlPath="area_check/scorecard/q" />
 
     <slot />
 
@@ -46,7 +43,7 @@
       bind:existingNotes={$state.existingScoreNotes[idx - 1]}
       bind:proposedNotes={$state.proposedScoreNotes[idx - 1]}
     />
+
+    <PrevNext {idx} total={13} urlPath="area_check/scorecard/q" />
   </div>
 </div>
-
-<PrevNext {idx} total={13} urlPath="area_check/scorecard/q" />
diff --git a/src/routes/area_check/scorecard/q01/+page.svelte b/src/routes/area_check/scorecard/q01/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={1}
-  label="Porosity - Walking and Wheeling"
   cases={[
     [
       4,

diff --git a/src/routes/area_check/scorecard/q02/+page.svelte b/src/routes/area_check/scorecard/q02/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={2}
-  label="Porosity - Cycling"
   cases={[
     [
       4,

diff --git a/src/routes/area_check/scorecard/q03/+page.svelte b/src/routes/area_check/scorecard/q03/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={3}
-  label="Crossings - Walking and Wheeling"
   cases={[
     [
       4,

diff --git a/src/routes/area_check/scorecard/q04/+page.svelte b/src/routes/area_check/scorecard/q04/+page.svelte
@@ -5,7 +5,6 @@
 
 <Question
   idx={4}
-  label="Crossings - Cycling"
   cases={[
     [
       4,

diff --git a/src/routes/area_check/scorecard/q05/+page.svelte b/src/routes/area_check/scorecard/q05/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={5}
-  label="Permeability - Walking and Wheeling"
   cases={[
     [
       4,
@@ -43,7 +42,7 @@
       Suitable footway widths as defined in DfT’s Inclusive Mobility guidance.
     </li>
     <li>Suitable tactile paving surfaces.</li>
-    <li>Acceptable footway camber (≤2.5%).</li>
+    <li>Acceptable footway camber (&le;2.5%).</li>
     <li>Minimal street clutter.</li>
     <li>Appropriate street lighting.</li>
   </ul>

diff --git a/src/routes/area_check/scorecard/q06/+page.svelte b/src/routes/area_check/scorecard/q06/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={6}
-  label="Permeability - Cycling"
   cases={[
     [
       4,

diff --git a/src/routes/area_check/scorecard/q07/+page.svelte b/src/routes/area_check/scorecard/q07/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={7}
-  label="Mesh Density - Walking and Wheeling"
   cases={[
     [4, "<p>The area has an average mesh density of 100m</p>"],
     [3, "<p>The area has an average mesh density of 101-250m</p>"],

diff --git a/src/routes/area_check/scorecard/q08/+page.svelte b/src/routes/area_check/scorecard/q08/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={8}
-  label="Mesh Density - Cycling"
   cases={[
     [4, "<p>The area has an average mesh density of 250m.</p>"],
     [3, "<p>The area has an average mesh density of 251-400m.</p>"],

diff --git a/src/routes/area_check/scorecard/q09/+page.svelte b/src/routes/area_check/scorecard/q09/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={9}
-  label="Motorised Through-Traffic"
   cases={[
     [
       8,

diff --git a/src/routes/area_check/scorecard/q10/+page.svelte b/src/routes/area_check/scorecard/q10/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={10}
-  label="Perimeter Treatment Design"
   cases={[
     [
       16,

diff --git a/src/routes/area_check/scorecard/q11/+page.svelte b/src/routes/area_check/scorecard/q11/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={11}
-  label="Green Infrastructure Design"
   cases={[
     [
       12,

diff --git a/src/routes/area_check/scorecard/q12/+page.svelte b/src/routes/area_check/scorecard/q12/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={12}
-  label="Other Internal Treatment Design"
   cases={[
     [
       16,

diff --git a/src/routes/area_check/scorecard/q13/+page.svelte b/src/routes/area_check/scorecard/q13/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={13}
-  label="Engagement Practice"
   cases={[
     [
       16,

diff --git a/src/routes/planning/scorecard/Question.svelte b/src/routes/planning/scorecard/Question.svelte
@@ -6,7 +6,6 @@
   import { state } from "../data";
 
   export let idx: number;
-  export let label: string;
 
   let choices: [string, string, string, string][] = [
     [
@@ -48,15 +47,13 @@
   ];
 </script>
 
-<PrevNext {idx} total={10} urlPath="planning/scorecard/q" />
-
 <div class="govuk-grid-row" style="margin: 1em">
   <div class="govuk-grid-column-one-quarter">
     <Progress currentIdx={idx} />
   </div>
 
   <div class="govuk-grid-column-three-quarters">
-    <h2>{idx}. {label}</h2>
+    <PrevNext {idx} total={10} urlPath="planning/scorecard/q" />
 
     <slot name="description" />
 
@@ -77,7 +74,7 @@
 
     <h3>Policy & Guidance</h3>
     <slot name="guidance" />
+
+    <PrevNext {idx} total={10} urlPath="planning/scorecard/q" />
   </div>
 </div>
-
-<PrevNext {idx} total={10} urlPath="planning/scorecard/q" />
diff --git a/src/routes/planning/scorecard/q01/+page.svelte b/src/routes/planning/scorecard/q01/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={1} label="Trip generation and assignment">
+<Question idx={1}>
   <div slot="description">
     <p>
       Does the application appropriately forecast all day trips to, from and

diff --git a/src/routes/planning/scorecard/q02/+page.svelte b/src/routes/planning/scorecard/q02/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={2} label="Active travel route audit">
+<Question idx={2}>
   <div slot="description">
     <p>
       Has an appropriate assessment on the design and accessibility of existing

diff --git a/src/routes/planning/scorecard/q03/+page.svelte b/src/routes/planning/scorecard/q03/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={3} label="Pedestrian access to local amenities">
+<Question idx={3}>
   <div slot="description">
     <p>
       Are most buildings within 800m from a range of amenities (such as primary

diff --git a/src/routes/planning/scorecard/q04/+page.svelte b/src/routes/planning/scorecard/q04/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={4} label="Cycling accessibility">
+<Question idx={4}>
   <div slot="description">
     <p>
       Are a range of local amenities, and town centres, railway stations,

diff --git a/src/routes/planning/scorecard/q05/+page.svelte b/src/routes/planning/scorecard/q05/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={5} label="Access to public transport">
+<Question idx={5}>
   <div slot="description">
     <p>
       Are all buildings within 400m of a high-frequency bus stop or 800m of a

diff --git a/src/routes/planning/scorecard/q06/+page.svelte b/src/routes/planning/scorecard/q06/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={6} label="Off-site transport infrastructure">
+<Question idx={6}>
   <div slot="description">
     <p>
       Does the application include proposals to enhance local active travel and

diff --git a/src/routes/planning/scorecard/q07/+page.svelte b/src/routes/planning/scorecard/q07/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={7} label="Site permeability">
+<Question idx={7}>
   <div slot="description">
     <p>
       Does the development prioritise pedestrian and cycle movements within the

diff --git a/src/routes/planning/scorecard/q08/+page.svelte b/src/routes/planning/scorecard/q08/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={8} label="Placemaking">
+<Question idx={8}>
   <div slot="description">
     <p>
       Does the development establish a strong sense of place, with well-designed

diff --git a/src/routes/planning/scorecard/q09/+page.svelte b/src/routes/planning/scorecard/q09/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={9} label="Cycle parking and trip-end facilities">
+<Question idx={9}>
   <div slot="description">
     <p>
       Does the application provide the requisite amount and quality of cycle

diff --git a/src/routes/planning/scorecard/q10/+page.svelte b/src/routes/planning/scorecard/q10/+page.svelte
@@ -2,7 +2,7 @@
   import Question from "../Question.svelte";
 </script>
 
-<Question idx={10} label="Travel planning">
+<Question idx={10}>
   <div slot="description">
     <p>
       Does the travel plan outline ambitious mode share targets and measures to

diff --git a/src/routes/route_check/path_check/Question.svelte b/src/routes/route_check/path_check/Question.svelte
@@ -5,7 +5,6 @@
   import { scoreToColor } from "$lib/colors";
 
   export let idx: number;
-  export let label: string;
   export let cases: ["0" | "1" | "2" | "N/A", string][];
 
   let choices: [string, string, string, string][] = cases.map(
@@ -18,15 +17,18 @@
   );
 </script>
 
-<PrevNext {idx} total={30} startIdx={17} urlPath="route_check/path_check/pa" />
-
 <div class="govuk-grid-row" style="margin: 1em">
   <div class="govuk-grid-column-one-quarter">
     <Progress currentIdx={idx} />
   </div>
 
   <div class="govuk-grid-column-three-quarters">
-    <h2>PA{16 + idx}: {label}</h2>
+    <PrevNext
+      {idx}
+      total={30}
+      startIdx={17}
+      urlPath="route_check/path_check/pa"
+    />
 
     <slot />
 
@@ -37,7 +39,12 @@
       bind:existingNotes={$state.pathCheck.existingScoreNotes[idx - 1]}
       bind:proposedNotes={$state.pathCheck.proposedScoreNotes[idx - 1]}
     />
+
+    <PrevNext
+      {idx}
+      total={30}
+      startIdx={17}
+      urlPath="route_check/path_check/pa"
+    />
   </div>
 </div>
-
-<PrevNext {idx} total={30} startIdx={17} urlPath="route_check/path_check/pa" />
diff --git a/src/routes/route_check/path_check/pa17/+page.svelte b/src/routes/route_check/path_check/pa17/+page.svelte
@@ -4,7 +4,6 @@
 
 <Question
   idx={1}
-  label="Barriers"
   cases={[
     [
       "2",
-Original file line number
+Diff line change
@@ Expand Up / @@ -4,7 +4,6 @@ @@
     <Question
       idx={1}
-      label="Porosity - Walking and Wheeling"
       cases={[
         [
 ,
@@ Expand Down @@