KEYCLOAK-1572
Messages on login page are not in line with PatternFly
This commit is contained in:
Stian Thorgersen
parent
9d9ce6c04e
commit
32978d022d
3 changed files with 29 additions and 69 deletions
|
|
@ -38,18 +38,6 @@
|
|||
<div id="kc-header-wrapper" class="${properties.kcHeaderWrapperClass!}"><#nested "header"></div>
|
||||
</div>
|
||||
|
||||
<#if displayMessage && message?has_content>
|
||||
<div id="kc-feedback" class="feedback-${message.type} ${properties.kcFeedBackClass!}">
|
||||
<div id="kc-feedback-wrapper">
|
||||
<span class="kc-feedback-text">${message.summary}</span>
|
||||
</div>
|
||||
</div>
|
||||
<#else>
|
||||
<div id="kc-feedback-placeholder" class="${properties.kcFeedBackPlaceholderClass!}">
|
||||
<div id="kc-feedback-placeholder-wrapper"></div>
|
||||
</div>
|
||||
</#if>
|
||||
|
||||
<#if realm.internationalizationEnabled>
|
||||
<div id="kc-locale" class="${properties.kcLocaleClass!}">
|
||||
<div id="kc-locale-wrapper" class="${properties.kcLocaleWrapperClass!}">
|
||||
|
|
@ -67,6 +55,18 @@
|
|||
|
||||
<div id="kc-content" class="${properties.kcContentClass!}">
|
||||
<div id="kc-content-wrapper" class="${properties.kcContentWrapperClass!}">
|
||||
|
||||
<#if displayMessage && message?has_content>
|
||||
<div class="${properties.kcFeedbackAreaClass!}">
|
||||
<div class="alert alert-${message.type}">
|
||||
<#if message.type = 'success'><span class="${properties.kcFeedbackSuccessIcon}"></span></#if>
|
||||
<#if message.type = 'warning'><span class="${properties.kcFeedbackWarningIcon}"></span></#if>
|
||||
<#if message.type = 'error'><span class="${properties.kcFeedbackErrorIcon}"></span></#if>
|
||||
<span>${message.summary}</span>
|
||||
</div>
|
||||
</div>
|
||||
</#if>
|
||||
|
||||
<div id="kc-form" class="${properties.kcFormAreaClass!}">
|
||||
<div id="kc-form-wrapper" class="${properties.kcFormAreaWrapperClass!}">
|
||||
<#nested "form">
|
||||
|
|
|
|||
|
|
@ -3,6 +3,12 @@
|
|||
background-size: 100% auto;
|
||||
}
|
||||
|
||||
.alert-error {
|
||||
background-color: #ffffff;
|
||||
border-color: #cc0000;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.kc-dropdown{
|
||||
position: relative;
|
||||
z-index: 9999;
|
||||
|
|
@ -114,59 +120,10 @@
|
|||
display: block;
|
||||
}
|
||||
|
||||
#kc-feedback-wrapper {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
background-position: left bottom;
|
||||
background-repeat: no-repeat;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
#kc-feedback span {
|
||||
display: block;
|
||||
padding: 0.90909090909091em 3.63636363636364em;
|
||||
border-style: solid;
|
||||
border-width: 1px 1px 0px 1px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 1.27272727272727em center;
|
||||
font-weight: normal;
|
||||
line-height: 1.4em;
|
||||
border-radius: 2px;
|
||||
color: #4d5258;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#kc-terms-text {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.feedback-error #kc-feedback-wrapper {
|
||||
background-image: url(../img/feedback-error-arrow-down.png);
|
||||
}
|
||||
.feedback-error span {
|
||||
border-color: #b91415;
|
||||
background-image: url(../img/feedback-error-sign.png);
|
||||
background-color: #f8e7e7;
|
||||
}
|
||||
|
||||
.feedback-success #kc-feedback-wrapper {
|
||||
background-image: url(../img/feedback-success-arrow-down.png);
|
||||
}
|
||||
.feedback-success span {
|
||||
border-color: #4b9e39;
|
||||
background-image: url(../img/feedback-success-sign.png);
|
||||
background-color: #e4f1e1;
|
||||
}
|
||||
|
||||
.feedback-warning #kc-feedback-wrapper {
|
||||
background-image: url(../img/feedback-warning-arrow-down.png);
|
||||
}
|
||||
.feedback-warning span {
|
||||
border-color: #f17528;
|
||||
background-image: url(../img/feedback-warning-sign.png);
|
||||
background-color: #fef1e9;
|
||||
}
|
||||
|
||||
#kc-registration {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
|
@ -283,6 +240,10 @@ ol#kc-totp-settings li:first-of-type {
|
|||
top: 50px;
|
||||
right: 50px;
|
||||
}
|
||||
|
||||
.login-pf .container {
|
||||
padding-right: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
|
|
@ -300,12 +261,6 @@ ol#kc-totp-settings li:first-of-type {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
#kc-feedback {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
float: none;
|
||||
}
|
||||
|
||||
#kc-form {
|
||||
float: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,12 +12,17 @@ kcContentClass=col-sm-12 col-md-12 col-lg-12 container
|
|||
kcContentWrapperClass=row
|
||||
|
||||
kcHeaderClass=col-xs-12 col-sm-7 col-md-6 col-lg-5
|
||||
kcFeedBackClass=col-xs-12 col-sm-4 col-md-5 col-lg-6
|
||||
kcFeedBackPlaceholderClass=col-xs-12 col-sm-4 col-md-5 col-lg-6
|
||||
kcFeedbackAreaClass=col-md-12
|
||||
kcLocaleClass=col-xs-12 col-sm-1
|
||||
kcAlertIconClasserror=pficon pficon-error-circle-o
|
||||
|
||||
kcFormAreaClass=col-xs-12 col-sm-8 col-md-8 col-lg-7 login
|
||||
|
||||
kcFeedbackErrorIcon=pficon pficon-error-circle-o
|
||||
kcFeedbackWarningIcon=pficon pficon-warning-triangle-o
|
||||
kcFeedbackSuccessIcon=alert alert-success
|
||||
|
||||
|
||||
kcFormClass=form-horizontal
|
||||
kcFormGroupClass=form-group
|
||||
kcFormGroupErrorClass=has-error
|
||||
|
|
|
|||
Loading…
Reference in a new issue