diff --git a/icon/letter-b.png b/icon/letter-b.png new file mode 100644 index 0000000..6c051b4 Binary files /dev/null and b/icon/letter-b.png differ diff --git a/login.html b/login.html new file mode 100644 index 0000000..83a367b --- /dev/null +++ b/login.html @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + Login To Booking.com + + + + + +
+

Login To Your Account

+ + + + + +

New To Booking.com ? Create New Account

+ +

All rights reserved.

+

Copyright (2006 - 2022) - Booking.com™

+ +
+ + + + \ No newline at end of file diff --git a/login.js b/login.js new file mode 100644 index 0000000..e69de29 diff --git a/signup.html b/signup.html new file mode 100644 index 0000000..5932a32 --- /dev/null +++ b/signup.html @@ -0,0 +1,47 @@ + + + + + + + + + + + + + Signup to Booking.com + + + + + + + +
+

Sign in or create an account

+ + + + + + + +

Already have an Account ?

 +

By signing in or creating an account, you agree with our Terms & conditions and Privacy statement

+

All rights reserved.

+

Copyright (2006 - 2022) - Booking.com™

+ +
+ + + + \ No newline at end of file diff --git a/signup.js b/signup.js new file mode 100644 index 0000000..9ebc816 --- /dev/null +++ b/signup.js @@ -0,0 +1,17 @@ + + +function register() { + e.preventDefault(); + let userData_arr = localStorage.getItem(JSON.parse(userData_arr)) || [] ; + let userData = { + firstName : document.getElementById("firstName").value, + lastName : document.getElementById("lastName").value, + mobile : document.getElementById("mobile").value, + email : document.getElementById("email").value, + password : document.getElementById("password").value + } + userData.push(userData_arr); + console.log(userData) + localStorage.setItem(JSON.stringify(userData_arr)); + +} \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..3ce8aed --- /dev/null +++ b/style.css @@ -0,0 +1,160 @@ + +/* ------------------------------------------------------------- login page --------------------------------------------------------------- */ + + +#navbar { + display: flex; + margin: 0; + padding: 0; + box-sizing: border-box; + width: auto; + /* height: 70px; */ + background-color: #003680 ; + justify-content: space-around; + align-items: center; + font-family: 'Oxygen', sans-serif; + + } + #navbar>h3{ + color: white; + } + #navbar>img{ + width: 20px; + height: 20px; + } + #main_container{ + display: grid; + width: 25%; + /* height: 600px; */ + /* border: 1px solid blue; */ + margin: auto; + margin-top: 10px; + text-align: center; + grid-template-columns: 400px; + align-items: center; + justify-content: center; + gap: 10px; + padding: 50px; + font-family: 'Oxygen', sans-serif; + + } + .input_box{ + height: 38px; + color: black; + font-family: 'Oxygen', sans-serif; + } + #register_button{ + color: white; + background-color: #0070c2; + height: 46px; + border: 0px; + border-radius: 3px; + font-family: 'Oxygen', sans-serif; + } + #register_button:hover{ + color: white; + background-color: #00487a; + height: 46px; + border: 0px; + border-radius: 3px; + font-family: 'Oxygen', sans-serif; + cursor: pointer; + } + + #email_font{ + margin-bottom: -5px; + margin-right: 297px; + } + .tc{ + font-size: small; + } + .tc1{ + font-size: small; + margin-top: -22px; + } + #navbar>img{ + border-radius: 50%; + margin-left: 700px; + margin-right: -250px; + } + + /* ----------------------------------------------------signup page --------------------------------------------------------- */ + + + + + #navbar { + display: flex; + margin: 0; + padding: 0; + box-sizing: border-box; + width: auto; + /* height: 70px; */ + background-color: #003680 ; + justify-content: space-around; + align-items: center; + font-family: 'Oxygen', sans-serif; + + } + #navbar>h3{ + color: white; + } + #navbar>img{ + width: 20px; + height: 20px; + } + #main_container{ + display: grid; + width: 25%; + /* height: 600px; */ + /* border: 1px solid blue; */ + margin: auto; + margin-top: 10px; + text-align: center; + grid-template-columns: 400px; + align-items: center; + justify-content: center; + gap: 10px; + padding: 50px; + font-family: 'Oxygen', sans-serif; + + } + .input_box{ + height: 38px; + color: black; + font-family: 'Oxygen', sans-serif; + } + #register_button{ + color: white; + background-color: #0070c2; + height: 46px; + border: 0px; + border-radius: 3px; + font-family: 'Oxygen', sans-serif; + } + #register_button:hover{ + color: white; + background-color: #00487a; + height: 46px; + border: 0px; + border-radius: 3px; + font-family: 'Oxygen', sans-serif; + cursor: pointer; + } + + #email_font{ + margin-bottom: -5px; + margin-right: 297px; + } + .tc{ + font-size: small; + } + .tc1{ + font-size: small; + margin-top: -22px; + } + #navbar>img{ + border-radius: 50%; + margin-left: 700px; + margin-right: -250px; + } \ No newline at end of file