Improve 2FA login screens

* Show icon if no provider is available
* Reduce shown text if no provider available
* Fix login button icons
* Make backup codes button primary if the only options to log in

Signed-off-by: Christoph Wurst <christoph@winzerhof-wurst.at>
This commit is contained in:
Christoph Wurst 2018-10-03 22:16:54 +02:00
parent 67d04f2d57
commit ae2cd50427
3 changed files with 72 additions and 82 deletions

Binary file not shown.

View File

@ -1,68 +1,66 @@
<div class="warning">
<?php
$noProviders = empty($_['providers']);
?>
<div class="body-login-container update">
<h2 class="two-factor-header"><?php p($l->t('Two-factor authentication')) ?></h2>
<?php if (!$noProviders): ?>
<p><?php p($l->t('Enhanced security is enabled for your account. Choose a second factor for authentication:')) ?></p>
<?php endif ?>
<?php if ($_['providerMissing']): ?>
<p>
<strong><?php p($l->t('Could not load at least one of your enabled two-factor auth methods. Please contact your admin.')) ?></strong>
</p>
<?php endif; ?>
<?php if ($noProviders): ?>
<img class="two-factor-icon" src="<?php p(image_path('core', 'actions/password-white.svg')) ?>" alt="" />
<p>
<ul>
<?php if (empty($_['providers'])): ?>
<p>
<?php if (is_null($_['backupProvider'])): ?>
<strong><?php p($l->t('Two-factor authentication is enforced but has not been configured on your account. Contact your admin for assistance.')) ?></strong>
<?php else: ?>
<strong><?php p($l->t('Two-factor authentication is enforced but has not been configured on your account. Use one of your backup codes to log in or contact your admin for assistance.')) ?></strong>
<?php endif; ?>
</p>
<?php else: ?>
<?php foreach ($_['providers'] as $provider): ?>
<li>
<a class="two-factor-provider"
href="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.TwoFactorChallenge.showChallenge',
[
'challengeProviderId' => $provider->getId(),
'redirect_url' => $_['redirect_url'],
]
)) ?>">
<?php
if ($provider instanceof \OCP\Authentication\TwoFactorAuth\IProvidesIcons) {
$icon = $provider->getLightIcon();
} else {
$icon = image_path('core', 'actions/password-white.svg');
}
?>
<img src="<?php p($icon) ?>" alt="" />
<div>
<h3><?php p($provider->getDisplayName()) ?></h3>
<p><?php p($provider->getDescription()) ?></p>
</div>
</a>
</li>
<?php endforeach; ?>
<?php endif ?>
<?php if (!is_null($_['backupProvider'])): ?>
<li>
<a class="two-factor-provider two-factor-secondary" href="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.TwoFactorChallenge.showChallenge',
[
'challengeProviderId' => $_['backupProvider']->getId(),
'redirect_url' => $_['redirect_url'],
]
)) ?>">
<div>
<p><?php p($l->t('Use backup code')) ?></p>
</div>
</a>
</li>
<?php endif; ?>
<li>
<a class="two-factor-provider two-factor-secondary" href="<?php print_unescaped($_['logout_url']); ?>">
<div>
<p><?php p($l->t('Cancel log in')) ?></p>
</div>
</a>
</li>
</ul>
<?php if (is_null($_['backupProvider'])): ?>
<strong><?php p($l->t('Two-factor authentication is enforced but has not been configured on your account. Contact your admin for assistance.')) ?></strong>
<?php else: ?>
<strong><?php p($l->t('Two-factor authentication is enforced but has not been configured on your account. Use one of your backup codes to log in or contact your admin for assistance.')) ?></strong>
<?php endif; ?>
</p>
<?php else: ?>
<ul>
<?php foreach ($_['providers'] as $provider): ?>
<li>
<a class="two-factor-provider"
href="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.TwoFactorChallenge.showChallenge',
[
'challengeProviderId' => $provider->getId(),
'redirect_url' => $_['redirect_url'],
]
)) ?>">
<?php
if ($provider instanceof \OCP\Authentication\TwoFactorAuth\IProvidesIcons) {
$icon = $provider->getLightIcon();
} else {
$icon = image_path('core', 'actions/password-white.svg');
}
?>
<img src="<?php p($icon) ?>" alt="" />
<div>
<h3><?php p($provider->getDisplayName()) ?></h3>
<p><?php p($provider->getDescription()) ?></p>
</div>
</a>
</li>
<?php endforeach; ?>
</ul>
<?php endif ?>
<?php if (!is_null($_['backupProvider'])): ?>
<p>
<a class="<?php if($noProviders): ?>button primary two-factor-primary<?php else: ?>two-factor-secondary<?php endif ?>" href="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.TwoFactorChallenge.showChallenge',
[
'challengeProviderId' => $_['backupProvider']->getId(),
'redirect_url' => $_['redirect_url'],
]
)) ?>">
<?php p($l->t('Use backup code')) ?>
</a>
</p>
<?php endif; ?>
<p><a class="two-factor-secondary" href="<?php print_unescaped($_['logout_url']); ?>">
<?php p($l->t('Cancel log in')) ?>
</a></p>
</div>

View File

@ -11,7 +11,7 @@ $provider = $_['provider'];
$template = $_['template'];
?>
<div class="warning">
<div class="body-login-container update">
<h2 class="two-factor-header"><?php p($provider->getDisplayName()); ?></h2>
<?php if ($error): ?>
<?php if($error_message): ?>
@ -21,27 +21,19 @@ $template = $_['template'];
<?php endif; ?>
<?php endif; ?>
<?php print_unescaped($template); ?>
<ul>
<?php if (!is_null($_['backupProvider'])): ?>
<li>
<a class="two-factor-provider two-factor-secondary" href="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.TwoFactorChallenge.showChallenge',
[
'challengeProviderId' => $_['backupProvider']->getId(),
'redirect_url' => $_['redirect_url'],
]
)) ?>">
<div>
<p><?php p($l->t('Use backup code')) ?></p>
</div>
</a>
</li>
<?php endif; ?>
<li>
<a class="two-factor-provider two-factor-secondary" href="<?php print_unescaped($_['logout_url']); ?>">
<div>
<p><?php p($l->t('Cancel log in')) ?></p>
</div>
</a>
</li>
</ul>
<?php if (!is_null($_['backupProvider'])): ?>
<p>
<a class="two-factor-secondary" href="<?php p(\OC::$server->getURLGenerator()->linkToRoute('core.TwoFactorChallenge.showChallenge',
[
'challengeProviderId' => $_['backupProvider']->getId(),
'redirect_url' => $_['redirect_url'],
]
)) ?>">
<?php p($l->t('Use backup code')) ?>
</a>
</p>
<?php endif; ?>
<p><a class="two-factor-secondary" href="<?php print_unescaped($_['logout_url']); ?>">
<?php p($l->t('Cancel log in')) ?>
</a></p>
</div>