Commit f43870ff authored by jbuechele's avatar jbuechele
Browse files

#15: redesigned card header, added firstName and lastName optional

parent cc99a373
......@@ -9,16 +9,18 @@
<img src="${url.resourcesPath}/img/fairlogin.svg">
</div>
<div class="card">
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs nav-fill" id="loginRegisterTab" role="tablist">
<ul class="nav nav-pills nav-fill" id="loginRegisterTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="login-tab" data-toggle="tab" href="#login" role="tab" aria-controls="login" aria-selected="true">Login</a>
</li>
<#if realm.registrationAllowed>
<li class="nav-item">
<a class="nav-link" id="register-tab" href="${url.registrationUrl}" aria-controls="register" aria-selected="false">Register</a>
</li>
</#if>
</ul>
</div>
<div class="card-body fat">
<#include "alert.ftl">
<div class="tab-content" id="loginTabContent">
......@@ -62,9 +64,11 @@
<hr class="separator" />
<p>${msg("getFairloginIdIdpDescription")}</p>
<a class="btn btn-primary" data-toggle="collapse" href="#socialProviders" role="button" aria-expanded="false" aria-controls="social.providers">
${msg("moreSocialIdentityProviders")}
</a>
<div class="text-center">
<a class="btn btn-primary" data-toggle="collapse" href="#socialProviders" role="button" aria-expanded="false" aria-controls="social.providers">
${msg("moreSocialIdentityProviders")}
</a>
</div>
<div class="collapse" id="socialProviders">
<div class="social-provider margin-top-20">
<#list social.providers as p>
......
......@@ -9,8 +9,8 @@
<img src="${url.resourcesPath}/img/fairlogin.svg">
</div>
<div class="card">
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs nav-fill" id="loginRegisterTab" role="tablist">
<ul class="nav nav-pills nav-fill" id="loginRegisterTab" role="tablist">
<li class="nav-item">
<a class="nav-link" id="login-tab" href="${url.loginUrl}" aria-controls="login" aria-selected="false">Login</a>
</li>
......@@ -18,7 +18,7 @@
<a class="nav-link active" id="register-tab" data-toggle="tab" href="#register" role="tab" aria-controls="register" aria-selected="true">Register</a>
</li>
</ul>
</div>
<div class="card-body fat">
<#include "alert.ftl">
<div class="tab-content" id="registerTabContent">
......@@ -26,13 +26,13 @@
<form action="${url.registrationAction}" method="post" onsubmit="return checkAnswer()">
<div class="form-group">
<label for="firstName" class="required">${msg("firstName")}</label>
<input id="firstName" type="text" class="form-control" name="firstName" required autofocus>
<label for="firstName">${msg("firstName")}</label>
<input id="firstName" type="text" class="form-control" name="firstName" autofocus>
</div>
<div class="form-group">
<label for="lastName" class="required">${msg("lastName")}</label>
<input id="lastName" type="text" class="form-control" name="lastName" required>
<label for="lastName">${msg("lastName")}</label>
<input id="lastName" type="text" class="form-control" name="lastName">
</div>
<div class="form-group">
......
......@@ -228,6 +228,19 @@ img {
font-weight: 500;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
background-color: #FFF;
border-bottom: 2px solid #283583;
border-radius: 0;
}
.nav-pills .nav-link {
padding: .75rem 1.25rem;
background-color: #fafafa;
border-bottom: 1px solid rgba(0,0,0,.125);
border-radius: 0;
}
@media screen and (max-width: 425px) {
.main-page .card-wrapper {
width: 90%;
......
......@@ -50,4 +50,14 @@ $(document).ready(() => {
setNickname();
}
});
$('form').submit(() => {
if(!$('#firstName').val()) {
$('#firstName').val('unknown')
}
if(!$('#lastName').val()) {
$('#lastName').val('unknown')
}
})
});
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment