diff --git a/settings/css/settings.css b/settings/css/settings.css
index 3e5c8d1fcf8fc11691d1d544f7e1e9b69d2114a8..395423c3bce31b202ef0429d67fae53106aa62cd 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 ad0ccaec13dd78b66ad1b94da22ec197d1ad2eb4..b67211b274a95b224f21236dbf5db86754496046 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 cc30acfa025befb8fb826b10f6ac65ac2f77926b..919fd13efe63f3542557f0a9346db3b08dac493d 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" />