From 933193855a7c1583e60c0737e158ba4e5ca4cfb2 Mon Sep 17 00:00:00 2001 From: Livio Amstutz Date: Mon, 20 Jul 2020 10:00:29 +0200 Subject: [PATCH] feat(login): show profile (#485) * profile data * fix scripts * fix image paths * feat: show profile (with image) when possible * fix profile image width --- .../eventsourcing/eventstore/auth_request.go | 4 +- internal/auth_request/model/auth_request.go | 4 +- .../login/handler/change_password_handler.go | 10 +-- .../ui/login/handler/init_password_handler.go | 17 ++--- .../ui/login/handler/init_user_handler.go | 17 ++--- internal/ui/login/handler/login_handler.go | 9 +-- internal/ui/login/handler/logout_handler.go | 4 +- .../ui/login/handler/mail_verify_handler.go | 9 ++- .../ui/login/handler/mfa_init_done_handler.go | 2 +- .../login/handler/mfa_init_verify_handler.go | 2 +- .../ui/login/handler/mfa_prompt_handler.go | 26 ++++---- .../ui/login/handler/mfa_verify_handler.go | 5 +- internal/ui/login/handler/password_handler.go | 5 +- .../login/handler/password_reset_handler.go | 5 +- internal/ui/login/handler/renderer.go | 41 +++++++++--- .../scripts/change_password_check.js | 2 +- .../static/resources/scripts/form_submit.js | 1 - .../static/resources/themes/caos/css/dark.css | 65 ++++++++++++------- .../resources/themes/caos/css/dark.css.map | 2 +- .../resources/themes/caos/css/light.css | 65 ++++++++++++------- .../resources/themes/caos/css/light.css.map | 2 +- .../static/resources/themes/scss/main.scss | 47 ++++++++++---- .../resources/themes/scss/variables.scss | 8 +-- .../resources/themes/zitadel/css/dark.css | 65 ++++++++++++------- .../resources/themes/zitadel/css/dark.css.map | 2 +- .../resources/themes/zitadel/css/light.css | 65 ++++++++++++------- .../themes/zitadel/css/light.css.map | 2 +- .../static/templates/change_password.html | 3 +- .../templates/change_password_done.html | 2 +- .../login/static/templates/init_password.html | 2 +- .../static/templates/init_password_done.html | 3 +- .../ui/login/static/templates/init_user.html | 2 +- .../static/templates/init_user_done.html | 3 +- .../static/templates/mail_verification.html | 2 +- .../login/static/templates/mail_verified.html | 2 +- .../login/static/templates/mfa_init_done.html | 2 +- .../static/templates/mfa_init_verify.html | 2 +- .../ui/login/static/templates/mfa_prompt.html | 3 +- .../ui/login/static/templates/mfa_verify.html | 2 +- .../ui/login/static/templates/password.html | 3 +- .../static/templates/password_reset_done.html | 3 +- .../login/static/templates/user_profile.html | 13 ++++ 42 files changed, 321 insertions(+), 212 deletions(-) create mode 100644 internal/ui/login/static/templates/user_profile.html diff --git a/internal/auth/repository/eventsourcing/eventstore/auth_request.go b/internal/auth/repository/eventsourcing/eventstore/auth_request.go index f1ee22d562..ad51bcb992 100644 --- a/internal/auth/repository/eventsourcing/eventstore/auth_request.go +++ b/internal/auth/repository/eventsourcing/eventstore/auth_request.go @@ -138,7 +138,7 @@ func (repo *AuthRequestRepo) SelectUser(ctx context.Context, id, userID string) if err != nil { return err } - request.SetUserInfo(user.ID, user.PreferredLoginName, user.ResourceOwner) + request.SetUserInfo(user.ID, user.PreferredLoginName, user.DisplayName, user.ResourceOwner) return repo.AuthRequests.UpdateAuthRequest(ctx, request) } @@ -182,7 +182,7 @@ func (repo *AuthRequestRepo) checkLoginName(request *model.AuthRequest, loginNam if err != nil { return err } - request.SetUserInfo(user.ID, loginName, user.ResourceOwner) + request.SetUserInfo(user.ID, loginName, "", user.ResourceOwner) return nil } diff --git a/internal/auth_request/model/auth_request.go b/internal/auth_request/model/auth_request.go index 32c0021b4e..a834adc34d 100644 --- a/internal/auth_request/model/auth_request.go +++ b/internal/auth_request/model/auth_request.go @@ -25,6 +25,7 @@ type AuthRequest struct { levelOfAssurance LevelOfAssurance UserID string LoginName string + DisplayName string UserOrgID string PossibleSteps []NextStep PasswordVerified bool @@ -96,8 +97,9 @@ func (a *AuthRequest) WithCurrentInfo(info *BrowserInfo) *AuthRequest { return a } -func (a *AuthRequest) SetUserInfo(userID string, loginName string, userOrgID string) { +func (a *AuthRequest) SetUserInfo(userID, loginName, displayName, userOrgID string) { a.UserID = userID a.LoginName = loginName + a.DisplayName = displayName a.UserOrgID = userOrgID } diff --git a/internal/ui/login/handler/change_password_handler.go b/internal/ui/login/handler/change_password_handler.go index b78118aa89..9c8a91c8d1 100644 --- a/internal/ui/login/handler/change_password_handler.go +++ b/internal/ui/login/handler/change_password_handler.go @@ -24,7 +24,6 @@ func (l *Login) handleChangePassword(w http.ResponseWriter, r *http.Request) { l.renderError(w, r, authReq, err) return } - err = l.authRepo.ChangePassword(setContext(r.Context(), authReq.UserOrgID), authReq.UserID, data.OldPassword, data.NewPassword) if err != nil { l.renderChangePassword(w, r, authReq, err) @@ -39,8 +38,8 @@ func (l *Login) renderChangePassword(w http.ResponseWriter, r *http.Request, aut errMessage = l.getErrorMessage(r, err) } data := passwordData{ - baseData: l.getBaseData(r, authReq, "Change Password", errType, errMessage), - LoginName: authReq.LoginName, + baseData: l.getBaseData(r, authReq, "Change Password", errType, errMessage), + profileData: l.getProfileData(authReq), } policy, description, _ := l.getPasswordComplexityPolicy(r, authReq.UserOrgID) if policy != nil { @@ -64,9 +63,6 @@ func (l *Login) renderChangePassword(w http.ResponseWriter, r *http.Request, aut func (l *Login) renderChangePasswordDone(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest) { var errType, errMessage string - data := userData{ - baseData: l.getBaseData(r, authReq, "Password Change Done", errType, errMessage), - LoginName: authReq.LoginName, - } + data := l.getUserData(r, authReq, "Password Change Done", errType, errMessage) l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplChangePasswordDone], data, nil) } diff --git a/internal/ui/login/handler/init_password_handler.go b/internal/ui/login/handler/init_password_handler.go index c88a230266..3a6db0a907 100644 --- a/internal/ui/login/handler/init_password_handler.go +++ b/internal/ui/login/handler/init_password_handler.go @@ -25,6 +25,7 @@ type initPasswordFormData struct { type initPasswordData struct { baseData + profileData Code string UserID string PasswordPolicyDescription string @@ -93,9 +94,10 @@ func (l *Login) renderInitPassword(w http.ResponseWriter, r *http.Request, authR } data := initPasswordData{ - baseData: l.getBaseData(r, authReq, "Init Password", errType, errMessage), - UserID: userID, - Code: code, + baseData: l.getBaseData(r, authReq, "Init Password", errType, errMessage), + profileData: l.getProfileData(authReq), + UserID: userID, + Code: code, } policy, description, _ := l.getPasswordComplexityPolicyByUserID(r, userID) if policy != nil { @@ -118,13 +120,6 @@ func (l *Login) renderInitPassword(w http.ResponseWriter, r *http.Request, authR } func (l *Login) renderInitPasswordDone(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest) { - loginName := "" - if authReq != nil { - loginName = authReq.LoginName - } - data := userData{ - baseData: l.getBaseData(r, authReq, "Password Init Done", "", ""), - LoginName: loginName, - } + data := l.getUserData(r, authReq, "Password Init Done", "", "") l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplInitPasswordDone], data, nil) } diff --git a/internal/ui/login/handler/init_user_handler.go b/internal/ui/login/handler/init_user_handler.go index 7fb8ab44a2..862666e089 100644 --- a/internal/ui/login/handler/init_user_handler.go +++ b/internal/ui/login/handler/init_user_handler.go @@ -28,6 +28,7 @@ type initUserFormData struct { type initUserData struct { baseData + profileData Code string UserID string PasswordSet bool @@ -73,10 +74,10 @@ func (l *Login) checkUserInitCode(w http.ResponseWriter, r *http.Request, authRe } err = l.authRepo.VerifyInitCode(setContext(r.Context(), userOrgID), data.UserID, data.Code, data.Password) if err != nil { - l.renderInitUser(w, r, nil, data.UserID, "", data.PasswordSet, err) + l.renderInitUser(w, r, authReq, data.UserID, "", data.PasswordSet, err) return } - l.renderInitUserDone(w, r, nil) + l.renderInitUserDone(w, r, authReq) } func (l *Login) resendUserInit(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest, userID string, showPassword bool) { @@ -97,7 +98,8 @@ func (l *Login) renderInitUser(w http.ResponseWriter, r *http.Request, authReq * userID = authReq.UserID } data := initUserData{ - baseData: l.getBaseData(r, nil, "Init User", errType, errMessage), + baseData: l.getBaseData(r, authReq, "Init User", errType, errMessage), + profileData: l.getProfileData(authReq), UserID: userID, Code: code, PasswordSet: passwordSet, @@ -123,13 +125,6 @@ func (l *Login) renderInitUser(w http.ResponseWriter, r *http.Request, authReq * } func (l *Login) renderInitUserDone(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest) { - var loginName string - if authReq != nil { - loginName = authReq.LoginName - } - data := userData{ - baseData: l.getBaseData(r, authReq, "User Init Done", "", ""), - LoginName: loginName, - } + data := l.getUserData(r, authReq, "User Init Done", "", "") l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplInitUserDone], data, nil) } diff --git a/internal/ui/login/handler/login_handler.go b/internal/ui/login/handler/login_handler.go index 349cfda12a..d9d9f1f924 100644 --- a/internal/ui/login/handler/login_handler.go +++ b/internal/ui/login/handler/login_handler.go @@ -61,13 +61,6 @@ func (l *Login) renderLogin(w http.ResponseWriter, r *http.Request, authReq *mod if err != nil { errMessage = l.getErrorMessage(r, err) } - loginName := "" - if authReq != nil { - loginName = authReq.LoginName - } - data := userData{ - baseData: l.getBaseData(r, authReq, "Login", errType, errMessage), - LoginName: loginName, - } + data := l.getUserData(r, authReq, "Login", errType, errMessage) l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplLogin], data, nil) } diff --git a/internal/ui/login/handler/logout_handler.go b/internal/ui/login/handler/logout_handler.go index 19cb8c94dd..f658e097b3 100644 --- a/internal/ui/login/handler/logout_handler.go +++ b/internal/ui/login/handler/logout_handler.go @@ -13,8 +13,6 @@ func (l *Login) handleLogoutDone(w http.ResponseWriter, r *http.Request) { } func (l *Login) renderLogoutDone(w http.ResponseWriter, r *http.Request) { - data := userData{ - baseData: l.getBaseData(r, nil, "Logout Done", "", ""), - } + data := l.getUserData(r, nil, "Logout Done", "", "") l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplLogoutDone], data, nil) } diff --git a/internal/ui/login/handler/mail_verify_handler.go b/internal/ui/login/handler/mail_verify_handler.go index f171d4bf3b..3e95714add 100644 --- a/internal/ui/login/handler/mail_verify_handler.go +++ b/internal/ui/login/handler/mail_verify_handler.go @@ -22,6 +22,7 @@ type mailVerificationFormData struct { type mailVerificationData struct { baseData + profileData UserID string } @@ -77,15 +78,17 @@ func (l *Login) renderMailVerification(w http.ResponseWriter, r *http.Request, a userID = authReq.UserID } data := mailVerificationData{ - baseData: l.getBaseData(r, authReq, "Mail Verification", errType, errMessage), - UserID: userID, + baseData: l.getBaseData(r, authReq, "Mail Verification", errType, errMessage), + UserID: userID, + profileData: l.getProfileData(authReq), } l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplMailVerification], data, nil) } func (l *Login) renderMailVerified(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest) { data := mailVerificationData{ - baseData: l.getBaseData(r, authReq, "Mail Verified", "", ""), + baseData: l.getBaseData(r, authReq, "Mail Verified", "", ""), + profileData: l.getProfileData(authReq), } l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplMailVerified], data, nil) } diff --git a/internal/ui/login/handler/mfa_init_done_handler.go b/internal/ui/login/handler/mfa_init_done_handler.go index bd30a6e9c4..69f41af2f5 100644 --- a/internal/ui/login/handler/mfa_init_done_handler.go +++ b/internal/ui/login/handler/mfa_init_done_handler.go @@ -16,6 +16,6 @@ type mfaInitDoneData struct { func (l *Login) renderMfaInitDone(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest, data *mfaDoneData) { var errType, errMessage string data.baseData = l.getBaseData(r, authReq, "Mfa Init Done", errType, errMessage) - data.LoginName = authReq.LoginName + data.profileData = l.getProfileData(authReq) l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplMfaInitDone], data, nil) } diff --git a/internal/ui/login/handler/mfa_init_verify_handler.go b/internal/ui/login/handler/mfa_init_verify_handler.go index dc84d3def4..fdbbbecb31 100644 --- a/internal/ui/login/handler/mfa_init_verify_handler.go +++ b/internal/ui/login/handler/mfa_init_verify_handler.go @@ -68,7 +68,7 @@ func (l *Login) renderMfaInitVerify(w http.ResponseWriter, r *http.Request, auth errMessage = l.getErrorMessage(r, err) } data.baseData = l.getBaseData(r, authReq, "Mfa Init Verify", errType, errMessage) - data.LoginName = authReq.LoginName + data.profileData = l.getProfileData(authReq) if data.MfaType == model.MfaTypeOTP { code, err := generateQrCode(data.otpData.Url) if err == nil { diff --git a/internal/ui/login/handler/mfa_prompt_handler.go b/internal/ui/login/handler/mfa_prompt_handler.go index aaeb0888e8..69d487d546 100644 --- a/internal/ui/login/handler/mfa_prompt_handler.go +++ b/internal/ui/login/handler/mfa_prompt_handler.go @@ -18,37 +18,37 @@ type mfaPromptData struct { func (l *Login) handleMfaPrompt(w http.ResponseWriter, r *http.Request) { data := new(mfaPromptData) - authSession, err := l.getAuthRequestAndParseData(r, data) + authReq, err := l.getAuthRequestAndParseData(r, data) if err != nil { - l.renderError(w, r, authSession, err) + l.renderError(w, r, authReq, err) return } if !data.Skip { mfaVerifyData := new(mfaVerifyData) mfaVerifyData.MfaType = data.MfaProvider - l.handleMfaCreation(w, r, authSession, mfaVerifyData) + l.handleMfaCreation(w, r, authReq, mfaVerifyData) return } - err = l.authRepo.SkipMfaInit(setContext(r.Context(), authSession.UserOrgID), authSession.UserID) + err = l.authRepo.SkipMfaInit(setContext(r.Context(), authReq.UserOrgID), authReq.UserID) if err != nil { - l.renderError(w, r, authSession, err) + l.renderError(w, r, authReq, err) return } l.handleLogin(w, r) } -func (l *Login) renderMfaPrompt(w http.ResponseWriter, r *http.Request, authSession *model.AuthRequest, mfaPromptData *model.MfaPromptStep, err error) { +func (l *Login) renderMfaPrompt(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest, mfaPromptData *model.MfaPromptStep, err error) { var errType, errMessage string if err != nil { errMessage = l.getErrorMessage(r, err) } data := mfaData{ - baseData: l.getBaseData(r, authSession, "Mfa Prompt", errType, errMessage), - LoginName: authSession.LoginName, + baseData: l.getBaseData(r, authReq, "Mfa Prompt", errType, errMessage), + profileData: l.getProfileData(authReq), } if mfaPromptData == nil { - l.renderError(w, r, authSession, caos_errs.ThrowPreconditionFailed(nil, "APP-XU0tj", "Errors.User.Mfa.NoProviders")) + l.renderError(w, r, authReq, caos_errs.ThrowPreconditionFailed(nil, "APP-XU0tj", "Errors.User.Mfa.NoProviders")) return } @@ -59,19 +59,19 @@ func (l *Login) renderMfaPrompt(w http.ResponseWriter, r *http.Request, authSess data := &mfaVerifyData{ MfaType: mfaPromptData.MfaProviders[0], } - l.handleMfaCreation(w, r, authSession, data) + l.handleMfaCreation(w, r, authReq, data) return } l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplMfaPrompt], data, nil) } -func (l *Login) handleMfaCreation(w http.ResponseWriter, r *http.Request, authSession *model.AuthRequest, data *mfaVerifyData) { +func (l *Login) handleMfaCreation(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest, data *mfaVerifyData) { switch data.MfaType { case model.MfaTypeOTP: - l.handleOtpCreation(w, r, authSession, data) + l.handleOtpCreation(w, r, authReq, data) return } - l.renderError(w, r, authSession, caos_errs.ThrowPreconditionFailed(nil, "APP-Or3HO", "Errors.User.Mfa.NoProviders")) + l.renderError(w, r, authReq, caos_errs.ThrowPreconditionFailed(nil, "APP-Or3HO", "Errors.User.Mfa.NoProviders")) } func (l *Login) handleOtpCreation(w http.ResponseWriter, r *http.Request, authReq *model.AuthRequest, data *mfaVerifyData) { diff --git a/internal/ui/login/handler/mfa_verify_handler.go b/internal/ui/login/handler/mfa_verify_handler.go index ea7179374f..8ed16f9baa 100644 --- a/internal/ui/login/handler/mfa_verify_handler.go +++ b/internal/ui/login/handler/mfa_verify_handler.go @@ -37,10 +37,7 @@ func (l *Login) renderMfaVerify(w http.ResponseWriter, r *http.Request, authReq if err != nil { errMessage = l.getErrorMessage(r, err) } - data := userData{ - baseData: l.getBaseData(r, authReq, "Mfa Verify", errType, errMessage), - LoginName: authReq.LoginName, - } + data := l.getUserData(r, authReq, "Mfa Verify", errType, errMessage) if verificationStep != nil { data.MfaProviders = verificationStep.MfaProviders data.SelectedMfaProvider = verificationStep.MfaProviders[0] diff --git a/internal/ui/login/handler/password_handler.go b/internal/ui/login/handler/password_handler.go index f29ce20ec0..2d1e3afaa5 100644 --- a/internal/ui/login/handler/password_handler.go +++ b/internal/ui/login/handler/password_handler.go @@ -19,10 +19,7 @@ func (l *Login) renderPassword(w http.ResponseWriter, r *http.Request, authReq * if err != nil { errMessage = l.getErrorMessage(r, err) } - data := userData{ - baseData: l.getBaseData(r, authReq, "Password", errType, errMessage), - LoginName: authReq.LoginName, - } + data := l.getUserData(r, authReq, "Password", errType, errMessage) l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplPassword], data, nil) } diff --git a/internal/ui/login/handler/password_reset_handler.go b/internal/ui/login/handler/password_reset_handler.go index afea65893a..524c1094e5 100644 --- a/internal/ui/login/handler/password_reset_handler.go +++ b/internal/ui/login/handler/password_reset_handler.go @@ -25,9 +25,6 @@ func (l *Login) renderPasswordResetDone(w http.ResponseWriter, r *http.Request, if err != nil { errMessage = l.getErrorMessage(r, err) } - data := userData{ - baseData: l.getBaseData(r, authReq, "Password Reset Done", errType, errMessage), - LoginName: authReq.LoginName, - } + data := l.getUserData(r, authReq, "Password Reset Done", errType, errMessage) l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplPasswordResetDone], data, nil) } diff --git a/internal/ui/login/handler/renderer.go b/internal/ui/login/handler/renderer.go index 7f116550ca..1295cbaed3 100644 --- a/internal/ui/login/handler/renderer.go +++ b/internal/ui/login/handler/renderer.go @@ -3,11 +3,12 @@ package handler import ( "errors" "fmt" - "github.com/gorilla/csrf" "html/template" "net/http" "path" + "github.com/gorilla/csrf" + "github.com/caos/zitadel/internal/api/http/middleware" "github.com/caos/zitadel/internal/auth_request/model" caos_errs "github.com/caos/zitadel/internal/errors" @@ -185,6 +186,13 @@ func (l *Login) renderInternalError(w http.ResponseWriter, r *http.Request, auth l.renderer.RenderTemplate(w, r, l.renderer.Templates[tmplError], data, nil) } +func (l *Login) getUserData(r *http.Request, authReq *model.AuthRequest, title string, errType, errMessage string) userData { + return userData{ + baseData: l.getBaseData(r, authReq, title, errType, errMessage), + profileData: l.getProfileData(authReq), + } +} + func (l *Login) getBaseData(r *http.Request, authReq *model.AuthRequest, title string, errType, errMessage string) baseData { return baseData{ errorData: errorData{ @@ -201,6 +209,18 @@ func (l *Login) getBaseData(r *http.Request, authReq *model.AuthRequest, title s } } +func (l *Login) getProfileData(authReq *model.AuthRequest) profileData { + var loginName, displayName string + if authReq != nil { + loginName = authReq.LoginName + displayName = authReq.DisplayName + } + return profileData{ + LoginName: loginName, + DisplayName: displayName, + } +} + func (l *Login) getErrorMessage(r *http.Request, err error) (errMsg string) { caosErr := new(caos_errs.CaosError) if errors.As(err, &caosErr) { @@ -257,15 +277,20 @@ type errorData struct { type userData struct { baseData - LoginName string + profileData PasswordChecked string MfaProviders []model.MfaType SelectedMfaProvider model.MfaType } +type profileData struct { + LoginName string + DisplayName string +} + type passwordData struct { baseData - LoginName string + profileData PasswordPolicyDescription string MinLength uint64 HasUppercase string @@ -281,22 +306,22 @@ type userSelectionData struct { type mfaData struct { baseData - LoginName string + profileData MfaProviders []model.MfaType MfaRequired bool } type mfaVerifyData struct { baseData - LoginName string - MfaType model.MfaType + profileData + MfaType model.MfaType otpData } type mfaDoneData struct { baseData - LoginName string - MfaType model.MfaType + profileData + MfaType model.MfaType } type otpData struct { diff --git a/internal/ui/login/static/resources/scripts/change_password_check.js b/internal/ui/login/static/resources/scripts/change_password_check.js index 4b4a0b1928..18d8e5b002 100644 --- a/internal/ui/login/static/resources/scripts/change_password_check.js +++ b/internal/ui/login/static/resources/scripts/change_password_check.js @@ -10,5 +10,5 @@ function CheckChangePwPolicy() { return pwNew == pwNewConfirmation; } -let button = document.getElementById("change-password--button"); +let button = document.getElementById("change-password-button"); disableSubmit(CheckChangePwPolicy, button); \ No newline at end of file diff --git a/internal/ui/login/static/resources/scripts/form_submit.js b/internal/ui/login/static/resources/scripts/form_submit.js index fe0e1f8745..46bc70d790 100644 --- a/internal/ui/login/static/resources/scripts/form_submit.js +++ b/internal/ui/login/static/resources/scripts/form_submit.js @@ -1,5 +1,4 @@ function disableSubmit(checks, button) { - console.log("GUGUS"); let form = document.getElementsByTagName('form')[0]; let inputs = form.getElementsByTagName('input'); for (i = 0; i < inputs.length; i++) { diff --git a/internal/ui/login/static/resources/themes/caos/css/dark.css b/internal/ui/login/static/resources/themes/caos/css/dark.css index 08589e8e88..fbbf1920cb 100644 --- a/internal/ui/login/static/resources/themes/caos/css/dark.css +++ b/internal/ui/login/static/resources/themes/caos/css/dark.css @@ -101,6 +101,7 @@ h1 { p { font-weight: 300; + text-align: center; } header { @@ -173,6 +174,42 @@ input:not([type=radio]), select { padding-left: 15px; } +form button.user-selection .profile-image, .login-profile .profile-image { + height: 100px; + background-position: center; + background-repeat: no-repeat; + background-image: url("../../../images/icon-user-dark.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection .profile-image, .login-profile .profile-image { + background-image: url("../../../images/icon-user-dark@2x.png"); + background-size: 100px 100px; + } +} +form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover@2x.png"); + background-size: 100px 100px; + } +} + +.login-profile .names { + padding: 10px 0; + text-align: center; +} +.login-profile .names div:first-of-type { + font-size: 1.3rem; +} +.login-profile .names div:nth-of-type(2) { + font-weight: 300; + font-size: 0.9rem; + font-style: italic; + color: #898989; +} + form .field { display: grid; padding: 10px 0; @@ -228,26 +265,6 @@ form button.clean * { form .user-selection-list { margin-bottom: 80px; } -form button.user-selection .profile-image { - width: 100px; - height: 100px; - background-image: url("/resources/images/icon-user-dark.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection .profile-image { - background-image: url("/resources/images/icon-user-dark@2x.png"); - background-size: 100px 100px; - } -} -form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover@2x.png"); - background-size: 100px 100px; - } -} form button.user-selection .sessionstate { display: inline-block; height: 20px; @@ -286,22 +303,22 @@ form button.other-user .other-user-image { height: 75px; background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark.png"); + background-image: url("../../../images/icon-newuser-dark.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user .other-user-image { - background-image: url("/resources/images/icon-newuser-dark@2x.png"); + background-image: url("../../../images/icon-newuser-dark@2x.png"); background-size: 100px 75px; } } form button.other-user:hover .other-user-image { background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark-hover.png"); + background-image: url("../../../images/icon-newuser-dark-hover.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user:hover .other-user-image { - background-image: url("/resources/images/icon-newuser-dark-hover@2x.png"); + background-image: url("../../../images/icon-newuser-dark-hover@2x.png"); background-size: 100px 75px; } } diff --git a/internal/ui/login/static/resources/themes/caos/css/dark.css.map b/internal/ui/login/static/resources/themes/caos/css/dark.css.map index 7c64622f47..20cacfeb77 100644 --- a/internal/ui/login/static/resources/themes/caos/css/dark.css.map +++ b/internal/ui/login/static/resources/themes/caos/css/dark.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCMW;EDLX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCDc;EDEd,OCDQ;EDER;EACA;EACA;;;AAMJ;EACI,OCXQ;EDYR,aClBS;EDmBT;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCxCW;EDyCX;EACA;;AAEA;EACI,OC5CY;;;ADgDpB;EACI,kBCpDc;EDqDd,OCnDW;EDoDX;EACA;EACA;EACA;EACA,QErEU;EFsEV;EACA;EACA;;AACA;EACI,kBC5DY;ED6DZ,OChEU;EDiEV;;AAGJ;EACI,kBCnEO;EDoEP,OCrEI;EDsEJ;;AACA;EACI,kBCtEQ;;AD0EhB;EACI,kBEnEW;EFoEX;;AAEA;EACI,kBEvEO;EFwEP;;;AAKZ;EACI,kBE7EmB;EF8EnB,OCzFQ;ED0FR,QEtGU;EFuGV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OE9GK;EF+GL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCjJI;EDkJJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBE9IW;;AFiJf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EE3KV;;AACA;EFwKM;IEvKJ;IACA;;;AF6KQ;EEhLV;;AACA;EF+KU;IE9KR;IACA;;;AFkLI;EACI;EACA;EACA;EACA;EACA,cE7KO;EF8KP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OEzMP;;AFgNL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EEnOV;;AACA;EF8NM;IE7NJ;IACA;;;AFqOQ;EACI;EACA;EE1Od;;AACA;EFuOU;IEtOR;IACA;;;AF4OI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OEnPN;;AFwPE;EACI,OE1PL;;;AFgQX;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MCxRI;;AD2RR;EACI,MC7RU;;;ADkSd;EACI;EACA;;;AAIR;EAEQ;EAEJ;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCMW;EDLX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCDc;EDEd,OCDQ;EDER;EACA;EACA;;;AAMJ;EACI,OCXQ;EDYR,aClBS;EDmBT;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCzCW;ED0CX;EACA;;AAEA;EACI,OC7CY;;;ADiDpB;EACI,kBCrDc;EDsDd,OCpDW;EDqDX;EACA;EACA;EACA;EACA,QEtEU;EFuEV;EACA;EACA;;AACA;EACI,kBC7DY;ED8DZ,OCjEU;EDkEV;;AAGJ;EACI,kBCpEO;EDqEP,OCtEI;EDuEJ;;AACA;EACI,kBCvEQ;;AD2EhB;EACI,kBEpEW;EFqEX;;AAEA;EACI,kBExEO;EFyEP;;;AAKZ;EACI,kBE9EmB;EF+EnB,OC1FQ;ED2FR,QEvGU;EFwGV;EACA;EACA;;;AAIA;EACI;EACA;EACA;EExGN;;AACA;EFoGE;IEnGA;IACA;;;AFyGA;EE5GF;;AACA;EF2GE;IE1GA;IACA;;;;AFiHA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA,OEpHC;;;AF0HT;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OEhJK;EFiJL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCnLI;EDoLJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBEhLW;;AFmLf;EACI;;AAIR;EACI;;AAMA;EACI;EACA;EACA;EACA;EACA,cErMO;EFsMP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OEjOP;;AFwOL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EE3PV;;AACA;EFsPM;IErPJ;IACA;;;AF6PQ;EACI;EACA;EElQd;;AACA;EF+PU;IE9PR;IACA;;;AFoQI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OE3QN;;AFgRE;EACI,OElRL;;;AFwRX;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MChTI;;ADmTR;EACI,MCrTU;;;AD0Td;EACI;EACA;;;AAIR;EAEQ;EAEJ;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"} \ No newline at end of file diff --git a/internal/ui/login/static/resources/themes/caos/css/light.css b/internal/ui/login/static/resources/themes/caos/css/light.css index f305a05bb0..91d77182fe 100644 --- a/internal/ui/login/static/resources/themes/caos/css/light.css +++ b/internal/ui/login/static/resources/themes/caos/css/light.css @@ -101,6 +101,7 @@ h1 { p { font-weight: 300; + text-align: center; } header { @@ -173,6 +174,42 @@ input:not([type=radio]), select { padding-left: 15px; } +form button.user-selection .profile-image, .login-profile .profile-image { + height: 100px; + background-position: center; + background-repeat: no-repeat; + background-image: url("../../../images/icon-user-dark.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection .profile-image, .login-profile .profile-image { + background-image: url("../../../images/icon-user-dark@2x.png"); + background-size: 100px 100px; + } +} +form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover@2x.png"); + background-size: 100px 100px; + } +} + +.login-profile .names { + padding: 10px 0; + text-align: center; +} +.login-profile .names div:first-of-type { + font-size: 1.3rem; +} +.login-profile .names div:nth-of-type(2) { + font-weight: 300; + font-size: 0.9rem; + font-style: italic; + color: #898989; +} + form .field { display: grid; padding: 10px 0; @@ -228,26 +265,6 @@ form button.clean * { form .user-selection-list { margin-bottom: 80px; } -form button.user-selection .profile-image { - width: 100px; - height: 100px; - background-image: url("/resources/images/icon-user-dark.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection .profile-image { - background-image: url("/resources/images/icon-user-dark@2x.png"); - background-size: 100px 100px; - } -} -form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover@2x.png"); - background-size: 100px 100px; - } -} form button.user-selection .sessionstate { display: inline-block; height: 20px; @@ -286,22 +303,22 @@ form button.other-user .other-user-image { height: 75px; background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark.png"); + background-image: url("../../../images/icon-newuser-dark.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user .other-user-image { - background-image: url("/resources/images/icon-newuser-dark@2x.png"); + background-image: url("../../../images/icon-newuser-dark@2x.png"); background-size: 100px 75px; } } form button.other-user:hover .other-user-image { background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark-hover.png"); + background-image: url("../../../images/icon-newuser-dark-hover.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user:hover .other-user-image { - background-image: url("/resources/images/icon-newuser-dark-hover@2x.png"); + background-image: url("../../../images/icon-newuser-dark-hover@2x.png"); background-size: 100px 75px; } } diff --git a/internal/ui/login/static/resources/themes/caos/css/light.css.map b/internal/ui/login/static/resources/themes/caos/css/light.css.map index 315efc4d31..0677feb25c 100644 --- a/internal/ui/login/static/resources/themes/caos/css/light.css.map +++ b/internal/ui/login/static/resources/themes/caos/css/light.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"} \ No newline at end of file diff --git a/internal/ui/login/static/resources/themes/scss/main.scss b/internal/ui/login/static/resources/themes/scss/main.scss index a273270e57..9b8533459d 100644 --- a/internal/ui/login/static/resources/themes/scss/main.scss +++ b/internal/ui/login/static/resources/themes/scss/main.scss @@ -34,6 +34,7 @@ h1 { p { font-weight: 300; + text-align: center; } header { @@ -111,6 +112,40 @@ input:not([type='radio']), select { padding-left: 15px; } +%profile-image { + .profile-image { + height: 100px; + width: 100px; + background-position: center; + background-repeat: no-repeat; + @include retina-background-image($profileImgDark, "png", false, 100px, 100px); + } + + &:hover .profile-image { + @include retina-background-image($profileImgDark, "png", true, 100px, 100px); + } +} + +.login-profile { + @extend %profile-image; + + .names { + padding: 10px 0; + text-align: center; + + div:first-of-type { + font-size: 1.3rem; + } + + div:nth-of-type(2) { + font-weight: 300; + font-size: 0.9rem; + font-style: italic; + color: $labelColor; + } + } +} + form { .field { display: grid; @@ -181,17 +216,7 @@ form { } button.user-selection { - .profile-image { - width: 100px; - height: 100px; - @include retina-background-image($profileImgDark, "png", false, 100px, 100px); - } - - &:hover { - .profile-image { - @include retina-background-image($profileImgDark, "png", true, 100px, 100px); - } - } + @extend %profile-image; .sessionstate { display: inline-block; diff --git a/internal/ui/login/static/resources/themes/scss/variables.scss b/internal/ui/login/static/resources/themes/scss/variables.scss index ff1513c401..782b3ac46e 100644 --- a/internal/ui/login/static/resources/themes/scss/variables.scss +++ b/internal/ui/login/static/resources/themes/scss/variables.scss @@ -28,8 +28,8 @@ $labelColor: #898989; $inputBorderColor: #505050; $inputBackgroundColor: #252525; $buttonBackgroundColorHover: $inputBackgroundColor; -$profileImgDark: "/resources/images/icon-user-dark"; -$otherUserImgDark: "/resources/images/icon-newuser-dark"; +$profileImgDark: "../../../images/icon-user-dark"; +$otherUserImgDark: "../../../images/icon-newuser-dark"; $nokColor: #F20D6B; $okColor: #0DF279; @@ -41,5 +41,5 @@ $primaryColorLight: $primaryColor; $primaryColorHoverLight: lighten($primaryColorLight, 10%); $inputBackgroundColorLight: #FFFFFF; $buttonBackgroundColorHoverLight: $inputBackgroundColor; -$profileImgLight: "/resources/images/icon-user-light"; -$otherUserImgLight: "/resources/images/icon-newuser-light"; \ No newline at end of file +$profileImgLight: "../../../images/icon-user-light"; +$otherUserImgLight: "../../../images/icon-newuser-light"; \ No newline at end of file diff --git a/internal/ui/login/static/resources/themes/zitadel/css/dark.css b/internal/ui/login/static/resources/themes/zitadel/css/dark.css index 53a126beec..f7cd68e366 100644 --- a/internal/ui/login/static/resources/themes/zitadel/css/dark.css +++ b/internal/ui/login/static/resources/themes/zitadel/css/dark.css @@ -102,6 +102,7 @@ h1 { p { font-weight: 300; + text-align: center; } header { @@ -174,6 +175,42 @@ input:not([type=radio]), select { padding-left: 15px; } +form button.user-selection .profile-image, .login-profile .profile-image { + height: 100px; + background-position: center; + background-repeat: no-repeat; + background-image: url("../../../images/icon-user-dark.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection .profile-image, .login-profile .profile-image { + background-image: url("../../../images/icon-user-dark@2x.png"); + background-size: 100px 100px; + } +} +form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover@2x.png"); + background-size: 100px 100px; + } +} + +.login-profile .names { + padding: 10px 0; + text-align: center; +} +.login-profile .names div:first-of-type { + font-size: 1.3rem; +} +.login-profile .names div:nth-of-type(2) { + font-weight: 300; + font-size: 0.9rem; + font-style: italic; + color: #898989; +} + form .field { display: grid; padding: 10px 0; @@ -229,26 +266,6 @@ form button.clean * { form .user-selection-list { margin-bottom: 80px; } -form button.user-selection .profile-image { - width: 100px; - height: 100px; - background-image: url("/resources/images/icon-user-dark.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection .profile-image { - background-image: url("/resources/images/icon-user-dark@2x.png"); - background-size: 100px 100px; - } -} -form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover@2x.png"); - background-size: 100px 100px; - } -} form button.user-selection .sessionstate { display: inline-block; height: 20px; @@ -287,22 +304,22 @@ form button.other-user .other-user-image { height: 75px; background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark.png"); + background-image: url("../../../images/icon-newuser-dark.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user .other-user-image { - background-image: url("/resources/images/icon-newuser-dark@2x.png"); + background-image: url("../../../images/icon-newuser-dark@2x.png"); background-size: 100px 75px; } } form button.other-user:hover .other-user-image { background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark-hover.png"); + background-image: url("../../../images/icon-newuser-dark-hover.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user:hover .other-user-image { - background-image: url("/resources/images/icon-newuser-dark-hover@2x.png"); + background-image: url("../../../images/icon-newuser-dark-hover@2x.png"); background-size: 100px 75px; } } diff --git a/internal/ui/login/static/resources/themes/zitadel/css/dark.css.map b/internal/ui/login/static/resources/themes/zitadel/css/dark.css.map index c95bcfc3d3..dc212a8e4f 100644 --- a/internal/ui/login/static/resources/themes/zitadel/css/dark.css.map +++ b/internal/ui/login/static/resources/themes/zitadel/css/dark.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCKc;EDJd,OCKQ;EDJR;EACA;EACA;EAEI;;;AAIR;EACI,OCLQ;EDMR,aC3BS;ED4BT;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OClCW;EDmCX;EACA;;AAEA;EACI,OCtCY;;;AD0CpB;EACI,kBC9Cc;ED+Cd,OC7CW;ED8CX;EACA;EACA;EACA;EACA,QCrEU;EDsEV;EACA;EACA;;AACA;EACI,kBCtDY;EDuDZ,OC1DU;ED2DV;;AAGJ;EACI,kBC7DO;ED8DP,OC/DI;EDgEJ;;AACA;EACI,kBChEQ;;ADoEhB;EACI,kBCnEW;EDoEX;;AAEA;EACI,kBCvEO;EDwEP;;;AAKZ;EACI,kBC7EmB;ED8EnB,OCnFQ;EDoFR,QCtGU;EDuGV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OC9GK;ED+GL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OC3II;ED4IJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBC9IW;;ADiJf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EC3KV;;AACA;EDwKM;ICvKJ;IACA;;;AD6KQ;EChLV;;AACA;ED+KU;IC9KR;IACA;;;ADkLI;EACI;EACA;EACA;EACA;EACA,cC7KO;ED8KP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OCzMP;;ADgNL;EACI;;AAEJ;EACI;EACA;EACA;EACA;ECnOV;;AACA;ED8NM;IC7NJ;IACA;;;ADqOQ;EACI;EACA;EC1Od;;AACA;EDuOU;ICtOR;IACA;;;AD4OI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OCnPN;;ADwPE;EACI,OC1PL;;;ADgQX;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MClRI;;ADqRR;EACI,MCvRU;;;AD4Rd;EACI;EACA;;;AAIR;EAII;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCKc;EDJd,OCKQ;EDJR;EACA;EACA;EAEI;;;AAIR;EACI,OCLQ;EDMR,aC3BS;ED4BT;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCnCW;EDoCX;EACA;;AAEA;EACI,OCvCY;;;AD2CpB;EACI,kBC/Cc;EDgDd,OC9CW;ED+CX;EACA;EACA;EACA;EACA,QCtEU;EDuEV;EACA;EACA;;AACA;EACI,kBCvDY;EDwDZ,OC3DU;ED4DV;;AAGJ;EACI,kBC9DO;ED+DP,OChEI;EDiEJ;;AACA;EACI,kBCjEQ;;ADqEhB;EACI,kBCpEW;EDqEX;;AAEA;EACI,kBCxEO;EDyEP;;;AAKZ;EACI,kBC9EmB;ED+EnB,OCpFQ;EDqFR,QCvGU;EDwGV;EACA;EACA;;;AAIA;EACI;EACA;EACA;ECxGN;;AACA;EDoGE;ICnGA;IACA;;;ADyGA;EC5GF;;AACA;ED2GE;IC1GA;IACA;;;;ADiHA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA,OCpHC;;;AD0HT;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OChJK;EDiJL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OC7KI;ED8KJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBChLW;;ADmLf;EACI;;AAIR;EACI;;AAMA;EACI;EACA;EACA;EACA;EACA,cCrMO;EDsMP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OCjOP;;ADwOL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EC3PV;;AACA;EDsPM;ICrPJ;IACA;;;AD6PQ;EACI;EACA;EClQd;;AACA;ED+PU;IC9PR;IACA;;;ADoQI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OC3QN;;ADgRE;EACI,OClRL;;;ADwRX;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC1SI;;AD6SR;EACI,MC/SU;;;ADoTd;EACI;EACA;;;AAIR;EAII;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"} \ No newline at end of file diff --git a/internal/ui/login/static/resources/themes/zitadel/css/light.css b/internal/ui/login/static/resources/themes/zitadel/css/light.css index 17c0e4d634..a158dcb337 100644 --- a/internal/ui/login/static/resources/themes/zitadel/css/light.css +++ b/internal/ui/login/static/resources/themes/zitadel/css/light.css @@ -102,6 +102,7 @@ h1 { p { font-weight: 300; + text-align: center; } header { @@ -174,6 +175,42 @@ input:not([type=radio]), select { padding-left: 15px; } +form button.user-selection .profile-image, .login-profile .profile-image { + height: 100px; + background-position: center; + background-repeat: no-repeat; + background-image: url("../../../images/icon-user-dark.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection .profile-image, .login-profile .profile-image { + background-image: url("../../../images/icon-user-dark@2x.png"); + background-size: 100px 100px; + } +} +form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover.png"); +} +@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { + form button.user-selection:hover .profile-image, .login-profile:hover .profile-image { + background-image: url("../../../images/icon-user-dark-hover@2x.png"); + background-size: 100px 100px; + } +} + +.login-profile .names { + padding: 10px 0; + text-align: center; +} +.login-profile .names div:first-of-type { + font-size: 1.3rem; +} +.login-profile .names div:nth-of-type(2) { + font-weight: 300; + font-size: 0.9rem; + font-style: italic; + color: #898989; +} + form .field { display: grid; padding: 10px 0; @@ -229,26 +266,6 @@ form button.clean * { form .user-selection-list { margin-bottom: 80px; } -form button.user-selection .profile-image { - width: 100px; - height: 100px; - background-image: url("/resources/images/icon-user-dark.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection .profile-image { - background-image: url("/resources/images/icon-user-dark@2x.png"); - background-size: 100px 100px; - } -} -form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover.png"); -} -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { - form button.user-selection:hover .profile-image { - background-image: url("/resources/images/icon-user-dark-hover@2x.png"); - background-size: 100px 100px; - } -} form button.user-selection .sessionstate { display: inline-block; height: 20px; @@ -287,22 +304,22 @@ form button.other-user .other-user-image { height: 75px; background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark.png"); + background-image: url("../../../images/icon-newuser-dark.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user .other-user-image { - background-image: url("/resources/images/icon-newuser-dark@2x.png"); + background-image: url("../../../images/icon-newuser-dark@2x.png"); background-size: 100px 75px; } } form button.other-user:hover .other-user-image { background-repeat: no-repeat; background-position: center; - background-image: url("/resources/images/icon-newuser-dark-hover.png"); + background-image: url("../../../images/icon-newuser-dark-hover.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) { form button.other-user:hover .other-user-image { - background-image: url("/resources/images/icon-newuser-dark-hover@2x.png"); + background-image: url("../../../images/icon-newuser-dark-hover@2x.png"); background-size: 100px 75px; } } diff --git a/internal/ui/login/static/resources/themes/zitadel/css/light.css.map b/internal/ui/login/static/resources/themes/zitadel/css/light.css.map index 25d7d1d891..5d23d731c1 100644 --- a/internal/ui/login/static/resources/themes/zitadel/css/light.css.map +++ b/internal/ui/login/static/resources/themes/zitadel/css/light.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"} \ No newline at end of file diff --git a/internal/ui/login/static/templates/change_password.html b/internal/ui/login/static/templates/change_password.html index 414bce6329..5b1ad3221d 100644 --- a/internal/ui/login/static/templates/change_password.html +++ b/internal/ui/login/static/templates/change_password.html @@ -1,6 +1,7 @@ {{template "main-top" .}} -

{{t "PasswordChange.Title"}}

+{{ template "user-profile" . }} +

{{t "PasswordChange.Description"}}

diff --git a/internal/ui/login/static/templates/change_password_done.html b/internal/ui/login/static/templates/change_password_done.html index 37065892cd..70d356d0f6 100644 --- a/internal/ui/login/static/templates/change_password_done.html +++ b/internal/ui/login/static/templates/change_password_done.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "PasswordChangeDone.Title"}}

