Skip to content
GitLab
Unverified Commit 5989a6ce authored by Prasath Sivasubramaniyan's avatar Prasath Sivasubramaniyan Committed by GitHub
Browse files

Revert "login page changes"

parent a41ca3a2
revert-5-login-changes
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 203 additions and 338 deletions
+203 -338
ansible/artifacts/sunbird/login/login.ftl
+ 3
− 6
View file @ 5989a6ce
...@@ -8,8 +8,9 @@ ...@@ -8,8 +8,9 @@
<div class="fullpage-background-image"> <div class="fullpage-background-image">
<div class="container-wrapper"> <div class="container-wrapper">
<div class="ui header centered mb-8"> <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 class="subtitle">Login</p>
<p id="signIn" class="info mt-8 mb-8">${msg("loginDiksha")} <span class="required">*</span></p>
</div> </div>
<p id="mergeAccountMessage" class="hide mb-0 textCenter">${msg("mergeAccountMessage")}</p> <p id="mergeAccountMessage" class="hide mb-0 textCenter">${msg("mergeAccountMessage")}</p>
<p id="migrateAccountMessage" class="hide mb-0 textCenter">${msg("migrateAccountMessage")}</p> <p id="migrateAccountMessage" class="hide mb-0 textCenter">${msg("migrateAccountMessage")}</p>
...@@ -29,14 +30,12 @@ ...@@ -29,14 +30,12 @@
<#elseif !realm.registrationEmailAsUsername>${msg("emailOrPhone")} <#elseif !realm.registrationEmailAsUsername>${msg("emailOrPhone")}
<#else>${msg("email")} <#else>${msg("email")}
</#if> </#if>
<span class="required">*</span>
</label> </label>
<label id="usernameLabelPlaceholder" for="username" class="activeLabelColor hide"> <label id="usernameLabelPlaceholder" for="username" class="activeLabelColor hide">
<#if !realm.loginWithEmailAllowed>${msg("username")} <#if !realm.loginWithEmailAllowed>${msg("username")}
<#elseif !realm.registrationEmailAsUsername>${msg("placeholderForEmailOrPhone")} <#elseif !realm.registrationEmailAsUsername>${msg("placeholderForEmailOrPhone")}
<#else>${msg("email")} <#else>${msg("email")}
</#if> </#if>
<span class="required">*</span>
</label> </label>
<#if usernameEditDisabled??> <#if usernameEditDisabled??>
<#-- TODO: need to find alternative for prepopulating username --> <#-- TODO: need to find alternative for prepopulating username -->
...@@ -49,12 +48,10 @@ ...@@ -49,12 +48,10 @@
<div> <div>
<label id="passwordLabel" for="password" class=""> <label id="passwordLabel" for="password" class="">
${msg("password")} ${msg("password")}
<span class="required">*</span>
</label> </label>
<label id="passwordLabelPlaceholder" for="password" class="activeLabelColor hide"> <label id="passwordLabelPlaceholder" for="password" class="activeLabelColor hide">
${msg("placeholderForPassword")} ${msg("placeholderForPassword")}
<span class="required">*</span>
</label> </label>
</div> </div>
<input placeholder="${msg('passwordPlaceholder')}" class=" mt-8" id="password" onfocusin="inputBoxFocusIn(this)" onfocusout="inputBoxFocusOut(this)" name="password" type="password" autocomplete="current-password" /> <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 @@ ...@@ -67,7 +64,7 @@
</div> </div>
<div class="forgot-password"> <div class="forgot-password">
<#if realm.resetPasswordAllowed> <#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> <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> </#if>
</div> </div>
......
ansible/artifacts/sunbird/login/messages/messages_en.properties
+ 2
− 3
View file @ 5989a6ce
...@@ -13,7 +13,7 @@ doNo=No ...@@ -13,7 +13,7 @@ doNo=No
doContinue=Continue doContinue=Continue
doAccept=Accept doAccept=Accept
doDecline=Decline doDecline=Decline
doForgotPassword=Reset password doForgotPassword=Forgot password?
doClickHere=Click here doClickHere=Click here
doImpersonate=Impersonate doImpersonate=Impersonate
kerberosNotConfigured=Kerberos Not Configured kerberosNotConfigured=Kerberos Not Configured
...@@ -53,7 +53,6 @@ recaptchaNotConfigured=Recaptcha is required, but not configured ...@@ -53,7 +53,6 @@ recaptchaNotConfigured=Recaptcha is required, but not configured
consentDenied=Consent denied. consentDenied=Consent denied.
noAccount=Don''t have an account? noAccount=Don''t have an account?
forgotAccount=Did you forget the password?
username=Username or Mobile number username=Username or Mobile number
goBack=<<Go Back 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 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 ...@@ -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!" p3pPolicy=CP="This is not a P3P policy!"
usernamePlaceholder = Enter your Registered Email address/Mobile number usernamePlaceholder = Enter your Registered Email address/Mobile number
passwordPlaceholder = Enter your password passwordPlaceholder = Enter your password
loginDiksha = All the required fields are marked with an loginDiksha = Welcome to UPSMF
registerHere = Register here registerHere = Register here
ansible/artifacts/sunbird/login/resources/css/login.css
+ 15
− 135
View file @ 5989a6ce
@import "./fonts/notosans/notosans.css"; @import "./fonts/notosans/notosans.css";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@700&display=swap');
body{ body{
font-family: "Noto Sans"; font-family: "Noto Sans";
position: relative; position: relative;
letter-spacing: 0.2px; letter-spacing: 0.2px;
/* background: #edf4f9; */ background: #edf4f9;
} }
.fullpage-background-image{ .fullpage-background-image{
width: 100% !important; width: 100% !important;
...@@ -54,7 +53,7 @@ input{ ...@@ -54,7 +53,7 @@ input{
border: 1px solid #9B9B9B !important; border: 1px solid #9B9B9B !important;
} }
input:focus{ input:focus{
border: 1px solid rgba(236,73,51,1) !important; border: 1px solid #024f9d !important;
} }
.signInWithGoogle{ .signInWithGoogle{
position: absolute; position: absolute;
...@@ -98,9 +97,6 @@ input:focus{ ...@@ -98,9 +97,6 @@ input:focus{
text-align: left; text-align: left;
/*margin-top: auto !important;*/ /*margin-top: auto !important;*/
margin-bottom: 10px !important; margin-bottom: 10px !important;
display: flex;
align-items: baseline;
justify-content: space-between;
} }
.formMsg{ .formMsg{
font-size: 16px; font-size: 16px;
...@@ -115,14 +111,12 @@ input:focus{ ...@@ -115,14 +111,12 @@ input:focus{
text-align: center; text-align: center;
} }
p.subtitle { p.subtitle {
opacity: 1; color: #333333;
color: rgba(0,0,0,1); font-size: 18px;
font-size: 24px; font-weight: bold;
font-weight: 700; letter-spacing: 0;
font-style: normal; line-height: 26px;
letter-spacing: 0px;
text-align: center; text-align: center;
margin-bottom: 8px;
} }
.ui.form .field>label { .ui.form .field>label {
font-size: 14px; font-size: 14px;
...@@ -270,13 +264,9 @@ a{ ...@@ -270,13 +264,9 @@ a{
color: #024f9d !important; color: #024f9d !important;
} }
.registerLink{ .registerLink{
opacity: 1; color: #024f9d;
color: rgba(236,73,51,1); font-weight: bold;
font-size: 14px; text-decoration: underline;
font-weight: 700;
font-style: normal;
letter-spacing: 0px;
text-align: right;
} }
.registerLink:hover, .registerLink:hover,
.registerLink:focus{ .registerLink:focus{
...@@ -396,9 +386,7 @@ h1, h2, h3, h4, h5, ...@@ -396,9 +386,7 @@ h1, h2, h3, h4, h5,
} }
.sb-btn-primary:hover { .sb-btn-primary:hover {
background-color: #FFF5F3; background-color: #002e50;
border-color: rgba(236,73,51,1);
color: rgba(236,73,51,1);
} }
.sb-btn-success { .sb-btn-success {
...@@ -465,7 +453,7 @@ h1, h2, h3, h4, h5, ...@@ -465,7 +453,7 @@ h1, h2, h3, h4, h5,
justify-content: center; justify-content: center;
height: 100%; height: 100%;
padding: 32px; padding: 32px;
/* background-image: linear-gradient(180deg, rgba(246, 170, 156, 1) 0%, rgba(253, 227, 222, 1) 100%) !important; */ background: #edf4f9;
} }
.container-wrapper { .container-wrapper {
max-width: 328px; max-width: 328px;
...@@ -485,25 +473,6 @@ h1, h2, h3, h4, h5, ...@@ -485,25 +473,6 @@ h1, h2, h3, h4, h5,
.forgot-password { .forgot-password {
font-size:11px; font-size:11px;
color:#333; 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 { .forgot-password:hover {
color:#024f9d; color:#024f9d;
...@@ -633,9 +602,9 @@ h1, h2, h3, h4, h5, ...@@ -633,9 +602,9 @@ h1, h2, h3, h4, h5,
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
min-height: 100vh; 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-size: cover;
background-color: #000;
} }
.fullpage-background-image{ .fullpage-background-image{
max-width: 1008px !important; max-width: 1008px !important;
...@@ -668,93 +637,4 @@ h1, h2, h3, h4, h5, ...@@ -668,93 +637,4 @@ h1, h2, h3, h4, h5,
input:focus-visible{ input:focus-visible{
outline: 1px #fe0000 solid !important; outline: 1px #fe0000 solid !important;
border-radius: 5px; border-radius: 5px;
} }
\ No newline at end of file
.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
ansible/artifacts/sunbird/login/resources/css/styles.css
+ 182
− 183
View file @ 5989a6ce
...@@ -15,186 +15,185 @@ ...@@ -15,186 +15,185 @@
* limitations under the License. * limitations under the License.
*/ */
@import url('../../keycloak/lib/zocial/zocial.css'); @import url('../../keycloak/lib/zocial/zocial.css');
body { body {
background-color: #012951; background-color: #012951;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #fff; color: #fff;
font-family: sans-serif; font-family: sans-serif;
/* text-shadow: 0px 0px 10px #000; */ /* text-shadow: 0px 0px 10px #000; */
margin: 0px; margin: 0px;
} }
a { a {
color: #fff; color: #fff;
} }
div#kc-logo { div#kc-logo {
background-image: url('../img/bkgrnd.png'); background-image: url('../img/bkgrnd.png');
background-repeat: no-repeat; background-repeat: no-repeat;
background-color: #fff; background-color: #fff;
background-size: contain; background-size: contain;
height:110px; height:110px;
} }
div#kc-locale { div#kc-locale {
display: none; display: none;
} }
div#kc-content { div#kc-content {
position: absolute; position: absolute;
top: 30%; top: 30%;
left: 50%; left: 50%;
width: 550px; width: 550px;
margin-left: -225px; margin-left: -225px;
} }
div#kc-form { div#kc-form {
float: left; float: left;
width: 350px; width: 350px;
} }
div#kc-form label { div#kc-form label {
display: block; display: block;
font-size: 16px; font-size: 16px;
} }
div#info-area { div#info-area {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
margin-top: 40px; margin-top: 40px;
background-color: rgba(0, 0, 0, 0.4); background-color: rgba(0, 0, 0, 0.4);
padding: 20px; padding: 20px;
width: 100%; width: 100%;
} }
div#info-area p { div#info-area p {
margin-right: 30px; margin-right: 30px;
display: inline; display: inline;
text-shadow: none; text-shadow: none;
} }
input[type=text], input[type=password] { input[type=text], input[type=password] {
color: #ddd; color: #ddd;
font-size: 18px; font-size: 18px;
margin-bottom: 20px; margin-bottom: 20px;
background-color: rgba(3,70,114,0.15); background-color: rgba(3,70,114,0.15);
border: 0px solid rgba(0,0,0,0.2); border: 0px solid rgba(0,0,0,0.2);
box-shadow:inset 0 0 2px 2px rgba(0,0,0,0.15); box-shadow:inset 0 0 2px 2px rgba(0,0,0,0.15);
padding: 10px; padding: 10px;
width: 296px; width: 296px;
} }
input[type=text]:hover, input[type=password]:hover { input[type=text]:hover, input[type=password]:hover {
background-color: rgba(3,70,114,0.4); background-color: rgba(3,70,114,0.4);
} }
input[type=submit] { input[type=submit] {
border: none; border: none;
background: #fff; background: #fff;
background: -moz-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)); 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: -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)); 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); box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
/* color: rgba(0,0,0,0.6); */ /* color: rgba(0,0,0,0.6); */
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
padding: 10px; padding: 10px;
margin-top: 20px; margin-top: 20px;
margin-right: 10px; margin-right: 10px;
width: 150px; width: 150px;
} }
input[type=submit]:hover { input[type=submit]:hover {
background-color: rgba(255,255,255,0.8); background-color: rgba(255,255,255,0.8);
} }
div#kc-form-options div { div#kc-form-options div {
display: inline; display: inline;
margin-right: 20px; margin-right: 20px;
font-size: 12px; font-size: 12px;
} }
div#kc-form-options div label { div#kc-form-options div label {
font-size: 12px; font-size: 12px;
} }
div#kc-feedback { div#kc-feedback {
box-shadow: 0px 0px 6px rgba(0,0,0,0.5); box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
text-align: center; text-align: center;
} }
div#kc-feedback-wrapper { div#kc-feedback-wrapper {
padding: 1em; padding: 1em;
} }
div.feedback-success { div.feedback-success {
background-color: rgba(155,155,255,0.1); background-color: rgba(155,155,255,0.1);
} }
div.feedback-warning { div.feedback-warning {
background-color: rgba(255,175,0,0.1); background-color: rgba(255,175,0,0.1);
} }
div.feedback-error { div.feedback-error {
background-color: rgba(255,0,0,0.1); background-color: rgba(255,0,0,0.1);
} }
div#kc-header { div#kc-header {
display: none; display: none;
} }
div#kc-registration { div#kc-registration {
margin-bottom: 20px; margin-bottom: 20px;
} }
div#social-login { div#social-login {
border-left: 1px solid rgba(255, 255, 255, 0.2); border-left: 1px solid rgba(255, 255, 255, 0.2);
float: right; float: right;
width: 150px; width: 150px;
padding: 20px 0 200px 40px; padding: 20px 0 200px 40px;
} }
div.social-login span { div.social-login span {
display: none; display: none;
} }
div#kc-social-providers ul { div#kc-social-providers ul {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
div#kc-social-providers ul li { div#kc-social-providers ul li {
margin-bottom: 20px; margin-bottom: 20px;
} }
div#kc-social-providers ul li span { div#kc-social-providers ul li span {
display: inline; display: inline;
width: 100px; width: 100px;
} }
a.zocial { a.zocial {
border: none; border: none;
background: -webkit-linear-gradient(top, rgba(255,255,255,0.8), rgba(255,255,255,0.1)) !important; 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: -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: -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; 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); box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
color: rgba(0,0,0,0.6); color: rgba(0,0,0,0.6);
width: 130px; width: 130px;
text-shadow: none; text-shadow: none;
-webkit-border-radius: 0; -webkit-border-radius: 0;
-moz-border-radius: 0; -moz-border-radius: 0;
border-radius: 0; border-radius: 0;
padding-top: 0.2em; padding-top: 0.2em;
padding-bottom: 0.2em; padding-bottom: 0.2em;
} }
\ No newline at end of file
ansible/artifacts/sunbird/login/template.ftl
+ 1
− 11
View file @ 5989a6ce
...@@ -45,17 +45,7 @@ ...@@ -45,17 +45,7 @@
<div id="kc-container-wrapper" class="${properties.kcContainerWrapperClass!}"> <div id="kc-container-wrapper" class="${properties.kcContainerWrapperClass!}">
<div id="kc-header" class="${properties.kcHeaderClass!}"> <div id="kc-header" class="${properties.kcHeaderClass!}">
<div id="kc-header-wrapper" class="${properties.kcHeaderWrapperClass!}"> <div id="kc-header-wrapper" class="${properties.kcHeaderWrapperClass!}"><#nested "header"></div>
<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> </div>
<#if realm.internationalizationEnabled> <#if realm.internationalizationEnabled>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment