accessibility amends for lpa reps

This commit is contained in:
2024-02-20 13:26:07 +00:00
parent c98e05d549
commit 7dbc978f00
17 changed files with 609 additions and 580 deletions
+6 -2
View File
@@ -59,7 +59,10 @@ const DocumentDetails = (props) => {
className="govuk-grid-row govuk-!-margin-left-0"
>
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
<label
className="govuk-label-s "
htmlFor="showDocumentType"
>
{t("case:documents-show-label")}
<select
onChange={(e) => {
@@ -70,6 +73,7 @@ const DocumentDetails = (props) => {
className="govuk-select"
id="showDocumentType"
name="showDocumentType"
datafield="showDocumentType"
>
<option value="all">
{router.locale == "cy"
@@ -114,7 +118,7 @@ const DocumentDetails = (props) => {
<div className="govuk-form-group">
<label
className="govuk-label-s "
htmlFor="sort"
htmlFor="showNumberOfRecords"
>
{t(
"search:searchresults-show-records-label-a"
+2 -2
View File
@@ -708,11 +708,11 @@ let MakeRepresentation = (props) => {
{" "}
<div className="card">
<div className="card-body">
<h4 className="govuk-heading-s">
<h2 className="govuk-heading-s">
{t(
"myrepresentations:timetable-title"
)}
</h4>
</h2>
<div className="govuk-summary-list">
<div className="govuk-body-s">
{t(
@@ -43,28 +43,30 @@ const RepAgent = (props) => {
return (
<>
<div className="govuk-grid-row">
<div className="govuk-form-group">
{typeof formObj.representationForm.values
.representationType == "undefined" ? (
<>
<h2 className="govuk-heading-m ">
{t(
"myrepresentations:representation-from-an-agent-heading"
)}
</h2>
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
{t("myrepresentations:kind-of-rep-label")}
</label>
{typeof props.representationType == "undefined" ||
typeof formObj.representationForm.values
.representationType == "undefined" ? (
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</>
) : (
<label className="govuk-label govuk-body-m">
Representation Type:{" "}
@@ -45,6 +45,9 @@ const RepAppellant = (props) => {
<>
<div className="govuk-grid-row">
<div className="govuk-form-group">
{typeof formObj.representationForm.values
.representationType == "undefined" ? (
<>
<h2 className="govuk-heading-m ">
{t(
"myrepresentations:representation-from-an-appellant-heading"
@@ -57,15 +60,13 @@ const RepAppellant = (props) => {
{t("myrepresentations:kind-of-rep-label")}
</label>
{typeof props.representationType == "undefined" ||
typeof formObj.representationForm.values
.representationType == "undefined" ? (
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</>
) : (
<label className="govuk-label govuk-body-m">
Representation Type:{" "}
@@ -281,7 +281,7 @@ export const RenderCondtionalRadioList = ({
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<label
className="govuk-fieldset__heading govuk-body-m"
id="representationCapacity_label"
id={id + "_label"}
>
{legend}
</label>
@@ -385,14 +385,6 @@ export const RenderLPACondtionalRadioList = ({
className="govuk-fieldset"
aria-describedby={id + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
className="govuk-fieldset__heading govuk-body-m"
id={id + "_label"}
>
{label}
</label>
</legend>
{touched && error && (
<span
id={id + "-error"}
@@ -406,10 +398,7 @@ export const RenderLPACondtionalRadioList = ({
)}
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<label
className=" govuk-body-m"
id="representationCapacity_label"
>
<label className=" govuk-body-m" id={id + "_label"}>
{legend}
</label>
</legend>
@@ -481,7 +470,9 @@ export const RenderPickList = ({
optionsArr,
meta: { touched, error },
errorMsg,
...custom
}) => {
console.log(custom.disabled);
return (
<>
<div
@@ -507,6 +498,7 @@ export const RenderPickList = ({
className="govuk-select "
id={datafieldname}
name={datafieldname}
disabled={custom.disabled}
>
<option>Select...</option>
{Object.keys(optionsArr).map((key, index) => {
@@ -699,14 +691,14 @@ export const RenderMultiline = ({
return (
<>
<div className="govuk-form-group ">
<label className="govuk-label" htmlFor={name}>
<label className="govuk-label" htmlFor={datafieldname}>
{label}
</label>
{"hint" in custom}
{"hint" in custom && (
<div
id={name + "-hint"}
id={datafieldname + "-hint"}
className="govuk-hint govuk-!-font-size-14"
>
{custom.hint}
@@ -227,9 +227,14 @@ let RepLPA = (props) => {
return (
<>
<div className="govuk-grid-row">
<div className="govuk-form-group">
{typeof formObj.representationForm.values
.representationType == "undefined" ? (
<>
<h2 className="govuk-heading-m ">
{typeof props.representationType != "undefined"
? props.representationType == "Questionnaire"
? props.representationType ==
"Questionnaire"
? locale == "cy"
? "Holiadur"
: props.representationType
@@ -237,11 +242,14 @@ let RepLPA = (props) => {
: locale == "cy"
? "Cynrychioliadau"
: "Representation"}{" "}
{locale == "cy" ? "o ACLI am a" : "from an LPA for a"}{" "}
{locale == "cy"
? "o ACLI am a"
: "from an LPA for a"}{" "}
{locale == "cy"
? jsonpath(
'$..[?(@.attributevalue=="' +
currentView.caseReference.appealType +
currentView.caseReference
.appealType +
'")].value_cy',
transLookup
)
@@ -250,8 +258,6 @@ let RepLPA = (props) => {
).value}
</h2>
{typeof props.representationType == "undefined" && (
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
@@ -268,9 +274,18 @@ let RepLPA = (props) => {
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</div>
</>
) : (
<label className="govuk-label govuk-body-m">
Representation Type:{" "}
{
formObj.representationForm.values
.representationType
}{" "}
</label>
)}
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
{typeof props.representationType != "undefined" &&
@@ -407,7 +407,7 @@ const RepresentationProgress_s78 = (props) => {
aria-controls={
"step-panel-" +
t(
"myrepresentations:s78-section-heading-six"
"myrepresentations:add-files-label"
)
.replace(/\s+/g, "-")
.toLowerCase()
@@ -415,7 +415,7 @@ const RepresentationProgress_s78 = (props) => {
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-six"
"myrepresentations:add-files-label"
)}
</span>
</a>
@@ -110,9 +110,9 @@ let S78_Questionnaire = (props) => {
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<h3 className="govuk-heading-s ">
<h2 className="govuk-heading-s ">
{t("myrepresentations:s78-section-heading-one")}{" "}
</h3>
</h2>
<div className="govuk-form-group">
<div className="govuk-label">
1. {t("myrepresentations:s78-section-question-1")}{" "}
@@ -150,6 +150,7 @@ let S78_Questionnaire = (props) => {
<div className="govuk-form-group">
<Field
datafieldname="procedureType"
label={
"5. " +
t("myrepresentations:s78-section-question-5")
@@ -308,19 +309,20 @@ let S78_Questionnaire = (props) => {
className="govuk-fieldset govuk-!-margin-top-9"
aria-describedby="commentBox-hint"
>
<h3 className="govuk-heading-s ">
<h2 className="govuk-heading-s ">
{" "}
{t("myrepresentations:s78-section-heading-two")}{" "}
</h3>
</h2>
<div className="govuk-form-group">
<Field
label={
"11. " +
t("myrepresentations:s78-section-question-11")
}
name="LPAcaseFileAndReps"
id="LPAcaseFileAndReps"
name={"LPAcaseFileAndReps"}
id={"LPAcaseFileAndReps"}
component={RenderMultiline}
datafieldname={"LPAcaseFileAndReps"}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
@@ -339,6 +341,7 @@ let S78_Questionnaire = (props) => {
}
name="LPAldpAndMap"
id="LPAldpAndMap"
datafieldname="LPAldpAndMap"
component={RenderMultiline}
type="text"
rows="5"
@@ -358,6 +361,7 @@ let S78_Questionnaire = (props) => {
}
name="LPAlocalGuidance"
id="LPAlocalGuidance"
datafieldname="LPAlocalGuidance"
component={RenderMultiline}
type="text"
rows="5"
@@ -394,9 +398,9 @@ let S78_Questionnaire = (props) => {
className="govuk-fieldset govuk-!-margin-top-9"
aria-describedby="commentBox-hint"
>
<h3 className="govuk-heading-s ">
<h2 className="govuk-heading-s ">
{t("myrepresentations:s78-section-heading-three")}
</h3>
</h2>
<Field
label={
"15. " +
@@ -615,9 +619,9 @@ let S78_Questionnaire = (props) => {
className="govuk-fieldset govuk-!-margin-top-9"
aria-describedby="commentBox-hint"
>
<h3 className="govuk-heading-s ">
<h2 className="govuk-heading-s ">
{t("myrepresentations:s78-section-heading-four")}
</h3>
</h2>
<div className="govuk-form-group govuk-body-m">
{"24. " +
t("myrepresentations:s78-section-question-24")}
@@ -736,9 +740,9 @@ let S78_Questionnaire = (props) => {
className="govuk-fieldset govuk-!-margin-top-9"
aria-describedby="commentBox-hint"
>
<h3 className="govuk-heading-s ">
<h2 className="govuk-heading-s ">
{t("myrepresentations:s78-section-heading-five")}
</h3>
</h2>
<div className="govuk-form-group">
<Field
@@ -958,7 +962,7 @@ let S78_Questionnaire = (props) => {
className="govuk-fieldset govuk-!-margin-top-9"
aria-describedby="commentBox-hint"
>
<h3 className="govuk-heading-s ">Declaration</h3>
<h2 className="govuk-heading-s ">Declaration</h2>
<div className="govuk-form-group">
<Field
className="govuk-input govuk-!-width-one-half"
+7 -18
View File
@@ -442,7 +442,7 @@ const CaseSummary = (props) => {
0 ==
true ? (
<button
className="govuk-link"
className="govuk-link watchCase"
onClick={() => {
confirm(
t(
@@ -475,8 +475,8 @@ const CaseSummary = (props) => {
)}{" "}
</button>
) : (
<span
className=" govuk-link"
<button
className="govuk-link watchCase"
onClick={() => {
confirm(
t(
@@ -507,24 +507,13 @@ const CaseSummary = (props) => {
{t(
"case:watch-this-case-link"
)}
</span>
</button>
))}
{!session && (
<span
className="govuk-link"
<button
className="govuk-link watchCase"
onClick={() => {
// signIn("email");
// signIn();
// selectWatchedCase(
// cookies.pinsUser,
// item.incidentid,
// item.pinswg_appealcasetype
// );
// alert(
// "Trying to watch case " +
// item.title
// );
confirm(
"Trying to watch case " +
props.currentView
@@ -546,7 +535,7 @@ const CaseSummary = (props) => {
)}
>
{t("case:watch-this-case-link")}
</span>
</button>
)}
</div>
</div>
@@ -133,7 +133,7 @@ const ApplicationTabsDocuments = (props) => {
</div>
<div className=" govuk-grid-column-two-thirds govuk-form-group">
<label className="govuk-label-xs " htmlFor="sort">
<label className="govuk-label-xs " htmlFor="showNo">
Show{" "}
<select
className="govuk-select govuk-select-s"
+21 -19
View File
@@ -9,11 +9,12 @@ const ApplicationList = (props) => {
const router = useRouter();
const { locale } = router;
return <>
return (
<>
<div className="govuk-grid-row govuk-!-margin-top-9">
<div className="govuk-grid-column-full">
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
<label className="govuk-label-s " htmlFor="showNo">
{t("dnsCommon:result-list-show-label")}{" "}
<select
className="govuk-select"
@@ -83,13 +84,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -132,13 +133,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -181,13 +182,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -230,13 +231,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -279,13 +280,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -328,13 +329,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -377,13 +378,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -426,13 +427,13 @@ const ApplicationList = (props) => {
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</span>
TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -489,7 +490,8 @@ const ApplicationList = (props) => {
</p>
</div>
</div>
</>;
</>
);
};
export default ApplicationList;
@@ -178,6 +178,7 @@ const AwaitingSubmissionFromBlob = (props) => {
</div>
<div className="">
<button
title={t("case:do-you-want-to-delete-case-label")}
className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
onClick={() => {
confirm(
+2
View File
@@ -304,6 +304,7 @@ const TopThree = (props) => {
{topThreeType == "watchedCases" && (
<div className="">
<button
title={t("case:you-have-stopped-watching-label")}
className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
onClick={() => {
confirm(
@@ -325,6 +326,7 @@ const TopThree = (props) => {
{topThreeType == "awaitingSubmission" && (
<div className="">
<button
title={t("case:do-you-want-to-delete-case-label")}
className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
onClick={() => {
confirm(
-1
View File
@@ -50,7 +50,6 @@ const TopThree = (props) => {
});
showTopThreeArr.sort(function compare(a, b) {
console.log(a.createdDate, b.createdDate);
var dateA = new Date(a.createdDate);
var dateB = new Date(b.createdDate);
return dateB - dateA;
+4 -1
View File
@@ -743,7 +743,10 @@ const DNSSearchResults = (props) => {
{searchResultsObj["@odata.count"] > 5 && (
<div id="recordCountSelect" className="govuk-grid-row">
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
<label
className="govuk-label-s "
htmlFor="showNumberOfRecords"
>
{t("search:searchresults-show-records-label-a")}
<select
onChange={(e) => {
+1 -1
View File
@@ -810,7 +810,7 @@ const SearchResults = (props) => {
<div className="govuk-form-group">
<label
className="govuk-label-s "
htmlFor="sort"
htmlFor="showNumberOfRecords"
>
{t(
"search:searchresults-show-records-label-a"
+15
View File
@@ -2403,3 +2403,18 @@ fade {
}
.govuk-link.watchCase {
background-color: transparent;
border: none;
cursor: pointer;
&:focus {
background-color: #ffd530 !important;
border-color: transparent !important;
color: #1f1f1f !important;
outline: 2px solid #1f1f1f;
text-decoration: none !important;
box-shadow: none;
}
}