first draft login view
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
rra
parent
1e69982156
commit
795b1d0539
|
|
@ -0,0 +1,83 @@
|
|||
body {
|
||||
|
||||
font-size:1.3em;
|
||||
font-family: sans-serif;
|
||||
|
||||
}
|
||||
|
||||
.card-pf {
|
||||
border:2px solid #0e0e22;
|
||||
max-width:500px;
|
||||
margin:auto;
|
||||
box-shadow:1em 1em 0 #d2d1c8;
|
||||
background-color: #fff09d;
|
||||
}
|
||||
|
||||
|
||||
.card-pf #kc-content #kc-content-wrapper {
|
||||
|
||||
padding: 1em;
|
||||
|
||||
}
|
||||
|
||||
.login-pf-header {
|
||||
border-bottom: 2px solid black;
|
||||
}
|
||||
|
||||
|
||||
#kc-page-title {
|
||||
border-right: 2px solid black;
|
||||
margin: 0;
|
||||
padding: 0.2em;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
font-size: 1em;
|
||||
display: inline-block;
|
||||
|
||||
}
|
||||
|
||||
#kc-form-wrapper {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
#kc-form-login {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
flex-direction: column;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
font-size: 14px;
|
||||
margin: 5px auto;
|
||||
border:2px solid #0e0e22;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
align-items: baseline;
|
||||
|
||||
}
|
||||
|
||||
.form-group.login-pf-settings{
|
||||
border: none;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
font-weight: bold;
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
#kc-form-buttons {
|
||||
width: unset;
|
||||
margin: 0;
|
||||
align-self: end;
|
||||
}
|
||||
|
||||
.pf-c-form-control {
|
||||
border: none;
|
||||
padding: 5px 5px 5px 5px;
|
||||
border-left: 2px solid black;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
parent=base
|
||||
import=common/keycloak
|
||||
|
||||
styles=css/login.css
|
||||
scripts=css/test.js
|
||||
|
||||
meta=viewport==width=device-width,initial-scale=1
|
||||
|
||||
kcHtmlClass=login-pf
|
||||
kcLoginClass=login-pf-page
|
||||
|
||||
kcLogoLink=http://www.keycloak.org
|
||||
|
||||
kcLogoClass=login-pf-brand
|
||||
|
||||
kcContainerClass=container-fluid
|
||||
kcContentClass=col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3
|
||||
|
||||
kcHeaderClass=login-pf-page-header
|
||||
kcFeedbackAreaClass=col-md-12
|
||||
kcLocaleClass=col-xs-12 col-sm-1
|
||||
|
||||
## Locale
|
||||
kcLocaleMainClass=pf-c-dropdown
|
||||
kcLocaleListClass=pf-c-dropdown__menu pf-m-align-right
|
||||
kcLocaleItemClass=pf-c-dropdown__menu-item
|
||||
|
||||
## Alert
|
||||
kcAlertClass=pf-c-alert pf-m-inline
|
||||
kcAlertTitleClass=pf-c-alert__title kc-feedback-text
|
||||
|
||||
kcFormAreaClass=col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-8 col-lg-offset-2
|
||||
kcFormCardClass=card-pf
|
||||
|
||||
### Social providers
|
||||
kcFormSocialAccountListClass=pf-c-login__main-footer-links kc-social-links
|
||||
kcFormSocialAccountListGridClass=pf-l-grid kc-social-grid
|
||||
kcFormSocialAccountListButtonClass=pf-c-button pf-m-control pf-m-block kc-social-item kc-social-gray
|
||||
kcFormSocialAccountGridItem=pf-l-grid__item
|
||||
|
||||
kcFormSocialAccountNameClass=kc-social-provider-name
|
||||
kcFormSocialAccountLinkClass=pf-c-login__main-footer-links-item-link
|
||||
kcFormSocialAccountSectionClass=kc-social-section kc-social-gray
|
||||
kcFormHeaderClass=login-pf-header
|
||||
|
||||
kcFeedbackErrorIcon=fa fa-fw fa-exclamation-circle
|
||||
kcFeedbackWarningIcon=fa fa-fw fa-exclamation-triangle
|
||||
kcFeedbackSuccessIcon=fa fa-fw fa-check-circle
|
||||
kcFeedbackInfoIcon=fa fa-fw fa-info-circle
|
||||
|
||||
kcResetFlowIcon=pficon pficon-arrow fa
|
||||
kcWebAuthnKeyIcon=pficon pficon-key
|
||||
|
||||
kcFormClass=form-horizontal
|
||||
kcFormGroupClass=form-group
|
||||
kcFormGroupErrorClass=has-error
|
||||
kcLabelClass=pf-c-form__label pf-c-form__label-text
|
||||
kcLabelWrapperClass=col-xs-12 col-sm-12 col-md-12 col-lg-12
|
||||
kcInputClass=pf-c-form-control
|
||||
kcInputErrorMessageClass=pf-c-form__helper-text pf-m-error required kc-feedback-text
|
||||
kcInputWrapperClass=col-xs-12 col-sm-12 col-md-12 col-lg-12
|
||||
kcFormOptionsClass=col-xs-12 col-sm-12 col-md-12 col-lg-12
|
||||
kcFormButtonsClass=col-xs-12 col-sm-12 col-md-12 col-lg-12
|
||||
kcFormSettingClass=login-pf-settings
|
||||
kcTextareaClass=form-control
|
||||
kcSignUpClass=login-pf-signup
|
||||
|
||||
|
||||
kcInfoAreaClass=col-xs-12 col-sm-4 col-md-4 col-lg-5 details
|
||||
|
||||
##### css classes for form buttons
|
||||
# main class used for all buttons
|
||||
kcButtonClass=pf-c-button
|
||||
# classes defining priority of the button - primary or default (there is typically only one priority button for the form)
|
||||
kcButtonPrimaryClass=pf-m-primary
|
||||
kcButtonDefaultClass=btn-default
|
||||
# classes defining size of the button
|
||||
kcButtonLargeClass=btn-lg
|
||||
kcButtonBlockClass=pf-m-block
|
||||
|
||||
##### css classes for input
|
||||
kcInputLargeClass=input-lg
|
||||
|
||||
##### css classes for form accessability
|
||||
kcSrOnlyClass=sr-only
|
||||
|
||||
##### css classes for select-authenticator form
|
||||
kcSelectAuthListClass=pf-l-stack select-auth-container
|
||||
kcSelectAuthListItemClass=pf-l-stack__item select-auth-box-parent pf-l-split
|
||||
kcSelectAuthListItemIconClass=pf-l-split__item select-auth-box-icon
|
||||
kcSelectAuthListItemBodyClass=pf-l-split__item pf-l-stack
|
||||
kcSelectAuthListItemHeadingClass=pf-l-stack__item select-auth-box-headline pf-c-title
|
||||
kcSelectAuthListItemDescriptionClass=pf-l-stack__item select-auth-box-desc
|
||||
kcSelectAuthListItemFillClass=pf-l-split__item pf-m-fill
|
||||
kcSelectAuthListItemArrowClass=pf-l-split__item select-auth-box-arrow
|
||||
kcSelectAuthListItemArrowIconClass=fa fa-angle-right fa-lg
|
||||
|
||||
##### css classes for the authenticators
|
||||
kcAuthenticatorDefaultClass=fa list-view-pf-icon-lg
|
||||
kcAuthenticatorPasswordClass=fa fa-unlock list-view-pf-icon-lg
|
||||
kcAuthenticatorOTPClass=fa fa-mobile list-view-pf-icon-lg
|
||||
kcAuthenticatorWebAuthnClass=fa fa-key list-view-pf-icon-lg
|
||||
kcAuthenticatorWebAuthnPasswordlessClass=fa fa-key list-view-pf-icon-lg
|
||||
|
||||
##### css classes for the OTP Login Form
|
||||
kcLoginOTPListClass=pf-c-tile
|
||||
kcLoginOTPListInputClass=pf-c-tile__input
|
||||
kcLoginOTPListItemHeaderClass=pf-c-tile__header
|
||||
kcLoginOTPListItemIconBodyClass=pf-c-tile__icon
|
||||
kcLoginOTPListItemIconClass=fa fa-mobile
|
||||
kcLoginOTPListItemTitleClass=pf-c-tile__title
|
||||
|
||||
##### css classes for identity providers logos
|
||||
kcCommonLogoIdP=kc-social-provider-logo kc-social-gray
|
||||
|
||||
## Social
|
||||
kcLogoIdP-facebook=fa fa-facebook
|
||||
kcLogoIdP-google=fa fa-google
|
||||
kcLogoIdP-github=fa fa-github
|
||||
kcLogoIdP-linkedin=fa fa-linkedin
|
||||
kcLogoIdP-instagram=fa fa-instagram
|
||||
## windows instead of microsoft - not included in PF4
|
||||
kcLogoIdP-microsoft=fa fa-windows
|
||||
kcLogoIdP-bitbucket=fa fa-bitbucket
|
||||
kcLogoIdP-gitlab=fa fa-gitlab
|
||||
kcLogoIdP-paypal=fa fa-paypal
|
||||
kcLogoIdP-stackoverflow=fa fa-stack-overflow
|
||||
kcLogoIdP-twitter=fa fa-twitter
|
||||
kcLogoIdP-openshift-v4=pf-icon pf-icon-openshift
|
||||
kcLogoIdP-openshift-v3=pf-icon pf-icon-openshift
|
||||
Loading…
Reference in New Issue