diff options
| -rw-r--r-- | settings/css/settings.css | 39 | ||||
| -rw-r--r-- | settings/js/personal.js | 4 | ||||
| -rw-r--r-- | settings/templates/personal.php | 26 |
3 files changed, 19 insertions, 50 deletions
diff --git a/settings/css/settings.css b/settings/css/settings.css index 3e5c8d1fcf8..395423c3bce 100644 --- a/settings/css/settings.css +++ b/settings/css/settings.css @@ -141,10 +141,10 @@ input#openid, input#webdav { width:20em; } #personal-settings-container .verify { float: right; - padding-top: 10px; } #personal-settings-container .verify-action { + padding: 10px; cursor: pointer; } @@ -1030,47 +1030,16 @@ doesnotexist:-o-prefocus, .strengthify-wrapper { /* verify accounts */ #verification-dialog { - display: none; /* Hidden by default */ - position: fixed; /* Stay in place */ - z-index: 1; /* Sit on top */ - left: 0; - top: 0; - width: 100%; /* Full width */ - height: 100%; /* Full height */ - overflow: auto; /* Enable scroll if needed */ - background-color: rgb(0,0,0); /* Fallback color */ - background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ -} - -.verification-dialog-content { - background-color: #fefefe; - margin: 15% auto; /* 15% from the top and centered */ - padding: 20px; - border: 1px solid #888; - width: 60%; /* Could be more or less, depending on screen size */ -} - -#verify-dialog-close { - float: right; - width: 34px; - border: none; - background-color: transparent; - margin: 0 !important; - border-radius: 0; right: 0; - opacity: 0.3; + top: 0; } -#verify-dialog-close:hover { - cursor: pointer; - opacity: 1; +#verification-dialog p { + padding: 10px; } #verification-dialog .verificationCode { font-family: monospace; white-space: nowrap; display: block; - overflow-y: scroll; - padding: 10px; - margin: 20px 20px 20px 0; } diff --git a/settings/js/personal.js b/settings/js/personal.js index ad0ccaec13d..b67211b274a 100644 --- a/settings/js/personal.js +++ b/settings/js/personal.js @@ -203,8 +203,8 @@ $(document).ready(function () { var showVerifyDialog = function(howToVerify, verificationCode) { var dialog = document.getElementById('verification-dialog'); - $(".verification-dialog-content span.explainVerification").text(howToVerify); - $(".verification-dialog-content span.verificationCode").text(verificationCode); + $(".verification-dialog-content .explainVerification").text(howToVerify); + $(".verification-dialog-content .verificationCode").text(verificationCode); dialog.style.display = "block"; }; diff --git a/settings/templates/personal.php b/settings/templates/personal.php index cc30acfa025..919fd13efe6 100644 --- a/settings/templates/personal.php +++ b/settings/templates/personal.php @@ -8,13 +8,12 @@ /** @var \OCP\Defaults $theme */ ?> -<div id="verification-dialog"> +<div id="verification-dialog" class="popovermenu bubble menu hidden"> <!-- dialog used to verify personal information such as the users website, email address, etc --> <div class="verification-dialog-content"> - <button id="verify-dialog-close" class="icon-close svg"></button> - <span class="explainVerification">How to verify your account details</span><br /> - <span class="verificationCode">verification code</span> + <p class="explainVerification">How to verify your account details</p> + <p class="verificationCode">Verification code</p> <p>It can take up to 24 hours before the account is displayed as verified.</p> </div> @@ -111,11 +110,11 @@ <label for="email"><?php p($l->t('Email')); ?></label> <span class="icon-password"/> </h2> - <span class="verify"> - <img id="verify-email" <?php + <div class="verify"> + <img id="verify-email" class="verify-action" <?php switch($_['emailVerification']) { case \OC\Accounts\AccountManager::VERIFICATION_IN_PROGRESS: - print_unescaped('src="' . image_path('core', 'actions/verifying.svg') . '" title="Verifying..."'); + print_unescaped('src="' . image_path('core', 'actions/verifying.svg') . '" title="Verifying …"'); break; case \OC\Accounts\AccountManager::VERIFIED: print_unescaped('src="' . image_path('core', 'actions/verified.svg') . '" title="Verified"'); @@ -124,7 +123,7 @@ print_unescaped('src="' . image_path('core', 'actions/verify.svg') . '" title="Verify"'); } ?>> - </span> + </div> <input type="email" name="email" id="email" value="<?php p($_['email']); ?>" <?php if(!$_['displayNameChangeSupported']) { print_unescaped('class="hidden"'); } ?> placeholder="<?php p($l->t('Your email address')); ?>" @@ -177,11 +176,11 @@ <label for="website"><?php p($l->t('Website')); ?></label> <span class="icon-password"/> </h2> - <span class="verify"> + <div class="verify"> <img id="verify-website" <?php switch($_['websiteVerification']) { case \OC\Accounts\AccountManager::VERIFICATION_IN_PROGRESS: - print_unescaped('src="' . image_path('core', 'actions/verifying.svg') . '" title="Verifying..."'); + print_unescaped('src="' . image_path('core', 'actions/verifying.svg') . '" title="Verifying …"'); break; case \OC\Accounts\AccountManager::VERIFIED: print_unescaped('src="' . image_path('core', 'actions/verified.svg') . '" title="Verified"'); @@ -190,7 +189,7 @@ print_unescaped('src="' . image_path('core', 'actions/verify.svg') . '" title="Verify" class="verify-action"'); } ?>> - </span> + </div> <input type="text" name="website" id="website" value="<?php p($_['website']); ?>" placeholder="<?php p($l->t('Your website')); ?>" autocomplete="on" autocapitalize="none" autocorrect="off" /> @@ -204,11 +203,11 @@ <label for="twitter"><?php p($l->t('Twitter')); ?></label> <span class="icon-password"/> </h2> - <span class="verify"> + <div class="verify"> <img id="verify-twitter" <?php switch($_['twitterVerification']) { case \OC\Accounts\AccountManager::VERIFICATION_IN_PROGRESS: - print_unescaped('src="' . image_path('core', 'actions/verifying.svg') . '" title="Verifying..."'); + print_unescaped('src="' . image_path('core', 'actions/verifying.svg') . '" title="Verifying …"'); break; case \OC\Accounts\AccountManager::VERIFIED: print_unescaped('src="' . image_path('core', 'actions/verified.svg') . '" title="Verified"'); @@ -217,6 +216,7 @@ print_unescaped('src="' . image_path('core', 'actions/verify.svg') . '" title="Verify" class="verify-action"'); } ?>> + </div> <input type="text" name="twitter" id="twitter" value="<?php p($_['twitter']); ?>" placeholder="<?php p($l->t('Your Twitter handle')); ?>" autocomplete="on" autocapitalize="none" autocorrect="off" /> |