Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update image and text on doc upload instructions page. #285

Merged
merged 2 commits into from
Jun 13, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/main/resources/messages.properties
Original file line number Diff line number Diff line change
Expand Up @@ -138,8 +138,8 @@ offboarding-information.continue-text=Ok, next

# How to add documents
how-to-add-documents.title=How to add documents
how-to-add-documents.header=How to add documents
how-to-add-documents.take-photos=Take photos on your phone
how-to-add-documents.header=Ways to add documents
how-to-add-documents.take-photos=Take photos with a phone, a tablet or other mobile device
how-to-add-documents.select-files=Select files stored on your device
how-to-add-documents.take-screenshot=Take a screenshot on your device
how-to-add-documents.you-can-upload=You can upload <b>up to {0} files</b>.
Expand Down
37 changes: 37 additions & 0 deletions src/main/resources/templates/fragments/icons.html
Original file line number Diff line number Diff line change
Expand Up @@ -2201,6 +2201,43 @@ <h1>Icons</h1>
</svg>
</td>
</tr>
<tr>
<td>personalDevices</td>
<td>
<svg th:fragment="personalDevices" aria-hidden="true" width="179" height="178" viewBox="0 0 179 178" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M82.1847 150.572C62.0872 148.724 40.0118 149.744 26.9712 134.423C13.5995 118.713 14.5039 96.3787 18.9472 76.2752C23.4466 55.9175 32.9763 36.8304 50.921 26.0629C71.2163 13.8851 96.5594 6.61065 117.879 16.9124C139.139 27.1855 145.833 52.0813 151.827 74.8213C158.184 98.937 168.796 127.511 151.881 145.91C135.35 163.891 106.578 152.815 82.1847 150.572Z" fill="#F8C441"/>
<rect x="36" y="23" width="106" height="85" fill="white"/>
<rect x="105" y="91" width="46" height="62" fill="white"/>
<path d="M117.6 112.407H143.999" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M108 130.845L144 130.845" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M108 122.329L144 122.329" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M108 139.359L144 139.359" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M112.331 111.334H108V115.747H112.331V111.334Z" fill="#FFF5FF" stroke="#121111" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M117.6 100.433H143.999" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M112.331 98H108V102.413H112.331V98Z" fill="#FFF5FF" stroke="#121111" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M158.475 104.076H130.743C129.497 104.076 128.518 105.055 128.518 106.301V157.992C128.518 159.203 129.479 160.182 130.671 160.217L150.376 160.218H150.411H158.475C159.685 160.218 160.7 159.239 160.7 157.993L160.7 106.302C160.7 105.055 159.686 104.077 158.475 104.077L158.475 104.076ZM146.976 157.494H142.206C141.672 157.494 141.245 157.084 141.245 156.533C141.245 156.016 141.654 155.571 142.206 155.571H146.976C147.51 155.571 147.937 156.016 147.937 156.533C147.937 157.084 147.51 157.494 146.976 157.494ZM157.371 152.385H131.828V109.825H157.371V152.385Z" fill="#00223D"/>
<path d="M126.614 152.427H105.236V91.4082H149.897V102.177H154.062V87.3145C154.062 85.2853 152.406 83.6299 150.377 83.6299H140.587L104.757 83.6305C102.657 83.6305 101.037 85.2506 101.037 87.3151V156.486C101.037 158.551 102.728 160.206 104.757 160.206H127.345C126.9 159.565 126.615 158.835 126.615 157.981L126.614 152.427ZM122.396 86.2284H132.756C133.272 86.2284 133.717 86.638 133.717 87.1897C133.717 87.2609 133.717 87.3496 133.681 87.4035L132.346 88.1336H122.397C121.862 88.1336 121.435 87.7239 121.435 87.1723C121.435 86.6201 121.862 86.2284 122.396 86.2284Z" fill="#00223D"/>
<path d="M18.3008 135.013C18.3008 139.748 22.1459 143.593 26.8804 143.593H99.1484V133.108H18.3008V135.013Z" fill="#00223D"/>
<path d="M19.1016 131.203H99.1482V128.123L30.28 128.124C29.9242 128.124 29.6212 127.928 29.4612 127.644C29.2654 127.323 29.3013 126.95 29.4966 126.664L36.5633 115.699C36.8484 115.254 37.418 115.13 37.863 115.414C38.308 115.699 38.4326 116.269 38.1481 116.714L32.0247 126.219H99.1485L99.1479 113.029H30.7959L19.1016 131.203Z" fill="#00223D"/>
<path d="M36.6354 23.1931H142.35V81.7016H147.743V23.1931C147.743 20.2027 145.322 17.7998 142.35 17.7998H36.6354C33.645 17.7998 31.2422 20.2206 31.2422 23.1931V111.125H99.1492L99.1486 105.732H36.635L36.6354 23.1931Z" fill="#00223D"/>
<path d="M69.4004 50.4072H109" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M55 68.8447L108.999 68.8447" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M55 60.3291L108.999 60.3291" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M55 77.3594L108.999 77.3594" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M61.4963 49.334H55V53.7468H61.4963V49.334Z" fill="#FFF5FF" stroke="#121111" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M69.4004 38.4326H109" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M61.4963 36H55V40.4128H61.4963V36Z" fill="#FFF5FF" stroke="#121111" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<rect x="131" y="109" width="27" height="44" fill="white"/>
<path d="M143 125H155" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M135 139H155" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M135 133H155" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M135 145H155" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M138.609 124.631H135V127.818H138.609V124.631Z" fill="#FFF5FF" stroke="#121111" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M143 117H155" stroke="#121111" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M138.609 115H135V118.187H138.609V115Z" fill="#FFF5FF" stroke="#121111" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</td>
</tr>
</tbody>
</table>
</article>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,34 +12,37 @@
maxSize=${@environment.getProperty('form-flow.uploads.max-file-size')}">
<th:block
th:replace="~{fragments/cardHeader :: cardHeader(header=#{how-to-add-documents.header})}"/>
<th:block th:replace="~{fragments/form :: form(action=${formAction}, content=~{::formContent})}">
<th:block th:ref="formContent">
<div class="form-card__content">
<div class="center">
<th:block th:replace="~{fragments/icons :: takingPicWithPhone}"></th:block>
</div>
<ul class="list--bulleted">
<li th:text="#{how-to-add-documents.take-photos}"></li>
<li th:text="#{how-to-add-documents.select-files}"></li>
<li th:text="#{how-to-add-documents.take-screenshot}"></li>
</ul>
<span class="spacing-left-1_5" th:utext="${#messages.msg('how-to-add-documents.you-can-upload', maxFiles)}"></span>
<br/>
<span class="spacing-left-1_5" th:utext="${#messages.msg('how-to-add-documents.each-file', maxSize)}"></span>
</div>
<div class="form-card__footer">
<th:block th:replace="~{fragments/inputs/yesOrNo :: yesOrNo(
<th:block
th:replace="~{fragments/form :: form(action=${formAction}, content=~{::formContent})}">
<th:block th:ref="formContent">
<div class="form-card__content">
<div class="center">
<th:block th:replace="~{fragments/icons :: personalDevices}"></th:block>
</div>
<ul class="list--bulleted">
<li th:text="#{how-to-add-documents.take-photos}"></li>
<li th:text="#{how-to-add-documents.select-files}"></li>
<li th:text="#{how-to-add-documents.take-screenshot}"></li>
</ul>
<span class="spacing-left-1_5"
th:utext="${#messages.msg('how-to-add-documents.you-can-upload', maxFiles)}"></span>
<br/>
<span class="spacing-left-1_5"
th:utext="${#messages.msg('how-to-add-documents.each-file', maxSize)}"></span>
</div>
<div class="form-card__footer">
<th:block th:replace="~{fragments/inputs/yesOrNo :: yesOrNo(
inputName='addDocuments',
ariaDescribe='header',
overrideNoText=#{doc-upload-instructions.skip-documents},
overrideYesText=#{doc-upload-instructions.add-documents})}"/>
</div>
</th:block>
</div>
</th:block>
</th:block>
</main>
</div>
</section>
</div>
<th:block th:replace="~{fragments/footer :: footer}" />
<th:block th:replace="~{fragments/footer :: footer}"/>
</body>
</html>
Loading