Skip to content

102_Mindmirror #29

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

Open
bhumikakukreja07 wants to merge 3 commits into
base: main
Choose a base branch
from
Open

102_Mindmirror #29

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
4cad9d8
102_Mindmirror
bhumikakukreja07 Feb 21, 2025
482f59b
Add files via upload
bhumikakukreja07 Feb 21, 2025
e22c349
Add files via upload
bhumikakukreja07 Feb 21, 2025
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
136 changes: 136 additions & 0 deletions clientInfo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,136 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Client Information</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<style>
/* General Styling */
body {
background: linear-gradient(to right, #6a11cb, #2575fc);
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

/* Form Card */
.clientInfo {
max-width: 400px;
width: 100%;
border-radius: 15px;
background: white;
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2), -5px -5px 15px rgba(255, 255, 255, 0.1);
transition: 0.3s;
}

.clientInfo:hover {
transform: scale(1.02);
}

.form-control, .form-select {
border: 1px solid #ccc;
border-radius: 5px;
box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.1);
}

.btn {
width: 100%;
font-weight: bold;
padding: 10px;
border-radius: 8px;
transition: all 0.2s ease-in-out;
}

.btn:hover {
background: #0056b3;
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
}
</style>
</head>
<body>
<div class="container d-flex justify-content-center align-items-center vh-100">
<div class="clientInfo card shadow-lg p-4">
<h2 class="text-center text-primary">Client Information</h2>
<form>
<div class="mb-3">
<label for="name" class="form-label">Name:</label>
<input type="text" id="name" name="name" class="form-control" placeholder="Enter your full name" required>
</div>

<div class="mb-3">
<label for="username" class="form-label">Username:</label>
<input type="text" id="username" name="username" class="form-control" required>
</div>


<div class="mb-3">
<label for="phone" class="form-label">Phone Number:</label>
<input type="tel" id="phone" name="phone" class="form-control" pattern="[0-9]{10}" placeholder="Enter 10-digit number" required>
</div>

<div class="mb-3">
<label for="location" class="form-label">Location (State/UT):</label>
<select id="location" name="location" class="form-select" required>
<option value="">Select State/UT</option>
<option value="Andhra Pradesh">Andhra Pradesh</option>
<option value="Arunachal Pradesh">Arunachal Pradesh</option>
<option value="Assam">Assam</option>
<option value="Bihar">Bihar</option>
<option value="Chhattisgarh">Chhattisgarh</option>
<option value="Goa">Goa</option>
<option value="Gujarat">Gujarat</option>
<option value="Haryana">Haryana</option>
<option value="Himachal Pradesh">Himachal Pradesh</option>
<option value="Jharkhand">Jharkhand</option>
<option value="Karnataka">Karnataka</option>
<option value="Kerala">Kerala</option>
<option value="Madhya Pradesh">Madhya Pradesh</option>
<option value="Maharashtra">Maharashtra</option>
<option value="Manipur">Manipur</option>
<option value="Meghalaya">Meghalaya</option>
<option value="Mizoram">Mizoram</option>
<option value="Nagaland">Nagaland</option>
<option value="Odisha">Odisha</option>
<option value="Punjab">Punjab</option>
<option value="Rajasthan">Rajasthan</option>
<option value="Sikkim">Sikkim</option>
<option value="Tamil Nadu">Tamil Nadu</option>
<option value="Telangana">Telangana</option>
<option value="Tripura">Tripura</option>
<option value="Uttar Pradesh">Uttar Pradesh</option>
<option value="Uttarakhand">Uttarakhand</option>
<option value="West Bengal">West Bengal</option>
<option value="Andaman and Nicobar Islands">Andaman and Nicobar Islands</option>
<option value="Chandigarh">Chandigarh</option>
<option value="Dadra and Nagar Haveli and Daman and Diu">Dadra and Nagar Haveli and Daman and Diu</option>
<option value="Lakshadweep">Lakshadweep</option>
<option value="Delhi">Delhi</option>
<option value="Puducherry">Puducherry</option>
<option value="Ladakh">Ladakh</option>
<option value="Jammu and Kashmir">Jammu and Kashmir</option>
</select>
</div>