{{t "PasswordChangeDone.Description"}}

diff --git a/internal/ui/login/static/templates/init_password.html b/internal/ui/login/static/templates/init_password.html index 9692fa7f2d..a7f332c06a 100644 --- a/internal/ui/login/static/templates/init_password.html +++ b/internal/ui/login/static/templates/init_password.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "InitPassword.Title" }}

{{t "InitPassword.Description" }}

diff --git a/internal/ui/login/static/templates/init_password_done.html b/internal/ui/login/static/templates/init_password_done.html index bd2e494079..8ac1092d61 100644 --- a/internal/ui/login/static/templates/init_password_done.html +++ b/internal/ui/login/static/templates/init_password_done.html @@ -1,8 +1,9 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "PasswordSetDone.Title"}}

{{t "PasswordSetDone.Description"}}

+ {{ .CSRF }} diff --git a/internal/ui/login/static/templates/init_user.html b/internal/ui/login/static/templates/init_user.html index ac0a038966..c274b8aa0e 100644 --- a/internal/ui/login/static/templates/init_user.html +++ b/internal/ui/login/static/templates/init_user.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "InitUser.Title" }}

{{t "InitUser.Description" }}

diff --git a/internal/ui/login/static/templates/init_user_done.html b/internal/ui/login/static/templates/init_user_done.html index 54d66bbee9..9a116645e5 100644 --- a/internal/ui/login/static/templates/init_user_done.html +++ b/internal/ui/login/static/templates/init_user_done.html @@ -1,8 +1,9 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "InitUserDone.Title"}}

