style: Web UX - moving sort by (#1854)

* testing verified commit

* fix: UX changes for sort by

* moved placement of sort by

* UX changes

Author: HarmeetRandhawa-NHS

application/CohortManager/src/Web/app/components/ExceptionsPage.tsx

@@ -90,13 +90,13 @@ export default async function ExceptionsPage({
         {title && <h1>{title}</h1>}
 
         {totalItems === 0 ? (
-          <p className="nhsuk-body">
+          <p className="nhsuk-body nhsuk-u-margin-top-5">
             {noResultsMessage}
           </p>
         ) : (
           <>
             <p
-              className="app-results-text"
+              className={"app-results-text_exceptions"}
               data-testid={exceptionStatus === ExceptionStatus.Raised ? "raised-exception-count" : "not-raised-exception-count"}
             >
               Showing {startItem} to {endItem} of {totalItems} results

application/CohortManager/src/Web/app/components/filterExceptionsForm.tsx

@@ -33,27 +33,6 @@ export default function FilterExceptionsForm({
 
   return (
     <form className="nhsuk-form" data-testid="filter-exceptions-form" method="GET">
-      <div className="nhsuk-form-group">
-        <label
-          className="nhsuk-label"
-          htmlFor="sort-exceptions"
-        >
-          Sort by
-        </label>
-        <select
-          className="nhsuk-select"
-          id="sort-exceptions"
-          name="sortBy"
-          defaultValue={sortBy}
-        >
-          {sortOptions.map((option) => (
-            <option key={option.value} value={option.value}>
-              {option.label}
-            </option>
-          ))}
-        </select>
-      </div>
-
       <div className="nhsuk-form-group">
         <label className="nhsuk-label" htmlFor="filter-rule">
           Filter by exception type
@@ -72,7 +51,6 @@ export default function FilterExceptionsForm({
           ))}
         </select>
       </div>
-
       <div
         className={`nhsuk-form-group ${dateError ? "nhsuk-form-group--error" : ""}`}
       >
@@ -166,6 +144,26 @@ export default function FilterExceptionsForm({
           </div>
         </fieldset>
       </div>
+        <div className="nhsuk-form-group_exceptions">
+        <label
+          className="nhsuk-label"
+          htmlFor="sort-exceptions"
+        >
+          Sort by
+        </label>
+        <select
+          className="nhsuk-select"
+          id="sort-exceptions"
+          name="sortBy"
+          defaultValue={sortBy}
+        >
+          {sortOptions.map((option) => (
+            <option key={option.value} value={option.value}>
+              {option.label}
+            </option>
+          ))}
+        </select>
+      </div>
     </form>
   );
 }

application/CohortManager/src/Web/app/components/sortExceptionsForm.tsx

@@ -11,7 +11,7 @@ export default function SortExceptionsForm({
 }: Readonly<SortExceptionsFormProps>) {
   return (
     <form className="nhsuk-form" data-testid="sort-exceptions-form" method="GET">
-      <div className="nhsuk-form-group">
+      <div className="nhsuk-form-group_exceptions">
         <label
           className="nhsuk-label nhsuk-u-visually-hidden"
           htmlFor="sort-exceptions"

application/CohortManager/src/Web/app/globals.scss

@@ -203,3 +203,13 @@
 .nhsuk-header__account {
   flex-shrink: 0;
 }
+
+.nhsuk-form-group_exceptions {
+  text-align: right;
+}
+
+.app-results-text_exceptions {
+  margin-top: -2rem;
+}
+
+

application/CohortManager/src/Web/app/reports/page.tsx

@@ -58,7 +58,7 @@ export default async function Page() {
             <div className="nhsuk-grid-column-full">
               <h1 data-testid="heading-report">Reports</h1>
               <p
-                className="app-results-text nhsuk-u-margin-bottom-4"
+                className="nhsuk-body nhsuk-u-margin-bottom-3"
                 data-testid="reports-date-range"
               >
                 Showing reports for {formatDate(formatIsoDate(start))} to{" "}

docs/user-guides/Sign_Git_commits.md

@@ -335,3 +335,4 @@ After completing these steps, your new signing key will be listed in the "**SSH
 ## Testing
 
 To ensure your configuration works as expected, make a commit to a branch locally and push it to GitHub. When you view the commit history of the branch on GitHub, [your latest commit](https://docs.github.com/en/authentication/managing-commit-signature-verification/about-commit-signature-verification#about-commit-signature-verification) should now display a `Verified` tag, which indicates successful signing with your GPG or SSH key.
+