diff --git a/ansible/artifacts/sunbird/login/login.ftl b/ansible/artifacts/sunbird/login/login.ftl
index 0cd999ef0ce827d43200fa616e5d79c12d4cdd5c..1a6090341b4e77f0a5f22ccc5e28f0c511bc50cc 100644
--- a/ansible/artifacts/sunbird/login/login.ftl
+++ b/ansible/artifacts/sunbird/login/login.ftl
@@ -8,8 +8,9 @@
<div class="fullpage-background-image">
<div class="container-wrapper">
<div class="ui header centered mb-8">
+ <img onerror="" alt="">
+ <h2 id="signIn" class="signInHead mt-8 mb-8">${msg("loginDiksha")}</h2>
<p class="subtitle">Login</p>
- <p id="signIn" class="info mt-8 mb-8">${msg("loginDiksha")} <span class="required">*</span></p>
</div>
<p id="mergeAccountMessage" class="hide mb-0 textCenter">${msg("mergeAccountMessage")}</p>
<p id="migrateAccountMessage" class="hide mb-0 textCenter">${msg("migrateAccountMessage")}</p>
@@ -29,14 +30,12 @@
<#elseif !realm.registrationEmailAsUsername>${msg("emailOrPhone")}
<#else>${msg("email")}
</#if>
- <span class="required">*</span>
</label>
<label id="usernameLabelPlaceholder" for="username" class="activeLabelColor hide">
<#if !realm.loginWithEmailAllowed>${msg("username")}
<#elseif !realm.registrationEmailAsUsername>${msg("placeholderForEmailOrPhone")}
<#else>${msg("email")}
</#if>
- <span class="required">*</span>
</label>
<#if usernameEditDisabled??>
<#-- TODO: need to find alternative for prepopulating username -->
@@ -49,12 +48,10 @@
<div>
<label id="passwordLabel" for="password" class="">
${msg("password")}
- <span class="required">*</span>
</label>
<label id="passwordLabelPlaceholder" for="password" class="activeLabelColor hide">
${msg("placeholderForPassword")}
- <span class="required">*</span>
</label>
</div>
<input placeholder="${msg('passwordPlaceholder')}" class=" mt-8" id="password" onfocusin="inputBoxFocusIn(this)" onfocusout="inputBoxFocusOut(this)" name="password" type="password" autocomplete="current-password" />
@@ -67,7 +64,7 @@
</div>
<div class="forgot-password">
<#if realm.resetPasswordAllowed>
- ${msg("forgotAccount")}
+ <a id="fgtKeycloakFlow" class="ui right floated forgetPasswordLink hide" tabindex="0" onclick="javascript:storeLocation(); javascript:makeDivUnclickable(); javascript:storeForgotPasswordLocation(event);" href="${url.loginResetCredentialsUrl}">${msg("doForgotPassword")}</a>
<div id="fgtPortalFlow" role="link" class="ui right floated forgetPasswordLink hide" tabindex="0" onclick="javascript:makeDivUnclickable(); javascript:createTelemetryEvent(event); javascript:forgetPassword('/recover/identify/account');">${msg("doForgotPassword")}</div>
</#if>
</div>
diff --git a/ansible/artifacts/sunbird/login/messages/messages_en.properties b/ansible/artifacts/sunbird/login/messages/messages_en.properties
index 86565a07a662e357b9f96fd8990fed181ecc7ca0..6ab91bf82eabd8116ff8eacd722990e2c8f5b59a 100644
--- a/ansible/artifacts/sunbird/login/messages/messages_en.properties
+++ b/ansible/artifacts/sunbird/login/messages/messages_en.properties
@@ -13,7 +13,7 @@ doNo=No
doContinue=Continue
doAccept=Accept
doDecline=Decline
-doForgotPassword=Reset password
+doForgotPassword=Forgot password?
doClickHere=Click here
doImpersonate=Impersonate
kerberosNotConfigured=Kerberos Not Configured
@@ -53,7 +53,6 @@ recaptchaNotConfigured=Recaptcha is required, but not configured
consentDenied=Consent denied.
noAccount=Don''t have an account?
-forgotAccount=Did you forget the password?
username=Username or Mobile number
goBack=<<Go Back
mergeAccountMessage=Enter Mobile number / Email Address OR use Login with Google to identify the account from which you want to merge usage details
@@ -272,5 +271,5 @@ user_not_found=This Email Address/Mobile Number doesn''t belong to a valid user
p3pPolicy=CP="This is not a P3P policy!"
usernamePlaceholder = Enter your Registered Email address/Mobile number
passwordPlaceholder = Enter your password
-loginDiksha = All the required fields are marked with an
+loginDiksha = Welcome to UPSMF
registerHere = Register here
diff --git a/ansible/artifacts/sunbird/login/resources/css/login.css b/ansible/artifacts/sunbird/login/resources/css/login.css
index 70178f06d2e01669e6e6f8fb8528c3cee951cb51..8457c100f2aa0564bb0211a78318f2308deee0b2 100644
--- a/ansible/artifacts/sunbird/login/resources/css/login.css
+++ b/ansible/artifacts/sunbird/login/resources/css/login.css
@@ -1,10 +1,9 @@
@import "./fonts/notosans/notosans.css";
-@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@700&display=swap');
body{
font-family: "Noto Sans";
position: relative;
letter-spacing: 0.2px;
- /* background: #edf4f9; */
+ background: #edf4f9;
}
.fullpage-background-image{
width: 100% !important;
@@ -54,7 +53,7 @@ input{
border: 1px solid #9B9B9B !important;
}
input:focus{
- border: 1px solid rgba(236,73,51,1) !important;
+ border: 1px solid #024f9d !important;
}
.signInWithGoogle{
position: absolute;
@@ -98,9 +97,6 @@ input:focus{
text-align: left;
/*margin-top: auto !important;*/
margin-bottom: 10px !important;
- display: flex;
- align-items: baseline;
- justify-content: space-between;
}
.formMsg{
font-size: 16px;
@@ -115,14 +111,12 @@ input:focus{
text-align: center;
}
p.subtitle {
- opacity: 1;
- color: rgba(0,0,0,1);
- font-size: 24px;
- font-weight: 700;
- font-style: normal;
- letter-spacing: 0px;
+ color: #333333;
+ font-size: 18px;
+ font-weight: bold;
+ letter-spacing: 0;
+ line-height: 26px;
text-align: center;
- margin-bottom: 8px;
}
.ui.form .field>label {
font-size: 14px;
@@ -270,13 +264,9 @@ a{
color: #024f9d !important;
}
.registerLink{
- opacity: 1;
- color: rgba(236,73,51,1);
- font-size: 14px;
- font-weight: 700;
- font-style: normal;
- letter-spacing: 0px;
- text-align: right;
+ color: #024f9d;
+ font-weight: bold;
+ text-decoration: underline;
}
.registerLink:hover,
.registerLink:focus{
@@ -396,9 +386,7 @@ h1, h2, h3, h4, h5,
}
.sb-btn-primary:hover {
- background-color: #FFF5F3;
- border-color: rgba(236,73,51,1);
- color: rgba(236,73,51,1);
+ background-color: #002e50;
}
.sb-btn-success {
@@ -465,7 +453,7 @@ h1, h2, h3, h4, h5,
justify-content: center;
height: 100%;
padding: 32px;
- /* background-image: linear-gradient(180deg, rgba(246, 170, 156, 1) 0%, rgba(253, 227, 222, 1) 100%) !important; */
+ background: #edf4f9;
}
.container-wrapper {
max-width: 328px;
@@ -485,25 +473,6 @@ h1, h2, h3, h4, h5,
.forgot-password {
font-size:11px;
color:#333;
- display: flex;
- justify-content: space-between;
- width: 100%;
- align-items: baseline;
- font-size: 12px;
- line-height: 17px;
- text-align: left;
- display: flex;
- align-items: baseline;
- justify-content: space-between;
-}
-.forgot-password p{
- opacity: 1;
- color: rgba(0,0,0,1);
- font-size: 14px;
- font-weight: 400;
- font-style: normal;
- letter-spacing: 0px;
- text-align: left;
}
.forgot-password:hover {
color:#024f9d;
@@ -633,9 +602,9 @@ h1, h2, h3, h4, h5,
background-size: cover;
background-repeat: no-repeat;
min-height: 100vh;
- background: url(../img/bg.png) no-repeat center center fixed;
+ background: url(../img/onboard_bg.svg) no-repeat center center fixed;
background-size: cover;
- background-color: #000;
+
}
.fullpage-background-image{
max-width: 1008px !important;
@@ -668,93 +637,4 @@ h1, h2, h3, h4, h5,
input:focus-visible{
outline: 1px #fe0000 solid !important;
border-radius: 5px;
- }
-
-
- .kc-container-wrapper{
- /* opacity: 1; */
- /* background-image: linear-gradient(90deg, rgba(236, 80, 51, 1) 0%, rgba(253, 235, 232, 1) 100%); */
- }
- .fullpage-background-image {
-
- background: #ffffff;
- max-width: 661px !important; width: 100%; padding: 40px !important; /* box-shadow: 0 2px 16px 0Â rgba(0,0,0,0.2)Â !important; */ border-radius: 8px !important; min-height: 480px; opacity: 1;
- }
-
- .activeLabelColor{ color: #000000 !important;
- }
-
- .forgetPasswordLink{
- color: #024f9d;
- font-size: 12px;
- line-height: 17px;
- float: right;
- color: rgba(236,73,51,1) !important;
- font-size: 14px;
- font-weight: 700;
- font-style: normal;
- letter-spacing: 0px;
- text-align: right;
- display: block !important;
- }
-
-
- .sb-btn-primary{
- border-color: rgba(236,73,51,1);
- background-color: rgba(236,73,51,1);
- color: white;
- opacity: 1;
- color: rgba(255,255,255,1);
- font-size: 14px;
- font-weight: 400;
- font-style: normal;
- letter-spacing: 0px;
- text-align: center;
- }
- .registerLink {
- color: rgba(236,73,51,1);
- }
-header .navigation {
- display: flex;
- justify-content: space-between;
- align-items: center;
- position: fixed;
- min-height: 80px;
- max-height: 80px;
- min-width: 100%;
- z-index: 10;
- background: white;
- border-bottom: 2px solid white;
-}
-
-header .navigation .logo{
- margin-left: 20px;
-}
-header .navigation .logo img {
- width: 291px;
- height: 48px;
-}
-header .navigation .logo h1{
- color: #b1d4e0;
- font-size: 30px;
- line-height: 38px;
-}
-.info {
- opacity: 1;
- color: rgba(0,0,0,0.8);
- font-family: "NotoSans";
- font-size: 14px;
- font-weight: 400;
- font-style: normal;
- letter-spacing: 0px;
-}
-span.required {
- color: #e55a28;
- font-size: 14px;
-}
-
-
-
-
-
-
\ No newline at end of file
+ }
\ No newline at end of file
diff --git a/ansible/artifacts/sunbird/login/resources/css/styles.css b/ansible/artifacts/sunbird/login/resources/css/styles.css
index 9f692f9c3bb57aab4409c567596e31c362b4e2a5..a4f1b022a5cd0b3db43aa20db037773de20a4bd2 100644
--- a/ansible/artifacts/sunbird/login/resources/css/styles.css
+++ b/ansible/artifacts/sunbird/login/resources/css/styles.css
@@ -15,186 +15,185 @@
* limitations under the License.
*/
- @import url('../../keycloak/lib/zocial/zocial.css');
-
- body {
- background-color: #012951;
- background-size: cover;
- background-repeat: no-repeat;
- color: #fff;
- font-family: sans-serif;
- /* text-shadow: 0px 0px 10px #000; */
- margin: 0px;
- }
-
- a {
- color: #fff;
- }
-
- div#kc-logo {
- background-image: url('../img/bkgrnd.png');
- background-repeat: no-repeat;
- background-color: #fff;
- background-size: contain;
- height:110px;
- }
-
- div#kc-locale {
- display: none;
- }
-
- div#kc-content {
- position: absolute;
- top: 30%;
- left: 50%;
- width: 550px;
- margin-left: -225px;
- }
-
- div#kc-form {
- float: left;
- width: 350px;
- }
-
- div#kc-form label {
- display: block;
- font-size: 16px;
- }
-
- div#info-area {
- position: fixed;
- bottom: 0;
- left: 0;
- margin-top: 40px;
- background-color: rgba(0, 0, 0, 0.4);
- padding: 20px;
- width: 100%;
- }
-
- div#info-area p {
- margin-right: 30px;
- display: inline;
- text-shadow: none;
- }
-
- input[type=text], input[type=password] {
- color: #ddd;
- font-size: 18px;
- margin-bottom: 20px;
- background-color: rgba(3,70,114,0.15);
- border: 0px solid rgba(0,0,0,0.2);
- box-shadow:inset 0 0 2px 2px rgba(0,0,0,0.15);
- padding: 10px;
- width: 296px;
- }
-
- input[type=text]:hover, input[type=password]:hover {
- background-color: rgba(3,70,114,0.4);
- }
-
- input[type=submit] {
- border: none;
- background: #fff;
- background: -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
- background: -ms-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
- background: -o-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
- box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
- /* color: rgba(0,0,0,0.6); */
- font-size: 14px;
- font-weight: bold;
- padding: 10px;
- margin-top: 20px;
- margin-right: 10px;
- width: 150px;
- }
-
- input[type=submit]:hover {
- background-color: rgba(255,255,255,0.8);
- }
-
- div#kc-form-options div {
- display: inline;
- margin-right: 20px;
- font-size: 12px;
- }
-
- div#kc-form-options div label {
- font-size: 12px;
- }
-
- div#kc-feedback {
- box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- text-align: center;
- }
-
- div#kc-feedback-wrapper {
- padding: 1em;
- }
-
- div.feedback-success {
- background-color: rgba(155,155,255,0.1);
- }
-
- div.feedback-warning {
- background-color: rgba(255,175,0,0.1);
- }
-
- div.feedback-error {
- background-color: rgba(255,0,0,0.1);
- }
-
- div#kc-header {
- display: none;
- }
-
- div#kc-registration {
- margin-bottom: 20px;
- }
-
- div#social-login {
- border-left: 1px solid rgba(255, 255, 255, 0.2);
- float: right;
- width: 150px;
- padding: 20px 0 200px 40px;
- }
-
- div.social-login span {
- display: none;
- }
-
- div#kc-social-providers ul {
- list-style: none;
- margin: 0;
- padding: 0;
- }
-
- div#kc-social-providers ul li {
- margin-bottom: 20px;
- }
-
- div#kc-social-providers ul li span {
- display: inline;
- width: 100px;
- }
-
- a.zocial {
- border: none;
- background: -webkit-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
- background: -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
- background: -ms-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
- background: -o-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
- box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
- color: rgba(0,0,0,0.6);
- width: 130px;
- text-shadow: none;
- -webkit-border-radius: 0;
- -moz-border-radius: 0;
- border-radius: 0;
- padding-top: 0.2em;
- padding-bottom: 0.2em;
- }
-
\ No newline at end of file
+@import url('../../keycloak/lib/zocial/zocial.css');
+
+body {
+ background-color: #012951;
+ background-size: cover;
+ background-repeat: no-repeat;
+ color: #fff;
+ font-family: sans-serif;
+ /* text-shadow: 0px 0px 10px #000; */
+ margin: 0px;
+}
+
+a {
+ color: #fff;
+}
+
+div#kc-logo {
+ background-image: url('../img/bkgrnd.png');
+ background-repeat: no-repeat;
+ background-color: #fff;
+ background-size: contain;
+ height:110px;
+}
+
+div#kc-locale {
+ display: none;
+}
+
+div#kc-content {
+ position: absolute;
+ top: 30%;
+ left: 50%;
+ width: 550px;
+ margin-left: -225px;
+}
+
+div#kc-form {
+ float: left;
+ width: 350px;
+}
+
+div#kc-form label {
+ display: block;
+ font-size: 16px;
+}
+
+div#info-area {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ margin-top: 40px;
+ background-color: rgba(0, 0, 0, 0.4);
+ padding: 20px;
+ width: 100%;
+}
+
+div#info-area p {
+ margin-right: 30px;
+ display: inline;
+ text-shadow: none;
+}
+
+input[type=text], input[type=password] {
+ color: #ddd;
+ font-size: 18px;
+ margin-bottom: 20px;
+ background-color: rgba(3,70,114,0.15);
+ border: 0px solid rgba(0,0,0,0.2);
+ box-shadow:inset 0 0 2px 2px rgba(0,0,0,0.15);
+ padding: 10px;
+ width: 296px;
+}
+
+input[type=text]:hover, input[type=password]:hover {
+ background-color: rgba(3,70,114,0.4);
+}
+
+input[type=submit] {
+ border: none;
+ background: #fff;
+ background: -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
+ background: -ms-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
+ background: -o-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
+ box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
+ /* color: rgba(0,0,0,0.6); */
+ font-size: 14px;
+ font-weight: bold;
+ padding: 10px;
+ margin-top: 20px;
+ margin-right: 10px;
+ width: 150px;
+}
+
+input[type=submit]:hover {
+ background-color: rgba(255,255,255,0.8);
+}
+
+div#kc-form-options div {
+ display: inline;
+ margin-right: 20px;
+ font-size: 12px;
+}
+
+div#kc-form-options div label {
+ font-size: 12px;
+}
+
+div#kc-feedback {
+ box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ text-align: center;
+}
+
+div#kc-feedback-wrapper {
+ padding: 1em;
+}
+
+div.feedback-success {
+ background-color: rgba(155,155,255,0.1);
+}
+
+div.feedback-warning {
+ background-color: rgba(255,175,0,0.1);
+}
+
+div.feedback-error {
+ background-color: rgba(255,0,0,0.1);
+}
+
+div#kc-header {
+ display: none;
+}
+
+div#kc-registration {
+ margin-bottom: 20px;
+}
+
+div#social-login {
+ border-left: 1px solid rgba(255, 255, 255, 0.2);
+ float: right;
+ width: 150px;
+ padding: 20px 0 200px 40px;
+}
+
+div.social-login span {
+ display: none;
+}
+
+div#kc-social-providers ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+div#kc-social-providers ul li {
+ margin-bottom: 20px;
+}
+
+div#kc-social-providers ul li span {
+ display: inline;
+ width: 100px;
+}
+
+a.zocial {
+ border: none;
+ background: -webkit-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
+ background: -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
+ background: -ms-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
+ background: -o-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important;
+ box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
+ color: rgba(0,0,0,0.6);
+ width: 130px;
+ text-shadow: none;
+ -webkit-border-radius: 0;
+ -moz-border-radius: 0;
+ border-radius: 0;
+ padding-top: 0.2em;
+ padding-bottom: 0.2em;
+}
diff --git a/ansible/artifacts/sunbird/login/template.ftl b/ansible/artifacts/sunbird/login/template.ftl
index 4cd22fe9f35948f9c3175cd9b896de0538c6c61d..1b4f1c3a86fb6847969b795a56dd4f9390f13d14 100644
--- a/ansible/artifacts/sunbird/login/template.ftl
+++ b/ansible/artifacts/sunbird/login/template.ftl
@@ -45,17 +45,7 @@
<div id="kc-container-wrapper" class="${properties.kcContainerWrapperClass!}">
<div id="kc-header" class="${properties.kcHeaderClass!}">
- <div id="kc-header-wrapper" class="${properties.kcHeaderWrapperClass!}">
- <header>
- <nav class="navigation">
-
- <!-- Logo -->
- <div class="logo">
- <img onerror="" src="https://uphrh.in/assets/images/sunbird_logo.png" alt="">
- </div>
- </nav>
- </header>
- </div>
+ <div id="kc-header-wrapper" class="${properties.kcHeaderWrapperClass!}"><#nested "header"></div>
</div>
<#if realm.internationalizationEnabled>