diff --git a/Templates/login-register/login.html b/Templates/login-register/login.html
new file mode 100644
index 0000000000000000000000000000000000000000..092908ccc5f9ce4e7c31f84b25ec6bd3f07dd3a2
--- /dev/null
+++ b/Templates/login-register/login.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Airline Booking - Login</title>
+ <link rel="stylesheet" href="login_register_style.css">
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
+</head>
+<body>
+ <div class="container">
+ <form>
+ <div class="form-group">
+ <label for="exampleInputEmail1">Email address</label>
+ <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
+ </div>
+ <div class="form-group">
+ <label for="exampleInputPassword1">Password</label>
+ <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
+ </div>
+ <div class="form-group form-check">
+ <!-- <input type="checkbox" class="form-check-input" id="exampleCheck1"> -->
+ <!-- <label class="form-check-label" for="exampleCheck1">Check me out</label> -->
+ </div>
+ <button type="submit" class="btn btn-primary">Submit</button>
+ </form>
+ </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/Templates/login-register/login_register_style.css b/Templates/login-register/login_register_style.css
new file mode 100644
index 0000000000000000000000000000000000000000..51fe1c5f4cf17c3b25ed2b1397b08be2a1046dad
--- /dev/null
+++ b/Templates/login-register/login_register_style.css
@@ -0,0 +1,15 @@
+form {
+ width: 30%;
+ border: 1px solid #ccc; /* Example border: 1px solid with color #ccc */
+ padding: 20px;
+ border-radius: 5px; /* Optional: if you want rounded corners */
+ background-color: #ffffff;
+
+}
+
+.container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+}
\ No newline at end of file
diff --git a/Templates/login-register/register.html b/Templates/login-register/register.html
new file mode 100644
index 0000000000000000000000000000000000000000..88252690fc4f234f0faa3399d12a9a320effc4e0
--- /dev/null
+++ b/Templates/login-register/register.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Airline Booking - Register</title>
+ <link rel="stylesheet" href="login_register_style.css">
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
+ <script src="register.js"></script>
+</head>
+<body>
+ <div class="container">
+ <form onsubmit="return checkPasswords()">
+ <div class="form-group">
+ <label for="inputFullName">Full name</label>
+ <input type="text" class="form-control" id="inputFullName" placeholder="Full name">
+ </div>
+ <div class="form-group">
+ <label for="inputEmail">Email address</label>
+ <input type="email" class="form-control" id="inputEmail" placeholder="Enter email">
+ </div>
+ <div class="form-group">
+ <label for="inputPassword">Password</label>
+ <input type="password" class="form-control" id="inputPassword" placeholder="Password">
+ </div>
+ <div class="form-group">
+ <label for="inputConfirmPassword">Confirm password</label>
+ <input type="password" class="form-control" id="inputConfirmPassword" placeholder="Confirm Password">
+ </div>
+ <button type="submit" class="btn btn-primary">Submit</button>
+ </form>
+ </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/Templates/login-register/register.js b/Templates/login-register/register.js
new file mode 100644
index 0000000000000000000000000000000000000000..a4f443ddbcb5f90f6b395c532028511aa0b5ea74
--- /dev/null
+++ b/Templates/login-register/register.js
@@ -0,0 +1,15 @@
+function checkPasswords() {
+ var password = document.getElementById('inputPassword').value;
+ var confirmPassword = document.getElementById('inputConfirmPassword').value;
+
+ if (password === confirmPassword) {
+ // The passwords match
+ // You can add code here to handle the form submission
+ return true; // return true to submit the form
+ } else {
+ // The passwords do not match
+ // Alert the user
+ alert("The passwords do not match!");
+ return false; // return false to prevent form submission
+ }
+}
\ No newline at end of file
diff --git a/Templates/user_profile/avatar.jpg b/Templates/user_profile/avatar.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..6cc1140f400c6e47c6ac1ddf985ee188f92c4ae2
Binary files /dev/null and b/Templates/user_profile/avatar.jpg differ
diff --git a/Templates/user_profile/profile.css b/Templates/user_profile/profile.css
new file mode 100644
index 0000000000000000000000000000000000000000..44709d293b4e4371a128b360ee799ddb76f9813c
--- /dev/null
+++ b/Templates/user_profile/profile.css
@@ -0,0 +1,53 @@
+body{
+ margin-top:20px;
+ color: #1a202c;
+ text-align: left;
+ background-color: #e2e8f0;
+}
+.main-body {
+ padding: 15px;
+}
+.card {
+ box-shadow: 0 1px 3px 0 rgba(0,0,0,.1), 0 1px 2px 0 rgba(0,0,0,.06);
+}
+
+.card {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ min-width: 0;
+ word-wrap: break-word;
+ background-color: #fff;
+ background-clip: border-box;
+ border: 1px solid #ddd; /* Light grey border */
+ border-radius: 4px;
+}
+
+.card-body {
+ flex: 1 1 auto;
+ min-height: 1px;
+ padding: 1rem;
+}
+
+.gutters-sm {
+ margin-right: -8px;
+ margin-left: -8px;
+}
+
+.gutters-sm>.col, .gutters-sm>[class*=col-] {
+ padding-right: 8px;
+ padding-left: 8px;
+}
+.mb-3, .my-3 {
+ margin-bottom: 1rem!important;
+}
+
+.bg-gray-300 {
+ background-color: #e2e8f0;
+}
+.h-100 {
+ height: 100%!important;
+}
+.shadow-none {
+ box-shadow: none!important;
+}
\ No newline at end of file
diff --git a/Templates/user_profile/profile.html b/Templates/user_profile/profile.html
new file mode 100644
index 0000000000000000000000000000000000000000..68302e72d1107e459360f835062c811d8b6eab52
--- /dev/null
+++ b/Templates/user_profile/profile.html
@@ -0,0 +1,158 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Airline Booking - Profile</title>
+ <link rel="stylesheet" href="profile.css">
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
+ <script src="profile_script.js"></script>
+</head>
+<body>
+ <div class="container">
+ <div class="main-body">
+
+ <div class="row gutters-sm">
+ <div class="col-md-4 mb-3">
+ <div class="card">
+ <div class="card-body">
+ <div class="d-flex flex-column align-items-center text-center">
+ <img src="avatar.jpg" alt="Admin" class="rounded-circle" width="150">
+ <div class="mt-3">
+ <h4 id="profileName">Illya Globa</h4>
+ <p class="text-secondary mb-1">Loyal Customer</p>
+ <p class="text-muted font-size-sm">Guildford</p>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="col-md-8">
+ <div class="card mb-3">
+ <div class="card-body">
+ <div class="row">
+ <div class="col-sm-3">
+ <h6 class="mb-0">Full Name</h6>
+ </div>
+ <div class="col-sm-9 text-secondary">
+ <input type="text" id="fullName" class="form-control" value="Illya Globa" readonly>
+ </div>
+ </div>
+ <hr>
+ <div class="row">
+ <div class="col-sm-3">
+ <h6 class="mb-0">Email</h6>
+ </div>
+ <div class="col-sm-9 text-secondary">
+ <input type="email" id="email" class="form-control" value="ig@surrey.ac.uk" readonly>
+ </div>
+ </div>
+ <hr>
+ <div class="row">
+ <div class="col-sm-3">
+ <h6 class="mb-0">Password</h6>
+ </div>
+ <div class="col-sm-9 text-secondary">
+ <input type="password" id="password" class="form-control" value="password" readonly>
+ </div>
+ </div>
+ <hr>
+ <div class="row">
+ <div class="col-sm-12">
+ <button class="btn btn-primary" onclick="editProfile()">Edit</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ </div>
+
+ </div>
+ <div class="row">
+ <div class="col-md-12">
+ <h3>Upcoming Flights</h3>
+ </div>
+ <div class="col-md-3">
+ <div class="card" style="width: 25rem;">
+ <div class="card-body">
+ <h5 class="card-title">Flight number</h5>
+ <h6 class="card-subtitle mb-2 text-muted">LTN - MLG</h6>
+ <p class="card-text">London(LTN) - Spain(MLG)</p>
+ <a href="#" class="card-link">Card link</a>
+ <a href="#" class="card-link">Another link</a>
+ </div>
+ </div>
+ </div>
+ <div class="col-md-3">
+ <div class="card" style="width: 25rem;">
+ <div class="card-body">
+ <h5 class="card-title">Flight number</h5>
+ <h6 class="card-subtitle mb-2 text-muted">LTN - MLG</h6>
+ <p class="card-text">London(LTN) - Spain(MLG)</p>
+ <a href="#" class="card-link">Card link</a>
+ <a href="#" class="card-link">Another link</a>
+ </div>
+ </div>
+ </div>
+ <div class="col-md-3">
+ <div class="card" style="width: 25rem;">
+ <div class="card-body">
+ <h5 class="card-title">Flight number</h5>
+ <h6 class="card-subtitle mb-2 text-muted">LTN - MLG</h6>
+ <p class="card-text">London(LTN) - Spain(MLG)</p>
+ <a href="#" class="card-link">Card link</a>
+ <a href="#" class="card-link">Another link</a>
+ </div>
+ </div>
+ </div>
+ <!-- If you have another flight card add it here as another .col-md-6 -->
+ </div>
+
+ <div class="row" style="margin-top: 20px;">
+ <div class="col-md-12">
+ <h3>Flights History</h3>
+ </div>
+ <div class="col-md-3">
+ <div class="card" style="width: 25rem;">
+ <div class="card-body">
+ <h5 class="card-title">Flight number</h5>
+ <h6 class="card-subtitle mb-2 text-muted">LTN - MLG</h6>
+ <p class="card-text">London(LTN) - Spain(MLG)</p>
+ <a href="#" class="card-link">Card link</a>
+ <a href="#" class="card-link">Another link</a>
+ </div>
+ </div>
+ </div>
+ <div class="col-md-3">
+ <div class="card" style="width: 25rem;">
+ <div class="card-body">
+ <h5 class="card-title">Flight number</h5>
+ <h6 class="card-subtitle mb-2 text-muted">LTN - MLG</h6>
+ <p class="card-text">London(LTN) - Spain(MLG)</p>
+ <a href="#" class="card-link">Card link</a>
+ <a href="#" class="card-link">Another link</a>
+ </div>
+ </div>
+ </div>
+ <div class="col-md-3">
+ <div class="card" style="width: 25rem;">
+ <div class="card-body">
+ <h5 class="card-title">Flight number</h5>
+ <h6 class="card-subtitle mb-2 text-muted">LTN - MLG</h6>
+ <p class="card-text">London(LTN) - Spain(MLG)</p>
+ <a href="#" class="card-link">Card link</a>
+ <a href="#" class="card-link">Another link</a>
+ </div>
+ </div>
+ </div>
+ <!-- If you have another flight card add it here as another .col-md-6 -->
+ </div>
+ <button style="margin-top: 10px;" type="submit" class="btn btn-primary">View more</button>
+ </div>
+ </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/Templates/user_profile/profile_script.js b/Templates/user_profile/profile_script.js
new file mode 100644
index 0000000000000000000000000000000000000000..0a70508a83911d2a9ea0943f159c7e5d093a0580
--- /dev/null
+++ b/Templates/user_profile/profile_script.js
@@ -0,0 +1,19 @@
+function editProfile() {
+ // Get the input fields
+ var fullNameField = document.getElementById('fullName');
+ var emailField = document.getElementById('email');
+ var passwordField = document.getElementById('password');
+
+ // Check if the input fields are readonly - if so, make them editable
+ if (fullNameField.readOnly === true) {
+ fullNameField.readOnly = false;
+ emailField.readOnly = false;
+ passwordField.readOnly = false;
+ fullNameField.focus(); // Set focus on the name field to start editing
+ } else {
+ fullNameField.readOnly = true;
+ emailField.readOnly = true;
+ passwordField.readOnly = true;
+ // Here you can also add an AJAX call to save the data if needed
+ }
+}
\ No newline at end of file
diff --git a/Templates/user_profile/user.png b/Templates/user_profile/user.png
new file mode 100644
index 0000000000000000000000000000000000000000..063717636aec642b496d4c65e975311aa01fd429
Binary files /dev/null and b/Templates/user_profile/user.png differ