fix update pass and update profile by removing more kc-wrapper layers

lumbung.space/login/login-update-password.ftl

@@ -9,14 +9,10 @@
             <input type="password" id="password" name="password" autocomplete="current-password" style="display:none;"/>
 
             <div class="${properties.kcFormGroupClass!}">
-                <div class="${properties.kcLabelWrapperClass!}">
                     <label for="password-new" class="${properties.kcLabelClass!}">${msg("passwordNew")}</label>
-                </div>
-                <div class="${properties.kcInputWrapperClass!}">
                     <input type="password" id="password-new" name="password-new" class="${properties.kcInputClass!}"
                            autofocus autocomplete="new-password"
                            aria-invalid="<#if messagesPerField.existsError('password','password-confirm')>true</#if>"
-                    />
 
                     <#if messagesPerField.existsError('password')>
                         <span id="input-error-password" class="${properties.kcInputErrorMessageClass!}" aria-live="polite">
@@ -27,10 +23,7 @@
             </div>
 
             <div class="${properties.kcFormGroupClass!}">
-                <div class="${properties.kcLabelWrapperClass!}">
                     <label for="password-confirm" class="${properties.kcLabelClass!}">${msg("passwordConfirm")}</label>
-                </div>
-                <div class="${properties.kcInputWrapperClass!}">
                     <input type="password" id="password-confirm" name="password-confirm"
                            class="${properties.kcInputClass!}"
                            autocomplete="new-password"
@@ -42,8 +35,6 @@
                             ${kcSanitize(messagesPerField.get('password-confirm'))?no_esc}
                         </span>
                     </#if>
-
-                </div>
             </div>
 
             <div class="${properties.kcFormGroupClass!}">
@@ -57,14 +48,13 @@
                     </div>
                 </div>
 
-                <div id="kc-form-buttons" class="${properties.kcFormButtonsClass!}">
-                    <#if isAppInitiatedAction??>
+                        <#if isAppInitiatedAction??>
                         <input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}" />
                         <button class="${properties.kcButtonClass!} ${properties.kcButtonDefaultClass!} ${properties.kcButtonLargeClass!}" type="submit" name="cancel-aia" value="true" />${msg("doCancel")}</button>
                     <#else>
                         <input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}" />
                     </#if>
-                </div>
+                
             </div>
         </form>
     </#if>

lumbung.space/login/login-update-profile.ftl

@@ -6,10 +6,7 @@
         <form id="kc-update-profile-form" class="${properties.kcFormClass!}" action="${url.loginAction}" method="post">
             <#if user.editUsernameAllowed>
                 <div class="${properties.kcFormGroupClass!}">
-                    <div class="${properties.kcLabelWrapperClass!}">
                         <label for="username" class="${properties.kcLabelClass!}">${msg("username")}</label>
-                    </div>
-                    <div class="${properties.kcInputWrapperClass!}">
                         <input type="text" id="username" name="username" value="${(user.username!'')}"
                                class="${properties.kcInputClass!}"
                                aria-invalid="<#if messagesPerField.existsError('username')>true</#if>"
@@ -20,14 +17,10 @@
                                 ${kcSanitize(messagesPerField.get('username'))?no_esc}
                             </span>
                         </#if>
-                    </div>
                 </div>
             </#if>
             <div class="${properties.kcFormGroupClass!}">
-                <div class="${properties.kcLabelWrapperClass!}">
                     <label for="email" class="${properties.kcLabelClass!}">${msg("email")}</label>
-                </div>
-                <div class="${properties.kcInputWrapperClass!}">
                     <input type="text" id="email" name="email" value="${(user.email!'')}"
                            class="${properties.kcInputClass!}"
                            aria-invalid="<#if messagesPerField.existsError('email')>true</#if>"
@@ -38,14 +31,10 @@
                             ${kcSanitize(messagesPerField.get('email'))?no_esc}
                         </span>
                     </#if>
-                </div>
             </div>
 
             <div class="${properties.kcFormGroupClass!}">
-                <div class="${properties.kcLabelWrapperClass!}">
                     <label for="firstName" class="${properties.kcLabelClass!}">${msg("firstName")}</label>
-                </div>
-                <div class="${properties.kcInputWrapperClass!}">
                     <input type="text" id="firstName" name="firstName" value="${(user.firstName!'')}"
                            class="${properties.kcInputClass!}"
                            aria-invalid="<#if messagesPerField.existsError('firstName')>true</#if>"
@@ -56,14 +45,10 @@
                             ${kcSanitize(messagesPerField.get('firstName'))?no_esc}
                         </span>
                     </#if>
-                </div>
             </div>
 
             <div class="${properties.kcFormGroupClass!}">
-                <div class="${properties.kcLabelWrapperClass!}">
                     <label for="lastName" class="${properties.kcLabelClass!}">${msg("lastName")}</label>
-                </div>
-                <div class="${properties.kcInputWrapperClass!}">
                     <input type="text" id="lastName" name="lastName" value="${(user.lastName!'')}"
                            class="${properties.kcInputClass!}"
                            aria-invalid="<#if messagesPerField.existsError('lastName')>true</#if>"
@@ -74,7 +59,6 @@
                             ${kcSanitize(messagesPerField.get('lastName'))?no_esc}
                         </span>
                     </#if>
-                </div>
             </div>
 
             <div class="${properties.kcFormGroupClass!}">
@@ -83,14 +67,12 @@
                     </div>
                 </div>
 
-                <div id="kc-form-buttons" class="${properties.kcFormButtonsClass!}">
                     <#if isAppInitiatedAction??>
                     <input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}" />
                     <button class="${properties.kcButtonClass!} ${properties.kcButtonDefaultClass!} ${properties.kcButtonLargeClass!}" type="submit" name="cancel-aia" value="true" />${msg("doCancel")}</button>
                     <#else>
                     <input class="${properties.kcButtonClass!} ${properties.kcButtonPrimaryClass!} ${properties.kcButtonBlockClass!} ${properties.kcButtonLargeClass!}" type="submit" value="${msg("doSubmit")}" />
                     </#if>
-                </div>
             </div>
         </form>
     </#if>

lumbung.space/login/theme.properties.bak

@@ -1,130 +0,0 @@
-parent=base
-import=common/keycloak
-
-styles=css/login.css css/tile.css
-stylesCommon=web_modules/@patternfly/react-core/dist/styles/base.css web_modules/@patternfly/react-core/dist/styles/app.css node_modules/patternfly/dist/css/patternfly.min.css node_modules/patternfly/dist/css/patternfly-additions.min.css lib/pficon/pficon.css
-
-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