diff options
| author | Jan C. Borchardt <hey@jancborchardt.net> | 2021-04-15 13:22:53 +0200 |
|---|---|---|
| committer | Jan C. Borchardt <hey@jancborchardt.net> | 2021-04-19 21:02:54 +0200 |
| commit | 64e90cdc6685c96f3f490e00f0fd116dabf67753 (patch) | |
| tree | a59a2ebd1bbb7ed4f2e542ea3a87e13c36c1e151 /apps | |
| parent | f86a2239e76e9f4d8bf10a249ac5e0bcf088c9a5 (diff) | |
| download | nextcloud-server-64e90cdc6685c96f3f490e00f0fd116dabf67753.tar.gz nextcloud-server-64e90cdc6685c96f3f490e00f0fd116dabf67753.zip | |
Fix accessibility of profile picture section
Signed-off-by: Jan C. Borchardt <hey@jancborchardt.net>
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/settings/css/settings.scss | 3 | ||||
| -rw-r--r-- | apps/settings/js/settings/personalInfo.js | 7 | ||||
| -rw-r--r-- | apps/settings/templates/settings/personal/personal.info.php | 8 |
3 files changed, 14 insertions, 4 deletions
diff --git a/apps/settings/css/settings.scss b/apps/settings/css/settings.scss index cc798868c53..e5d9071d5e9 100644 --- a/apps/settings/css/settings.scss +++ b/apps/settings/css/settings.scss @@ -55,6 +55,9 @@ input { #uploadavatarbutton, #selectavatar, #removeavatar { padding: 21px; } +#selectavatar, #removeavatar { + vertical-align: top; +} .jcrop-holder { z-index: 500; diff --git a/apps/settings/js/settings/personalInfo.js b/apps/settings/js/settings/personalInfo.js index e71f4840123..f53e120dcf5 100644 --- a/apps/settings/js/settings/personalInfo.js +++ b/apps/settings/js/settings/personalInfo.js @@ -306,6 +306,13 @@ window.addEventListener('DOMContentLoaded', function () { $('#uploadavatar').fileupload(uploadparms); + // Trigger upload action also with keyboard navigation on enter + $('#uploadavatarbutton').on('keyup', function(event) { + if (event.key === ' ' || event.key === 'Enter') { + $('#uploadavatar').trigger('click'); + } + }); + $('#selectavatar').click(function () { OC.dialogs.filepicker( t('settings', "Select a profile picture"), diff --git a/apps/settings/templates/settings/personal/personal.info.php b/apps/settings/templates/settings/personal/personal.info.php index d7505f37522..8bc7d9434a3 100644 --- a/apps/settings/templates/settings/personal/personal.info.php +++ b/apps/settings/templates/settings/personal/personal.info.php @@ -39,7 +39,7 @@ script('settings', [ <div> <form id="avatarform" class="section" method="post" action="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.avatar.postAvatar')); ?>"> <h3> - <label><?php p($l->t('Profile picture')); ?></label> + <?php p($l->t('Profile picture')); ?> <div class="federation-menu" tabindex="0" aria-label="<?php p($l->t('Change privacy level of profile picture')); ?>"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> @@ -50,9 +50,9 @@ script('settings', [ <div class="avatardiv"></div> <div class="warning hidden"></div> <?php if ($_['avatarChangeSupported']): ?> - <label for="uploadavatar" class="inlineblock button icon-upload svg" id="uploadavatarbutton" title="<?php p($l->t('Upload new')); ?>"></label> - <div class="inlineblock button icon-folder svg" id="selectavatar" title="<?php p($l->t('Select from Files')); ?>"></div> - <div class="hidden button icon-delete svg" id="removeavatar" title="<?php p($l->t('Remove image')); ?>"></div> + <label for="uploadavatar" class="inlineblock button icon-upload svg" id="uploadavatarbutton" title="<?php p($l->t('Upload new')); ?>" tabindex="0"></label> + <button class="inlineblock button icon-folder svg" id="selectavatar" title="<?php p($l->t('Select from Files')); ?>"></button> + <button class="hidden button icon-delete svg" id="removeavatar" title="<?php p($l->t('Remove image')); ?>"></button> <input type="file" name="files[]" id="uploadavatar" class="hiddenuploadfield" accept="image/*"> <p><em><?php p($l->t('png or jpg, max. 20 MB')); ?></em></p> <?php else: ?> |