{{t "InitUserDone.Description"}}

+ {{ .CSRF }} diff --git a/internal/ui/login/static/templates/mail_verification.html b/internal/ui/login/static/templates/mail_verification.html index 0a8e58c1dc..a2cc465f5b 100644 --- a/internal/ui/login/static/templates/mail_verification.html +++ b/internal/ui/login/static/templates/mail_verification.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "EmailVerification.Title"}}

{{t "EmailVerification.Description"}}

diff --git a/internal/ui/login/static/templates/mail_verified.html b/internal/ui/login/static/templates/mail_verified.html index 8f832da0e6..ea4756722d 100644 --- a/internal/ui/login/static/templates/mail_verified.html +++ b/internal/ui/login/static/templates/mail_verified.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "EmailVerificationDone.Title"}}

{{t "EmailVerificationDone.Description"}}

diff --git a/internal/ui/login/static/templates/mfa_init_done.html b/internal/ui/login/static/templates/mfa_init_done.html index 55690f5e0b..5b479700f4 100644 --- a/internal/ui/login/static/templates/mfa_init_done.html +++ b/internal/ui/login/static/templates/mfa_init_done.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "MfaInitDone.Title"}}

{{t "MfaInitDone.Description"}}

diff --git a/internal/ui/login/static/templates/mfa_init_verify.html b/internal/ui/login/static/templates/mfa_init_verify.html index e4e27ee3a4..0e6fead1d8 100644 --- a/internal/ui/login/static/templates/mfa_init_verify.html +++ b/internal/ui/login/static/templates/mfa_init_verify.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "MfaInitVerify.Title"}}

