accessibility amends for reps
This commit is contained in:
@@ -489,6 +489,8 @@ let MakeRepresentation = (props) => {
|
||||
? router.query.state == "edit"
|
||||
? props.props.myRepresentations.myRepresentations
|
||||
: props.props.searchResultsObj.searchDetailsObj
|
||||
: props.currentType == "watchedCases"
|
||||
? props.props.watchedCases.watchedCasesDetails
|
||||
: props.props.searchResultsObj.searchDetailsObj;
|
||||
|
||||
router.query.hasOwnProperty("state") &&
|
||||
@@ -751,436 +753,21 @@ let MakeRepresentation = (props) => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{
|
||||
formObj.hasOwnProperty(
|
||||
{formObj.hasOwnProperty(
|
||||
"representationForm"
|
||||
) &&
|
||||
formObj[
|
||||
"representationForm"
|
||||
].hasOwnProperty("values") &&
|
||||
formObj[
|
||||
"representationForm"
|
||||
].values.hasOwnProperty(
|
||||
"representationType"
|
||||
) &&
|
||||
formObj[
|
||||
"representationForm"
|
||||
].hasOwnProperty("values") &&
|
||||
formObj[
|
||||
"representationForm"
|
||||
].values.hasOwnProperty(
|
||||
"representationType"
|
||||
) &&
|
||||
formObj["representationForm"]
|
||||
.values
|
||||
.representationType ==
|
||||
"Questionnaire" &&
|
||||
whichProgress()
|
||||
// <nav
|
||||
// role="navigation"
|
||||
// aria-labelledby="progress-list"
|
||||
// className="at-nav"
|
||||
// >
|
||||
// <div
|
||||
// id="step-by-step-navigation"
|
||||
// data-module="gemstepnav"
|
||||
// className="app-step-nav app-step-nav--active"
|
||||
// data-id="e01e924b-9c7c-4c71-8241-66a575c2f61f"
|
||||
// data-show-text="show"
|
||||
// data-hide-text="hide"
|
||||
// data-show-all-text="Show all"
|
||||
// data-hide-all-text="Hide all"
|
||||
// >
|
||||
// <ol className="app-step-nav__steps">
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 1
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 1
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 1
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:s78-section-heading-one"
|
||||
// )}
|
||||
// aaa
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 2
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 2
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 2
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:s78-section-heading-two"
|
||||
// )}
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 3
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 3
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 3
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:s78-section-heading-three"
|
||||
// )}
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 4
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 4
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 4
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:s78-section-heading-four"
|
||||
// )}
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 5
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 5
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 5
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:s78-section-heading-five"
|
||||
// )}
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>{" "}
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 6
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 6
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 6
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:add-files-label"
|
||||
// )}
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>
|
||||
// <li
|
||||
// className={
|
||||
// "app-step-nav__step js-step app-step-nav__step--active" +
|
||||
// (showQuestionnaireSection >=
|
||||
// 7
|
||||
// ? " sectionComplete"
|
||||
// : " sectionIncomplete")
|
||||
// }
|
||||
// aria-current="step"
|
||||
// data-show=""
|
||||
// id="check-youre-allowed-to-drive"
|
||||
// >
|
||||
// <div
|
||||
// className="app-step-nav__header js-toggle-panel "
|
||||
// data-position="1"
|
||||
// >
|
||||
// <h3 className="app-step-nav__title ">
|
||||
// <span className="app-step-nav__circle app-step-nav__circle--number">
|
||||
// <span className="app-step-nav__circle-inner">
|
||||
// <span className="app-step-nav__circle-background">
|
||||
// <span className="app-step-nav__circle-step-label govuk-visually-hidden">
|
||||
// Step
|
||||
// </span>{" "}
|
||||
// 7
|
||||
// <span
|
||||
// className="app-step-nav__circle-step-colon govuk-visually-hidden"
|
||||
// aria-hidden="true"
|
||||
// >
|
||||
// :
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
// </span>
|
||||
|
||||
// <span className="js-step-title">
|
||||
// <a
|
||||
// href="#"
|
||||
// onClick={() => {
|
||||
// setShowQuestionnaireSection(
|
||||
// 7
|
||||
// );
|
||||
// }}
|
||||
// className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
// aria-expanded="false"
|
||||
// aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
// >
|
||||
// <span className="js-step-title-text govuk-!-font-size-16">
|
||||
// {t(
|
||||
// "myrepresentations:s78-section-heading-seven"
|
||||
// )}
|
||||
// </span>
|
||||
// </a>
|
||||
// </span>
|
||||
// </h3>
|
||||
// </div>
|
||||
// </li>
|
||||
// </ol>
|
||||
// </div>
|
||||
// </nav>
|
||||
}
|
||||
formObj["representationForm"].values
|
||||
.representationType ==
|
||||
"Questionnaire" &&
|
||||
whichProgress()}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -491,14 +491,11 @@ export const RenderPickList = ({
|
||||
: "govuk-form-group "
|
||||
}
|
||||
>
|
||||
<label className="govuk-label" htmlFor="sort">
|
||||
<label className="govuk-label" htmlFor={datafieldname}>
|
||||
{label}
|
||||
</label>
|
||||
{touched && error && (
|
||||
<span
|
||||
id="passport-issued-error"
|
||||
className="govuk-error-message"
|
||||
>
|
||||
<span id={name + "-error"} className="govuk-error-message">
|
||||
<span className="govuk-visually-hidden">Error:</span>{" "}
|
||||
{errorMsg}
|
||||
</span>
|
||||
@@ -508,8 +505,8 @@ export const RenderPickList = ({
|
||||
<select
|
||||
{...input}
|
||||
className="govuk-select "
|
||||
id={name}
|
||||
name={name}
|
||||
id={datafieldname}
|
||||
name={datafieldname}
|
||||
>
|
||||
<option>Select...</option>
|
||||
{Object.keys(optionsArr).map((key, index) => {
|
||||
@@ -793,11 +790,9 @@ export function MultiLinefield(props) {
|
||||
|
||||
return (
|
||||
<div className="govuk-form-group">
|
||||
<h1 className="govuk-label-wrapper">
|
||||
<label className="govuk-label" htmlFor={props.name}>
|
||||
{props.label}
|
||||
</label>
|
||||
</h1>
|
||||
<label className="govuk-label" htmlFor={props.name}>
|
||||
{props.label}
|
||||
</label>
|
||||
<div
|
||||
id={props.name + "-hint"}
|
||||
className="govuk-hint govuk-!-font-size-14"
|
||||
|
||||
+100
-23
@@ -38,11 +38,7 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<nav
|
||||
role="navigation"
|
||||
aria-labelledby="progress-list"
|
||||
className="at-nav"
|
||||
>
|
||||
<nav role="navigation" aria-label="progress-list" className="at-nav">
|
||||
<div
|
||||
id="step-by-step-navigation"
|
||||
data-module="gemstepnav"
|
||||
@@ -63,7 +59,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-one")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -95,7 +93,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-one"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -116,7 +121,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-two")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -148,7 +155,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-two"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -169,7 +183,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-three")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -201,7 +217,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-three"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -222,7 +245,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-four")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -254,7 +279,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-four"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -275,7 +307,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-five")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -307,7 +341,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-five"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -328,7 +369,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-six")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -360,7 +403,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-six"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -381,7 +431,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-seven")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -413,7 +465,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-seven"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -434,7 +493,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:add-files-label")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -466,7 +527,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:add-files-label"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -487,7 +555,9 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:enf-section-heading-eight")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -519,7 +589,14 @@ const RepresentationProgress_enforcement = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:enf-section-heading-eight"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
|
||||
+80
-21
@@ -39,11 +39,7 @@ const RepresentationProgress_s78 = (props) => {
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<nav
|
||||
role="navigation"
|
||||
aria-labelledby="progress-list"
|
||||
className="at-nav"
|
||||
>
|
||||
<nav role="navigation" aria-label="progress-list" className="at-nav">
|
||||
<div
|
||||
id="step-by-step-navigation"
|
||||
data-module="gemstepnav"
|
||||
@@ -64,7 +60,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-one")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -96,7 +94,14 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-one"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -117,7 +122,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-two")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -149,7 +156,14 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-two"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -170,7 +184,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-three")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -202,7 +218,14 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-three"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -223,7 +246,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-four")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -255,7 +280,14 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-four"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
@@ -276,7 +308,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-five")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -308,11 +342,18 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-five"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
"myrepresentations:s78-section-heading-five"
|
||||
"myrepresentations:s78-section-heading-three"
|
||||
)}
|
||||
</span>
|
||||
</a>
|
||||
@@ -329,7 +370,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-six")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -361,11 +404,18 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-six"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
"myrepresentations:add-files-label"
|
||||
"myrepresentations:s78-section-heading-six"
|
||||
)}
|
||||
</span>
|
||||
</a>
|
||||
@@ -382,7 +432,9 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}
|
||||
aria-current="step"
|
||||
data-show=""
|
||||
id="check-youre-allowed-to-drive"
|
||||
id={t("myrepresentations:s78-section-heading-seven")
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()}
|
||||
>
|
||||
<div
|
||||
className="app-step-nav__header js-toggle-panel "
|
||||
@@ -414,7 +466,14 @@ const RepresentationProgress_s78 = (props) => {
|
||||
}}
|
||||
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
|
||||
aria-expanded="false"
|
||||
aria-controls="step-panel-check-youre-allowed-to-drive-1"
|
||||
aria-controls={
|
||||
"step-panel-" +
|
||||
t(
|
||||
"myrepresentations:s78-section-heading-seven"
|
||||
)
|
||||
.replace(/\s+/g, "-")
|
||||
.toLowerCase()
|
||||
}
|
||||
>
|
||||
<span className="js-step-title-text govuk-!-font-size-16">
|
||||
{t(
|
||||
|
||||
Reference in New Issue
Block a user