diff options
| author | Christoph Wurst <christoph@winzerhof-wurst.at> | 2019-03-22 11:51:48 +0100 |
|---|---|---|
| committer | Christoph Wurst <christoph@winzerhof-wurst.at> | 2019-03-22 11:51:48 +0100 |
| commit | f127de0ab2bf94c985a173ae21c99d9c72b8f858 (patch) | |
| tree | 5f615d3284407505835393a98021f67ad0cdd47a | |
| parent | b1b2378758a5e855143286a9126b4b92b81a3afc (diff) | |
| download | nextcloud-server-f127de0ab2bf94c985a173ae21c99d9c72b8f858.tar.gz nextcloud-server-f127de0ab2bf94c985a173ae21c99d9c72b8f858.zip | |
Fix tabindex and meno open/close via keyboard on fed scope menu
Signed-off-by: Christoph Wurst <christoph@winzerhof-wurst.at>
| -rw-r--r-- | settings/css/settings.scss | 5 | ||||
| -rw-r--r-- | settings/js/federationsettingsview.js | 10 | ||||
| -rw-r--r-- | settings/templates/settings/personal/personal.info.php | 14 |
3 files changed, 22 insertions, 7 deletions
diff --git a/settings/css/settings.scss b/settings/css/settings.scss index 42d6f285aac..8d38e71460f 100644 --- a/settings/css/settings.scss +++ b/settings/css/settings.scss @@ -300,6 +300,11 @@ select { position: relative; cursor: pointer; margin-left: 10px; + &:focus { + .icon-federation-menu { + opacity: 0.7; + } + } .icon-federation-menu { padding-left: 16px; background-size: 16px; diff --git a/settings/js/federationsettingsview.js b/settings/js/federationsettingsview.js index e2781833ed7..9cefaf132f2 100644 --- a/settings/js/federationsettingsview.js +++ b/settings/js/federationsettingsview.js @@ -70,6 +70,16 @@ }); $icon.append(scopeMenu.$el); $icon.on('click', _.bind(scopeMenu.show, scopeMenu)); + $icon.on('keydown', function(e) { + if (e.keyCode === 32) { + // Open the menu when the user presses the space bar + e.preventDefault(); + scopeMenu.show(e); + } else if (e.keyCode === 27) { + // Close the menu again if opened + OC.hideMenus(); + } + }.bind(this)); // Restore initial state self._setFieldScopeIcon(field, self._config.get(field + 'Scope')); diff --git a/settings/templates/settings/personal/personal.info.php b/settings/templates/settings/personal/personal.info.php index d873f6821b8..b1ad66d100d 100644 --- a/settings/templates/settings/personal/personal.info.php +++ b/settings/templates/settings/personal/personal.info.php @@ -40,7 +40,7 @@ script('settings', [ <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> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> @@ -102,7 +102,7 @@ script('settings', [ <form id="displaynameform" class="section"> <h3> <label for="displayname"><?php p($l->t('Full name')); ?></label> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> @@ -126,7 +126,7 @@ script('settings', [ <form id="emailform" class="section"> <h3> <label for="email"><?php p($l->t('Email')); ?></label> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> @@ -169,7 +169,7 @@ script('settings', [ <form id="phoneform" class="section"> <h3> <label for="phone"><?php p($l->t('Phone number')); ?></label> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> @@ -191,7 +191,7 @@ script('settings', [ <form id="addressform" class="section"> <h3> <label for="address"><?php p($l->t('Address')); ?></label> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> @@ -213,7 +213,7 @@ script('settings', [ <form id="websiteform" class="section"> <h3> <label for="website"><?php p($l->t('Website')); ?></label> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> @@ -262,7 +262,7 @@ script('settings', [ <form id="twitterform" class="section"> <h3> <label for="twitter"><?php p($l->t('Twitter')); ?></label> - <div class="federation-menu"> + <div class="federation-menu" tabindex="0"> <span class="icon-federation-menu icon-password"> <span class="icon-triangle-s"></span> </span> |