{{t "MfaInitVerify.Description"}}

diff --git a/internal/ui/login/static/templates/mfa_prompt.html b/internal/ui/login/static/templates/mfa_prompt.html index 6e95e1fff9..ff0b00d52f 100644 --- a/internal/ui/login/static/templates/mfa_prompt.html +++ b/internal/ui/login/static/templates/mfa_prompt.html @@ -1,7 +1,8 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "MfaPrompt.Title"}}

+

{{t "MfaPrompt.Description"}}

diff --git a/internal/ui/login/static/templates/mfa_verify.html b/internal/ui/login/static/templates/mfa_verify.html index 9520a7a3b6..86361ab2a8 100644 --- a/internal/ui/login/static/templates/mfa_verify.html +++ b/internal/ui/login/static/templates/mfa_verify.html @@ -1,7 +1,7 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "MfaVerify.Title"}}

{{t "MfaVerify.Description"}}

diff --git a/internal/ui/login/static/templates/password.html b/internal/ui/login/static/templates/password.html index 3f30c21958..1a66437292 100644 --- a/internal/ui/login/static/templates/password.html +++ b/internal/ui/login/static/templates/password.html @@ -1,7 +1,8 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "Password.Title"}}

+

{{t "Password.Description"}}

diff --git a/internal/ui/login/static/templates/password_reset_done.html b/internal/ui/login/static/templates/password_reset_done.html index 0afe1403d0..ba93b24852 100644 --- a/internal/ui/login/static/templates/password_reset_done.html +++ b/internal/ui/login/static/templates/password_reset_done.html @@ -1,8 +1,9 @@ {{template "main-top" .}} +{{ template "user-profile" . }} -

{{t "PasswordResetDone.Title"}}

{{t "PasswordResetDone.Description"}}

+ {{ .CSRF }} diff --git a/internal/ui/login/static/templates/user_profile.html b/internal/ui/login/static/templates/user_profile.html new file mode 100644 index 0000000000..7728af0d4c --- /dev/null +++ b/internal/ui/login/static/templates/user_profile.html @@ -0,0 +1,13 @@ +{{define "user-profile"}} +{{if .LoginName}} + +{{end}} +{{end}} \ No newline at end of file