robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Accessibility amends for new appeal

Browse Source
This commit is contained in:
robbond
2024-02-19 16:53:58 +00:00
parent cb5280b525
commit 114f57aa5d
3 changed files with 22 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/newappeal/aboutyou.js
+5 -20
View File
@@ -95,6 +95,7 @@ const RenderMultiline = ({
</span> </span>
)} )}
<textarea <textarea
id={id}
{...input} {...input}
rows={rows} rows={rows}
className={className} className={className}
@@ -124,17 +125,9 @@ const RenderYesNo = ({
: "govuk-form-group " : "govuk-form-group "
} }
> >
<fieldset <fieldset className="govuk-fieldset">
className="govuk-fieldset"
aria-describedby={name + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular"> <legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label {label}
className="govuk-fieldset__heading govuk-body-m"
id={id + "_label"}
>
{label}
</label>
</legend> </legend>
{touched && error && ( {touched && error && (
<span <span
@@ -200,17 +193,9 @@ const RenderRadio = ({
: "govuk-form-group " : "govuk-form-group "
} }
> >
<fieldset <fieldset className="govuk-fieldset">
className="govuk-fieldset"
aria-describedby={datafieldname + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular"> <legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label {label}
className="govuk-fieldset__heading govuk-body-m"
id={id + "_label"}
>
{label}
</label>
</legend> </legend>
{touched && error && ( {touched && error && (
<span <span
components/newappeal/buildprogress.js
+13 -4
View File
@@ -37,7 +37,7 @@ const BuildProgress = (props) => {
<> <>
<nav <nav
role="navigation" role="navigation"
aria-labelledby="progress-list" aria-label="progress-list"
className="at-nav" className="at-nav"
> >
<h2 className="govuk-heading-s govuk-!-font-weight-bold gov-font-dark-grey progress-heading"> <h2 className="govuk-heading-s govuk-!-font-weight-bold gov-font-dark-grey progress-heading">
@@ -71,7 +71,9 @@ const BuildProgress = (props) => {
} }
aria-current="step" aria-current="step"
data-show="" data-show=""
id="check-youre-allowed-to-drive" id={FieldsTranslations(progObj[index].title)
.replace(/\s+/g, "-")
.toLowerCase()}
> >
<div <div
className="app-step-nav__header js-toggle-panel " className="app-step-nav__header js-toggle-panel "
@@ -105,12 +107,19 @@ const BuildProgress = (props) => {
}} }}
className="app-step-nav__button app-step-nav__button--title js-step-title-button" className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false" aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1" aria-controls={
"step-panel-" +
FieldsTranslations(
progObj[index].title
)
.replace(/\s+/g, "-")
.toLowerCase()
}
> >
<span className="js-step-title-text govuk-!-font-size-16"> <span className="js-step-title-text govuk-!-font-size-16">
{FieldsTranslations( {FieldsTranslations(
progObj[index].title progObj[index].title
)} )}{" "}
</span> </span>
</a> </a>
</span> </span>
components/newappeal/createCase.js
+4 -4
View File
@@ -67,12 +67,12 @@ let CreateCase = (props) => {
} }
> >
{" "} {" "}
<label className="govuk-label" htmlFor="sort"> <label className="govuk-label" htmlFor="lpatypes">
{label} {label}
</label> </label>
{touched && error && ( {touched && error && (
<span <span
id="passport-issued-error" id={name + "-error"}
className="govuk-error-message" className="govuk-error-message"
> >
<span className="govuk-visually-hidden"> <span className="govuk-visually-hidden">
@@ -136,12 +136,12 @@ let CreateCase = (props) => {
: "govuk-form-group " : "govuk-form-group "
} }
> >
<label className="govuk-label" htmlFor="sort"> <label className="govuk-label" htmlFor="appealTypes">
{label} {label}
</label> </label>
{touched && error && ( {touched && error && (
<span <span
id="passport-issued-error" id={name + "-error"}
className="govuk-error-message" className="govuk-error-message"
> >
<span className="govuk-visually-hidden"> <span className="govuk-visually-hidden">