diff --git a/Resources/Private/Language/de.locallang.xlf b/Resources/Private/Language/de.locallang.xlf
index e3503e4d338b484cc00bffedd4670dddced37dae..76684cd2fa4e1238e7dd87a039bfb91fb698236d 100644
--- a/Resources/Private/Language/de.locallang.xlf
+++ b/Resources/Private/Language/de.locallang.xlf
@@ -526,6 +526,10 @@
<source><![CDATA[Vacancies worldwide]]></source>
<target><![CDATA[Offene Stellen weltweit]]></target>
</trans-unit>
+ <trans-unit id="frontend.button.download" resname="frontend.button.download">
+ <source><![CDATA[Download button]]></source>
+ <target><![CDATA[Download Schaltfläche]]></target>
+ </trans-unit>
<trans-unit id="pagebrowser.label" resname="pagebrowser.label" approved="yes">
<source><![CDATA[Jobs pagination]]></source>
<target><![CDATA[Stellen Paginierung]]></target>
diff --git a/Resources/Private/Language/locallang.xlf b/Resources/Private/Language/locallang.xlf
index fdd7432a0dc4de79c6426b37bc889b18248ddd41..6fa35a5feb4eed825cb080b3e9806f488712814e 100644
--- a/Resources/Private/Language/locallang.xlf
+++ b/Resources/Private/Language/locallang.xlf
@@ -336,6 +336,9 @@
<trans-unit id="frontend.filter.countries" resname="frontend.filter.countries">
<source><![CDATA[Country]]></source>
</trans-unit>
+ <trans-unit id="frontend.button.download" resname="frontend.button.download">
+ <source><![CDATA[Download button]]></source>
+ </trans-unit>
<trans-unit id="frontend.filter.countriesfunctions" resname="frontend.filter.countriesfunctions">
<source><![CDATA[Function]]></source>
</trans-unit>
diff --git a/Resources/Private/Partials/Bootstrap5/Filter.html b/Resources/Private/Partials/Bootstrap5/Filter.html
index 7936ab9090a0e18820332ae0634942d3d5c61c08..86da238cb28903a3e2310a27739a1db478aca265 100644
--- a/Resources/Private/Partials/Bootstrap5/Filter.html
+++ b/Resources/Private/Partials/Bootstrap5/Filter.html
@@ -16,7 +16,9 @@
options="{countries}"
prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
prependOptionValue="0"
- id="filter-countries"/>
+ id="filter-countries"
+ additionalAttributes="{autocomplete: 'off'}"
+ />
</div>
<div class="col-md-3 col-sm-6 col-12">
<label for="filter-locations" class="form-label">
@@ -31,7 +33,9 @@
options="{cities}"
prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
prependOptionValue="0"
- id="filter-locations"/>
+ id="filter-locations"
+ additionalAttributes="{autocomplete: 'off'}"
+ />
</div>
<div class="col-md-3 col-sm-6 col-12">
<label for="filter-departments" class="form-label">
@@ -47,7 +51,9 @@
options="{departments}"
prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
prependOptionValue="0"
- id="filter-departments"/>
+ id="filter-departments"
+ additionalAttributes="{autocomplete: 'off'}"
+ />
</div>
<div class="col-md-3 col-sm-6 col-12">
<label for="filter-experienceLevels" class="form-label">
@@ -63,7 +69,9 @@
options="{experienceLevels}"
prependOptionLabel="{f:translate(key: 'frontend.filter.selections.all')}"
prependOptionValue="0"
- id="filter-experienceLevels"/>
+ id="filter-experienceLevels"
+ additionalAttributes="{autocomplete: 'off'}"
+ />
</div>
</div>
<div class="row default-content-element">
diff --git a/Resources/Private/Templates/Bootstrap5/Joblist/ApplyForm.html b/Resources/Private/Templates/Bootstrap5/Joblist/ApplyForm.html
index 4ea85810a632d6d8cea999b4d9a6753dd4820056..390057639a714d03260c4b2569b8ff8f1a714c6b 100644
--- a/Resources/Private/Templates/Bootstrap5/Joblist/ApplyForm.html
+++ b/Resources/Private/Templates/Bootstrap5/Joblist/ApplyForm.html
@@ -25,7 +25,8 @@
<f:if condition="{job.attachment}">
<div class="ms-auto">
<f:link.typolink target="_blank" parameter="{job.attachment.0.originalResource.publicUrl}" class="btn btn-outline-dark" additionalAttributes="{alt: '{f:translate(key: \'frontend.attachment\', extensionName: \'SgJobs\')} (PDF, {job.attachment.0.originalResource.size -> f:format.bytes()})'}">
- <sg:renderSvg name="fontawesome/solid/download" width="20" height="20" color="currentColor" createColorAttribute="TRUE" />
+ <sg:renderSvg name="fontawesome/solid/download" width="20" height="20" color="currentColor" createColorAttribute="TRUE" role="img" aria-label="Download icon"/>
+ <span class="visually-hidden"><f:translate key="frontend.button.download" /></span>
</f:link.typolink>
</div>
</f:if>
@@ -40,7 +41,7 @@
<sg:renderSvg name="fontawesome/solid/clock" width="16"
height="16" color="currentColor"
createColorAttribute="TRUE"
- class="d-inline-block translate-y-px-1" />
+ class="d-inline-block translate-y-px-1" role="presentation" />
<span class="text-muted">
<f:format.raw>
<f:translate key="frontend.jobStart" />
@@ -61,7 +62,7 @@
<sg:renderSvg name="fontawesome/solid/arrow-trend-up" width="16"
height="16" color="currentColor"
createColorAttribute="TRUE"
- class="d-inline-block translate-y-px-1" />
+ class="d-inline-block translate-y-px-1" role="presentation" />
<span class="text-muted">
<strong>
<f:translate key="frontend.experienceLevel" />:
@@ -77,7 +78,7 @@
<sg:renderSvg name="fontawesome/solid/map-location-dot" width="16"
height="16" color="currentColor"
createColorAttribute="TRUE"
- class="d-inline-block translate-y-px-1" />
+ class="d-inline-block translate-y-px-1" role="presentation" />
<f:if condition="!{job.telecommutePossible}">
<f:then>
<span class="text-muted">
@@ -260,53 +261,53 @@
<f:if condition="!{job}">
<div class="col">
<f:render section="formLabel" arguments="{label-for: 'company', label-text: 'company'}" />
- <f:form.select property="company" multiple="0" size="1" id="apply-company" class="form-select" options="{companies}" optionLabelField="city" optionValueField="uid" prependOptionLabel="{f:translate(key:'frontend.apply.country.empty')}" required="required" />
+ <f:form.select property="company" multiple="0" size="1" id="apply-company" class="form-select" options="{companies}" optionLabelField="city" optionValueField="uid" prependOptionLabel="{f:translate(key:'frontend.apply.country.empty')}" required="required" additionalAttributes="{autocomplete: 'off'}" />
<f:render section="formValidation" arguments="{form-field: 'company'}" />
</div>
</f:if>
<div class="col">
<f:render section="formLabel" arguments="{label-for: 'gender', label-text: 'gender'}" />
- <f:form.select property="gender" id="apply-gender" class="form-select" options="{male: '{f:translate(key: \'frontend.apply.gender.male\')}', female: '{f:translate(key: \'frontend.apply.gender.female\')}', other: '{f:translate(key: \'frontend.apply.gender.other\')}'}" />
+ <f:form.select property="gender" id="apply-gender" class="form-select" options="{male: '{f:translate(key: \'frontend.apply.gender.male\')}', female: '{f:translate(key: \'frontend.apply.gender.female\')}', other: '{f:translate(key: \'frontend.apply.gender.other\')}'}" additionalAttributes="{autocomplete: 'off'}" />
<f:render section="formValidation" arguments="{form-field: 'gender'}" />
</div>
</div>
<div class="row">
- <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'firstName', field-text: 'first_name', required: 'required'}" />
- <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'lastName', field-text: 'last_name', required: 'required'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'firstName', field-text: 'first_name', required: 'required', autocomplete: 'given-name'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'lastName', field-text: 'last_name', required: 'required', autocomplete: 'family-name'}" />
</div>
<div class="row">
- <f:render section="formTextField" arguments="{wrapper-class: 'col col-sm-6', field-id: 'street', field-text: 'street', required: 'required'}" />
- <f:render section="formTextField" arguments="{wrapper-class: 'col-6 col-sm-4', field-id: 'city', field-text: 'city', required: 'required'}" />
- <f:render section="formTextField" arguments="{wrapper-class: 'col-6 col-sm-2', field-id: 'zip', field-text: 'zip', required: 'required'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col col-sm-6', field-id: 'street', field-text: 'street', required: 'required', autocomplete: 'street-address'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col-6 col-sm-4', field-id: 'city', field-text: 'city', required: 'required', autocomplete: 'address-level2'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col-6 col-sm-2', field-id: 'zip', field-text: 'zip', required: 'required', autocomplete: 'postal-code'}" />
</div>
<div class="row">
<div class="col">
<f:render section="formLabel" arguments="{label-for: 'country', label-text: 'country'}" />
- <f:form.countrySelect value="DE" property="country" id="apply-country" class="form-select" required="required" />
+ <f:form.countrySelect value="DE" property="country" id="apply-country" class="form-select" required="required" additionalAttributes="{autocomplete: 'off'}" />
<f:render section="formValidation" arguments="{form-field: 'county'}" />
</div>
<div class="col">
<f:render section="formLabel" arguments="{label-for: 'nationality', label-text: 'nationality'}" />
- <f:form.countrySelect value="DE" property="nationality" id="apply-nationality" class="form-select" required="required" />
+ <f:form.countrySelect value="DE" property="nationality" id="apply-nationality" class="form-select" required="required" additionalAttributes="{autocomplete: 'off'}" />
<f:render section="formValidation" arguments="{form-field: 'nationality'}" />
</div>
</div>
<div class="row">
- <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'education', field-text: 'education', required: 'required'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'education', field-text: 'education', required: 'required', autocomplete: 'off'}" />
<div class="col">
<f:render section="formLabel" arguments="{label-for: 'birthDate', label-text: 'birthDate'}" />
- <f:form.textfield type="date" property="birthDate" id="apply-birthDate" class="form-control" placeholder="{f:translate(key:'frontend.apply.birthDate')}" required="required" />
+ <f:form.textfield type="date" property="birthDate" id="apply-birthDate" class="form-control" placeholder="{f:translate(key:'frontend.apply.birthDate')}" required="required" additionalAttributes="{autocomplete: 'off'}" />
<f:render section="formValidation" arguments="{form-field: 'birthDate'}" />
</div>
</div>
<div class="row">
- <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'phone', field-text: 'phone', required: 'required'}" />
- <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'mobile', field-text: 'mobile'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'phone', field-text: 'phone', required: 'required', autocomplete: 'tel'}" />
+ <f:render section="formTextField" arguments="{wrapper-class: 'col', field-id: 'mobile', field-text: 'mobile', autocomplete: 'tel'}" />
</div>
<div class="row">
<div class="col-6">
<f:render section="formLabel" arguments="{label-for: 'email', label-text: 'email'}" />
- <f:form.textfield type="email" property="email" id="apply-email" class="form-control" placeholder="{f:translate(key:'frontend.apply.email')}" required="required" />
+ <f:form.textfield type="email" property="email" id="apply-email" class="form-control" placeholder="{f:translate(key:'frontend.apply.email')}" required="required" additionalAttributes="{autocomplete: 'email'}" />
<f:render section="formValidation" arguments="{form-field: 'email'}" />
</div>
</div>
@@ -388,7 +389,7 @@
<div class="row mb-4">
<div class="col">
<f:render section="formLabel" arguments="{label-for: 'message', label-text: 'message'}" />
- <f:form.textarea class="form-control" rows="10" property="message" id="apply-message" placeholder="{f:translate(key:'frontend.apply.message')}" />
+ <f:form.textarea class="form-control" rows="10" property="message" id="apply-message" placeholder="{f:translate(key:'frontend.apply.message')}" additionalAttributes="{autocomplete: 'on'}" />
</div>
</div>
<div class="form-check mb-4">
@@ -467,7 +468,7 @@
<f:else>
<sg:renderSvg name="fontawesome/solid/user" width="50" height="50"
color="currentColor" createColorAttribute="TRUE"
- class="px-4 py-4 bg-light o-50" />
+ class="px-4 py-4 bg-light o-50" role="img" aria-label="User icon" />
</f:else>
</f:if>
</div>
@@ -486,7 +487,7 @@
<sg:renderSvg name="fontawesome/solid/envelope" width="16"
height="16" color="currentColor"
createColorAttribute="TRUE"
- class="d-inline-block me-2 translate-y-px-1" />
+ class="d-inline-block me-2 translate-y-px-1" role="presentation"/>
<f:format.html parseFuncTSPath="lib.parseFunc">
<a href="mailto:{contact.email}" class="stretched-link">
<f:translate key="frontend.emailContact" />
@@ -522,17 +523,19 @@
<label for="apply-{field-id}" class="form-label">
<f:translate key="frontend.apply.{field-text}" />
</label>
- <f:form.textfield property="{field-id}" id="apply-{field-id}" class="form-control" placeholder="{f:translate(key:'frontend.apply.{field-text}')}" required="{required}" />
+ <f:form.textfield property="{field-id}" id="apply-{field-id}" class="form-control" placeholder="{f:translate(key:'frontend.apply.{field-text}')}" required="{required}" additionalAttributes="{autocomplete: '{autocomplete}'}"/>
<f:render section="formValidation" arguments="{form-field: '{field-id}'}" />
</div>
</f:section>
<f:section name="formValidation">
<f:form.validationResults for="applyData.{form-field}">
- <ul class="text-danger mb-0">
- <f:for each="{validationResults.errors}" as="error">
- <li class="pt-2">{error.message}</li>
- </f:for>
- </ul>
+ <f:if condition="{validationResults.errors}">
+ <ul class="text-danger mb-0">
+ <f:for each="{validationResults.errors}" as="error">
+ <li class="pt-2">{error.message}</li>
+ </f:for>
+ </ul>
+ </f:if>
</f:form.validationResults>
</f:section>