<div class="mb-3">
<label for="timeslot" class="form-label">Preferred Time Slot:</label>
<select id="timeslot" name="timeslot" class="form-select" required>
<option value="">Select Time Slot</option>
<option value="09:00 AM - 11:00 AM">09:00 AM - 11:00 AM</option>
<option value="11:00 AM - 01:00 PM">11:00 AM - 01:00 PM</option>
<option value="02:00 PM - 04:00 PM">02:00 PM - 04:00 PM</option>
<option value="04:00 PM - 06:00 PM">04:00 PM - 06:00 PM</option>
</select>
</div>

<div class="text-center">
<button type="submit" class="btn btn-primary shadow-sm" onclick="window.open('webpage.html', '_blank')">Submit</button>
</div>
</form>
</div>
</div>
</body>
</html>
20 changes: 20 additions & 0 deletions data.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
{
"users": [
{
"username": "bhumikakukreja",
"password": "hi"
},
{
"username": "khushi",
"password": "hello"
},
{
"username": "BK_07_08",
"password": "hiiiiiii"
},
{
"username": "2401730163",
"password": "hihhihi"
}
]
}
72 changes: 72 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login Page</title>
<style>

body {
display: flex;
justify-content: center;
align-items: center;
height: 100;
background: #0c7cec;
flex-direction: column;
}


.button-container {
display: flex;
width: 150vh;
height: 100vh;
gap: 20px;
}


button {
display: flex;
align-items: center;
justify-content: center;
gap: 40px;
background-color: #fefefe;
color: rgb(68, 91, 175);
font-size: 25px;
font-weight: bold;
padding: 20px 25px;
margin: auto;
border: none;
border-radius: 10px;
cursor: pointer;
box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
transition: all 0.2s ease-in-out;
}


button:active {
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
transform: translateY(10px);
}


img {
width: 300px;
height: 300px;
}
</style>
</head>
<body>

<div class="button-container">
<button class="client" onclick="window.open('clientInfo.html', '_blank')">
<img src="user.jpg" alt="User">
Client
</button>
<button class="serviceprovider" onclick="window.open('serviceprovider.html', '_blank')">
<img src="serviceprovider.jpg" alt="Service Provider">
Service Provider
</button>
</div>

</body>
</html>
12 changes: 12 additions & 0 deletions index2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="login.html">Login</a>
<a href="register.html">Login</a>
</body>
</html>
40 changes: 40 additions & 0 deletions login.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login Form</title>
</head>
<body>
<h2>Login</h2>
<form action="/index.html" method="POST">
<label>Username:</label>
<input type="text" name="username" required /><br /><br />
<label>Password:</label>
<input type="password" name="password" required /><br /><br />
<button type="submit">Login</button>
</form>

<script>
async function postData(url, data) {
var response = await fetch(url, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
return await response.json();
}

document.getElementById('loginForm').addEventListener('submit', async function(event) {
event.preventDefault();
var username = document.getElementById('username').value;
var password = document.getElementById('password').value;
try {
var result = await postData('/api/login', { username: username, password: password });
document.getElementById('response').textContent = result.response_from_server;
} catch (err) {
console.error(err);
}
});
</script>
</body>
</html>
107 changes: 107 additions & 0 deletions register.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>User Registration</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f9;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.container {
background-color: #fff;
padding: 20px 30px;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
width: 320px;
}
h2 {
text-align: center;
margin-bottom: 20px;
}
label {
display: block;
margin-top: 10px;
}
input[type="text"], input[type="password"] {
width: 100%;
padding: 8px;
margin-top: 5px;
border: 1px solid #ccc;
border-radius: 5px;
}
button {
width: 100%;
padding: 10px;
margin-top: 15px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
}
button:hover {
background-color: #45a049;
}
.message {
margin-top: 15px;
text-align: center;
font-weight: bold;
}
</style>
</head>
<body>
<div class="container">
<h2>Register</h2>
<form id="registerForm">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required />

<label for="password">Password:</label>
<input type="password" id="password" name="password" required />

<button type="submit">Register</button>
</form>
<div class="message" id="message"></div>
</div>

<script>

document.getElementById('registerForm').addEventListener('submit', async function(e) {
e.preventDefault();

const username = document.getElementById('username').value;
const password = document.getElementById('password').value;

try {
const response = await fetch('/api/register', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ username, password })
});

const data = await response.json();
const messageDiv = document.getElementById('message');

if (response.ok) {
messageDiv.style.color = 'green';
messageDiv.textContent = data.message;
document.getElementById('registerForm').reset();
} else {
messageDiv.style.color = 'red';
messageDiv.textContent = data.message;
}
} catch (err) {
console.error('Error:', err);
}
});
</script>
</body>
</html>
Loading