Skip to content

Intermediate signup page (UI changes) #254

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sachin-maheshwari merged 23 commits into from
Jul 8, 2021
Merged

Intermediate signup page (UI changes) #254

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
50f2837
resend email link
Jun 8, 2021
ca86af9
typo
Jun 8, 2021
0fb740b
adding handle logic
Jun 8, 2021
cabff24
logic change
Jun 9, 2021
bc4faf5
disabling the continue button after first submit
Jun 17, 2021
4ae5992
disable double clicking
Jun 17, 2021
1716a65
disabling double submit
Jun 17, 2021
7466ccf
disabling button double click
Jun 17, 2021
3aa5ef6
stoping db click events
Jun 17, 2021
1575b07
handling through crude way
Jun 17, 2021
1f63dd1
Test for Continue button fix
jmgasper Jun 18, 2021
a285716
resend link on/off
Jun 21, 2021
faf1af4
typo
Jun 21, 2021
bd2200d
fixing css issue
Jun 21, 2021
ae7c1a0
clean-up code
Jun 23, 2021
2c494f7
reverting issue#140 fixes by community, identitied at issue#144
Jun 25, 2021
948d2d2
Issues-149: Social login changes
atelomycterus Jun 25, 2021
466eb20
Merge pull request #250 from topcoder-platform/issues-149
jmgasper Jun 25, 2021
ec43692
Issues-149: fixed minor issues
atelomycterus Jun 26, 2021
f030af8
Merge pull request #251 from topcoder-platform/issues-149_1
jmgasper Jun 26, 2021
fe845d2
no backward direction flow
Jun 28, 2021
fd9190d
dynamic domain for check email template
Jul 7, 2021
80d873c
Merge branch 'master' into dev
Jul 7, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions build.sh
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ SIGNUPFILENAME="./web-assets/js/signup.js"
perl -pi -e "s/\{\{DOMAIN\}\}/$DOMAIN/g" $SIGNUPFILENAME
perl -pi -e "s/\{\{AUTH0DOMAIN\}\}/$AUTH0DOMAIN/g" $SIGNUPFILENAME

CHECKEMAIL="./web-assets/static-pages/check_email.html"
perl -pi -e "s/\{\{DOMAIN\}\}/$DOMAIN/g" $CHECKEMAIL

mkdir dist
cp -rv ./web-assets/css/* ./dist/
Expand Down
6 changes: 6 additions & 0 deletions web-assets/auth0/css/custom.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -461,6 +461,12 @@ div.auth0-lock-error::before{
width: auto;
margin: 0px 20px 10px 20px;
}
div.auth0-lock-error-msg {
white-space:normal;
}
div.auth0-lock-error::before {
left: calc(100% + 5px)
}
/* end: form */

/* terms */
Expand Down
205 changes: 194 additions & 11 deletions web-assets/css/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -414,6 +414,160 @@ select::-ms-expand {
}
/** End: Confirmation Card **/

/** Start: Sign Up Card **/
.center-align-card.signup-card .page-wrapper {
margin-left: auto;
margin-right: auto;
padding: 0px;
text-align: center;
max-width: 1139px;
}

.center-align-card.signup-card .page-content {
margin-top: 60px;
min-height: 820px;
height: clamp(820px, 100%, 820px);
border-radius: 10px 10px;
width: 1139px;
background-repeat: no-repeat;
background-position: top right;
background-image: url(./images/signup_bg.png);
}

.center-align-card.signup-card .page-main {
padding: 0px 50px 40px 40px;
width: 100%;
max-width:495px;
}

.center-align-card.signup-card .page-main header{
background: transparent;
border-radius: 0px;
padding: 28px 0px 17px 0px;
}
.center-align-card.signup-card .page-main .page-title-heading{
color: #2A2A2A;
font-family: Roboto, sans-serif;
font-weight: 500 ;
font-size: 28px;
line-height: 38px;
text-transform: capitalize;
padding-bottom: 46px;
}


.center-align-card.signup-card .page-content #signup-container {
color: white;
text-align: left;
position: absolute;
margin-left:495px;

}

.center-align-card.signup-card .page-content #signup-container .title{
font-weight: 500;
font-family: 'Barlow Condensed', sans-serif;
font-size: 34px;
line-height: 38px;
padding: 81px 0px 20px 143px;
}

.center-align-card.signup-card .page-content #signup-container .body{
font-weight: normal;
font-family: 'Roboto';
font-size: 18px;
line-height: 27px;
padding: 0px 88px 0px 143px;
}
.center-align-card.signup-card .page-content .input-field {
margin-bottom: 10px;
}
.center-align-card.signup-card .page-content .input-field select, .center-align-card.signup-card .page-content .input-field input{
border: 1px solid #D4D4D4;
border-radius: 4px;
color: #2A2A2A;
font-family: Roboto;
font-size: 14px;
}
.center-align-card.signup-card .page-content .input-field select{
background: none;
}

