From 680b36b5bb1d5ffac4a616006f5fec1f98ae52ad Mon Sep 17 00:00:00 2001 From: Rucha Gosavi <112318804+ruchagosavi@users.noreply.github.com> Date: Sat, 20 May 2023 20:11:46 +0530 Subject: [PATCH 1/2] Create new_index.html This is modified UI of Signup page --- new_index.html | 80 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 80 insertions(+) create mode 100644 new_index.html diff --git a/new_index.html b/new_index.html new file mode 100644 index 00000000..95b8ca02 --- /dev/null +++ b/new_index.html @@ -0,0 +1,80 @@ + + + + + + + + + + + + + + + + + + + SIGN UP - AEC Library + + + + +
+

+
+
+ AEC Library - Sign Up +
+ +
+ Already have an account? + +
+
+ +
+ + + + + +
+
+ + + + + + + From 699606ca803ce40deec1e14238e535727add3451 Mon Sep 17 00:00:00 2001 From: Rucha Gosavi Date: Sun, 4 Jun 2023 20:32:24 +0530 Subject: [PATCH 2/2] Enhanced UI Of SignUp page Some changes made. Removed some buttons and text fields. --- sign-up-page/index.html | 83 +++++++++++++++++++- sign-up-page/index.js | 36 ++++++++- sign-up-page/style.css | 168 +++++++++++++++++++++++++++++++++++++++- 3 files changed, 280 insertions(+), 7 deletions(-) diff --git a/sign-up-page/index.html b/sign-up-page/index.html index b0ac9f74..fdbe0460 100644 --- a/sign-up-page/index.html +++ b/sign-up-page/index.html @@ -1,4 +1,4 @@ - + +
@@ -93,4 +93,81 @@

+ --> + + + + + + + + + + + + + + + + + SIGN UP - AEC Library + + + + +
+

+
+
+ AEC Library - Sign Up +
+ +
+ Already have an account? + +
+
+ +
+ + + + + +
+
+ + + + + \ No newline at end of file diff --git a/sign-up-page/index.js b/sign-up-page/index.js index 4b408450..0d7cbcfb 100644 --- a/sign-up-page/index.js +++ b/sign-up-page/index.js @@ -1,4 +1,4 @@ -const form = document.getElementById("form"); +/*const form = document.getElementById("form"); const fullName = document.getElementById("firstName"); const username = document.getElementById("username"); const email = document.getElementById("email"); @@ -73,3 +73,37 @@ logged_out.addEventListener("click", (e) => { const { error } = _supabase.auth.signOut(); location.reload(); }); +*/ +form.addEventListener("submit", (e) => { + e.preventDefault(); + const fullName = document.getElementById("fullName").value; + const email = document.getElementById("email").value; + // You can add additional form field values as needed + + // Perform any necessary validation here + + // Simulate successful sign-up + displaySuccessMessage(fullName, email); +}); + +function displaySuccessMessage(fullName, email) { + const successMessage = `Congratulations, ${fullName}! You have successfully signed up with email ${email}.`; + alert(successMessage); +} + +document.addEventListener('DOMContentLoaded', function() { + // Get the form element + var form = document.getElementById('form'); + + // Attach an event listener for form submission + form.addEventListener('submit', function(event) { + event.preventDefault(); // Prevent the form from submitting + + // Get the input values + var fullName = document.getElementById('fullName').value; + var email = document.getElementById('email').value; + var password = document.getElementById('password').value; + var gender = document.querySelector('input[name="gender"]:checked').value; + window.location.href = '/success.html'; + }); +}); \ No newline at end of file diff --git a/sign-up-page/style.css b/sign-up-page/style.css index 151de690..40c71817 100644 --- a/sign-up-page/style.css +++ b/sign-up-page/style.css @@ -1,4 +1,4 @@ -@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;700&display=swap'); +/*@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;700&display=swap'); body { width: 100vw; height: 100vh; @@ -200,8 +200,7 @@ a { left: 0; bottom: 0; } -} - +}*/ /* .cover { @@ -236,6 +235,8 @@ a { /* Exit */ + + /* @media only screen and (max-width: 425px) { @@ -360,4 +361,165 @@ a { width: 30px; height: 30px; } +}*/ + +@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;700&display=swap'); +body { + width: 100vw; + height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin: 0; + padding: 0; + background-image: url("library-bg-1.jpg"); + background-color: #635147; + background-size: cover; + background-position: center; + background-attachment: fixed; + background-blend-mode: soft-light; + font-family: 'Josefin Sans', sans-serif; + color: #fff; +} + +.wrapper { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 100vh; + background-image: url("library-bg-1.jpg"); + background-color: #635147; + background-size: cover; + background-position: center; + background-attachment: fixed; + background-blend-mode: soft-light; + font-family: 'Josefin Sans', sans-serif; + color: #fff; +} + +.section { + display: flex; + flex-direction: column; + align-items: center; +} + +.header { + font-size: 2rem; + font-weight: 700; + text-align: center; + margin-bottom: 1.5rem; +} + +.signUp-form { + display: flex; + flex-direction: column; + align-items: center; +} + +.form-box { + display: flex; + flex-direction: column; + align-items: center; + gap: 10px; + width: 300px; +} + +.form-group { + display: flex; + align-items: center; + gap: 10px; } + +.form-group i { + color: #fff; + font-size: 2rem; +} + +.form-group input { + padding: 10px; + border: none; + background: transparent; + outline: none; + color: #fff; + font-size: 1.2rem; + margin: 0.7rem; + font-family: 'Josefin Sans', sans-serif; + border-bottom: 1px solid #fff; +} + +.form-group.no-border { + border: none; +} + +#male, +#female { + font-size: 1.8rem; +} + +#male+label, +#female+label { + color: white; + font-size: 1.2rem; + display: flex; + align-items: center; +} + +.button-container { + display: flex; + justify-content: center; + margin-top: 1.5rem; + margin-bottom: 1rem; +} + +button[type="submit"] { + background-color: #c35047; + color: white; + border: none; + padding: 10px 20px; + cursor: pointer; + font-size: 1rem; + border-radius: 4px; + transition: background-color 0.3s ease; +} + +button[type="submit"]:hover { + background-color: #4e3c33; +} + +.redirect { + margin-top: 1.5rem; + margin-bottom: 2rem; + color: white; + font-size: 1rem; + display: flex; + align-items: center; + justify-content: center; +} + +.redirect button { + margin-left: 0.5rem; +} + +.redirect a { + text-decoration: none; + color: #4e3c33; +} + +.quiz-exit { + position: absolute; + bottom: 0; + right: 0; + margin: 1rem; + cursor: pointer; +} + +.quiz-exit a { + color: #635147; + font-size: 2rem; +} + +.quiz-exit a:hover { + color: #4e3c33; +} \ No newline at end of file