x x x
x
Only portrait mode is currently supported - please rotate your device.

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: using SSO login form again


HTML
<style>
@media only screen and (max-width: 580px){
	.description-container{
		width: 100%!important;
	}
	.field-group input{
		padding: 0 10px!important;
	}
}

.description-container #link-container {
    #rw_dashboard_link{
	display: none !important;
}

#login-issue-btns {
    display: flex;
    height: auto;
}

.login-issue-btn {
    width: 50%;
    margin: unset;
    padding: 20px;
    text-align: center;
    border-right: 1px solid #e5e5e5;
}

.login-issue-btn a {
    text-decoration: none;
}

.learn-more-section {
    position: absolute;
    left: 20%;
    top: 50%;
    padding: 25px;
    background-color: #0d5d8b;
    color: white;
}

.learn-more-section a {
    display: block;
    border: 1px solid white;
    border-radius: 7px;
    margin-top: 20px;
    width: max-content;
    padding: 10px 20px;
    text-decoration: none;
    color: white !important;
    cursor: pointer;
}

.learn-more-section a:hover {
    color: white;
}
</style></style>


HTML
<link rel="stylesheet" href="https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/stylesheets/MS+SBA/login.css">

<script>

window.addEventListener("load", function(){
	//$('.login-form-container').append(`<p>Forgot your password? Reset it <a href="mailto:morganstanley@theonevalley.com?subject=Reset Password Request&body=Please reset my password.">here</a>.</p>`);
	$('#login-issue-btns').append(`<p class="login-issue-btn"><a href="/display/SBAAN/Sign+Up">Don't have an account?</a></p>`);
    $('#login-issue-btns').append(`<p class="login-issue-btn"><a href="/display/SBAAN/SBA+Forgot+Password">Forgot Password?</a></p>`);
});

</script>
HTML
<style>
div.bigImageContainer {
    position: relative;
    /* width: 50%; */
    height: 100%;
    background-image: url('https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/images/MStanley/MS-SBA/login.png');
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover;
	box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
    margin-left: 10px;
}

div.signContainer {
    width: 90vw;
    height: 90%;
    margin: 60px auto;
}

.rw_content {
    background: var(--main-background);
}


div.formContainer {
    box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
    margin-right: 10px;
	/* width: 50%; */
    flex-direction: column;
    background-color: white;
}

.link-container-button.left {
    display: none;
}

div.link-container-button {
    width: 100%;
}

input#loginButton:hover {
    cursor: pointer;
}

@media only screen and (max-width: 480px) {
div.formContainer {
    box-shadow: none;
    width: 100%;
}

div.bigImageContainer, .bigImageContainer .learn-more-section {
    display: none;
}

div.signContainer {
    margin: 0 auto;
}

form.login-form-container[name='loginform'] {
    width: 100%;
    padding: 14px 0;
    margin: auto;
}

div.field-group {
    width: 100%;
    margin-top: 10px;
}

.field-group.login-field-group {
    margin-top: 20px;
}
}
  

<style>

#loginform > fieldset > div {
    padding: 0;
  }

</style>


Custom section
ClasssignContainer


Custom section
ClassformContainer

login-form-genericsso-newsba
SignUpLink/display/SBAAN/Sign+Up
Destination/display/SBAH
EndpointUrl/rest/scriptrunner/latest/custom/logInMorganStanleyloginMSSBA
ForgotPassword/display/MSASBAAN/Forgot+Password
WelcomeMessageWelcome to the Morgan Stanley Small Business Academy

HTML
<div id="login-issue-btns" style="border-top: 1px solid #e5e5e5;"> </div>



Custom section
ClassbigImageContainer


HTML
<div class="learn-more-section">
    <p>Our focus is helping small businesses leverage their competitive advantage, differentiate themselves in the procurement process, strengthen their business knowledge, and build their professional network.</p>
    <a href="https://www.morganstanley.com/about-us/supplier-diversity/small-business-academy" style="displayfont-weight:blockbold;">Learn>LEARN More<MORE</a>
</div>




HTML
<style>

div#custom-footer {
    display: none;
}
.main-container {
    min-height: calc(100vh - 50px);
    background-repeat: no-repeat;
    background-size: cover;
}

div#toggle {
    display: none;
}
</style>
HTML
<style>
/* new stuff */
span.conf-macro.output-inline {
    width: 100%;
}
</style><script>
$("input#loginButton").val("LOG IN");
</script>