.center-align-card.signup-card .page-content .input-field .icon-arrow g{
fill: #AAAAAA;
opacity: 1;
}
.center-align-card.signup-card .page-content .input-field .icon-arrow {
transform: rotate(90deg);
}

.center-align-card.signup-card .page-content .input-field .icon-arrow {
position: absolute;
top: 18px;
width: 12px;
height: 14px;
right: 14px;
pointer-events: none;
}

.center-align-card.signup-card .page-content .input-field select:focus,
.center-align-card.signup-card .page-content .input-field input:focus,
.center-align-card.signup-card .page-content .input-field select:hover,
.center-align-card.signup-card .page-content .input-field input:hover {
box-shadow: none;
}
.center-align-card.signup-card .page-content .input-field label {
color: #AAAAAA;
font-family: Roboto;
font-size: 14px;
line-height: 22px;
width: 146px;
text-align: left;
}

.center-align-card.signup-card .page-content button.continue-btn:not(:disabled):hover {
background-image: none;
}
.center-align-card.signup-card .page-content button.continue-btn:focus{
outline: 0px;
}

.center-align-card.signup-card .page-content button.continue-btn {
background-color: #137D60;
border-radius: 4px;
width: 100%;
max-width: 405px;
height: 48px;
color: #FFFFFF;
font-family: Roboto;
font-size: 17px;
line-height: 20px;
font-weight: normal;
text-transform: capitalize;
}
.center-align-card.signup-card .page-content .terms {
text-align: left;
padding-bottom: 25px;
}

.center-align-card.signup-card .page-content .terms,
.center-align-card.signup-card .page-content .terms a{
color: #37373C;
font-family: Roboto;
font-size: 13px;
line-height: 20px;
}
.center-align-card.signup-card .page-content .terms a,
.center-align-card.signup-card .page-content .terms a:visited,
.center-align-card.signup-card .page-content .terms a :active,
.center-align-card.signup-card .page-content .terms a:focus {
text-decoration: underline;
font-size: 13px;
line-height: 20px;
color: #0D61BF;
}
/** End: Sign Up Card **/

/** Start : Input/select box - field area style **/
.input-field {
position: relative;
Expand Down Expand Up @@ -521,17 +675,6 @@ select::-ms-expand {
width: 20px;
}

/** Mobile - specific CSS **/
@media (max-width: 767px) {
.footer {
padding-bottom: 10px;
}
.footer .copyright-text,
.footer .privacy-policy {
margin-bottom: 10px;
}
}

/** Desktop + tab - specific CSS **/
@media (min-width: 768px) {
.center-align-card .page-content {
Expand All @@ -543,4 +686,44 @@ select::-ms-expand {
.confirmation-card.center-align-card .page-wrapper {
max-width: 511px;
}

.center-align-card.signup-card .page-content {
width: 1139px;
min-height: 820px;
height: 820px;
}
}

@media (max-width: 1156px) {
.center-align-card.signup-card .page-content {
background-image: none;
width: 90%;
max-width: 495px;
min-height: auto;
height: auto;
}
.center-align-card.signup-card .page-content #signup-container {
display: none;
}
}

/** Mobile - specific CSS **/
@media (max-width: 767px) {
.center-align-card.signup-card .page-wrapper {
background-image: none;
width: 90%;
min-height: auto;
height: auto;
}
.center-align-card.signup-card .page-content #signup-container {
display: none;
}

.footer {
padding-bottom: 10px;
}
.footer .copyright-text,
.footer .privacy-policy {
margin-bottom: 10px;
}
}
Binary file added web-assets/images/logo_dark_small.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web-assets/images/signup_bg.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 5 additions & 4 deletions web-assets/js/signup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ var qs = (function (a) {
return b;
})(window.location.search.substr(1).split("&"));
$(document).ready(function () {
window.history.forward();
$.each(countryObjs, function () {
$("#country").append(
$("<option></option>").text(this.name).val(JSON.stringify(this))
Expand All @@ -20,14 +21,14 @@ $(document).ready(function () {
//first name & last name div
var firstname = qs['firstName'];
if (firstname !== 'undefined') {
$("#firstName").val(firstname);
$("#firstName").val(firstname);
$("#fn").hide();
}
}
var lastname = qs['lastName'];
if (lastname !== 'undefined') {
$("#lastName").val(lastname);
$("#lastName").val(lastname);
$("#ln").hide();
}
}
$("#continueBtn").click(function () {
var handle = $("#handle").val();
var country = $("#country").val();
Expand Down
2 changes: 1 addition & 1 deletion web-assets/static-pages/check_email.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
if (state) {
document.querySelector("#resend").addEventListener("click", e => {
e.preventDefault();
window.location = 'https://auth.topcoder.com/continue?state=' + state + '&resend=1';
window.location = 'https://auth.{{DOMAIN}}/continue?state=' + state + '&resend=1';
});
} else {
document.querySelector("#resend-text").style.display = "none";
Expand Down
Loading