diff --git a/osinaweb/osinaweb/__pycache__/__init__.cpython-311.pyc b/osinaweb/osinaweb/__pycache__/__init__.cpython-311.pyc
index 09ab919b..555d7980 100644
Binary files a/osinaweb/osinaweb/__pycache__/__init__.cpython-311.pyc and b/osinaweb/osinaweb/__pycache__/__init__.cpython-311.pyc differ
diff --git a/osinaweb/osinaweb/__pycache__/settings.cpython-311.pyc b/osinaweb/osinaweb/__pycache__/settings.cpython-311.pyc
index 65823118..016623f6 100644
Binary files a/osinaweb/osinaweb/__pycache__/settings.cpython-311.pyc and b/osinaweb/osinaweb/__pycache__/settings.cpython-311.pyc differ
diff --git a/osinaweb/osinaweb/__pycache__/urls.cpython-311.pyc b/osinaweb/osinaweb/__pycache__/urls.cpython-311.pyc
index 32b83642..362df0c9 100644
Binary files a/osinaweb/osinaweb/__pycache__/urls.cpython-311.pyc and b/osinaweb/osinaweb/__pycache__/urls.cpython-311.pyc differ
diff --git a/osinaweb/osinaweb/__pycache__/wsgi.cpython-311.pyc b/osinaweb/osinaweb/__pycache__/wsgi.cpython-311.pyc
index 35324dd8..bad42f53 100644
Binary files a/osinaweb/osinaweb/__pycache__/wsgi.cpython-311.pyc and b/osinaweb/osinaweb/__pycache__/wsgi.cpython-311.pyc differ
diff --git a/osinaweb/static/dist/output.css b/osinaweb/static/dist/output.css
index c799203a..f963cb13 100644
--- a/osinaweb/static/dist/output.css
+++ b/osinaweb/static/dist/output.css
@@ -1,5 +1,5 @@
/*
-! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com
+! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
*/
/*
@@ -32,9 +32,11 @@
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
+7. Disable tap highlights on iOS
*/
-html {
+html,
+:host {
line-height: 1.5;
/* 1 */
-webkit-text-size-adjust: 100%;
@@ -44,12 +46,14 @@ html {
-o-tab-size: 4;
tab-size: 4;
/* 3 */
- font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+ font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
/* 4 */
font-feature-settings: normal;
/* 5 */
font-variation-settings: normal;
/* 6 */
+ -webkit-tap-highlight-color: transparent;
+ /* 7 */
}
/*
@@ -121,8 +125,10 @@ strong {
}
/*
-1. Use the user's configured `mono` font family by default.
-2. Correct the odd `em` font sizing in all browsers.
+1. Use the user's configured `mono` font-family by default.
+2. Use the user's configured `mono` font-feature-settings by default.
+3. Use the user's configured `mono` font-variation-settings by default.
+4. Correct the odd `em` font sizing in all browsers.
*/
code,
@@ -131,8 +137,12 @@ samp,
pre {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
/* 1 */
- font-size: 1em;
+ font-feature-settings: normal;
/* 2 */
+ font-variation-settings: normal;
+ /* 3 */
+ font-size: 1em;
+ /* 4 */
}
/*
@@ -1112,10 +1122,19 @@ video {
height: 100%;
}
+.h-max {
+ height: -moz-max-content;
+ height: max-content;
+}
+
.h-screen {
height: 100vh;
}
+.max-h-\[700px\] {
+ max-height: 700px;
+}
+
.w-1 {
width: 0.25rem;
}
@@ -1144,6 +1163,10 @@ video {
width: 13px;
}
+.w-\[150px\] {
+ width: 150px;
+}
+
.w-\[180px\] {
width: 180px;
}
@@ -1156,6 +1179,10 @@ video {
width: 22px;
}
+.w-\[230px\] {
+ width: 230px;
+}
+
.w-\[25\%\] {
width: 25%;
}
@@ -1216,10 +1243,6 @@ video {
width: 50px;
}
-.w-\[550px\] {
- width: 550px;
-}
-
.w-\[55px\] {
width: 55px;
}
@@ -1266,7 +1289,7 @@ video {
}
.max-w-0 {
- max-width: 0rem;
+ max-width: 0px;
}
.max-w-2xl {
@@ -1500,6 +1523,10 @@ video {
border-color: rgb(229 231 235 / var(--tw-divide-opacity));
}
+.overflow-auto {
+ overflow: auto;
+}
+
.overflow-hidden {
overflow: hidden;
}
@@ -2655,17 +2682,14 @@ video {
::-webkit-scrollbar {
width: 5px;
- /* Width of the entire scrollbar */
}
::-webkit-scrollbar-thumb {
background: #7b88948b;
- /* Color of the scroll thumb */
}
::-webkit-scrollbar-track {
background: #5a5a5a00;
- /* Color of the scrollbar track */
}
/* Website's font */
@@ -2688,6 +2712,24 @@ video {
src: url('../dist/fonts/Poppins-Bold.ttf');
}
+/* TO SHOW AND HIDE MESSAGES SMOOTHLY */
+
+/* Show the message with a fade-in animation */
+
+.show-message {
+ opacity: 1;
+ transform: translateY(0);
+ transition: opacity 0.3s, transform 0.3s;
+}
+
+/* Hide the message with a fade-out animation */
+
+.hide-message {
+ opacity: 0;
+ transform: translateY(-100%);
+ transition: opacity 0.5s, transform 0.5s;
+}
+
/* FOR THE IFRAME TO TAKE 95% OF WIDTH ON SMALL SCREEN SIZES */
@media screen and (max-width: 798px) {
@@ -2862,6 +2904,38 @@ video {
background-color: rgba(128, 128, 128, 0.265);
}
+/* CUSTOMER DASHBOARD PAYMENT */
+
+#paymentContent {
+ height: 100% !important;
+ position: relative !important;
+ max-height: 100% !important;
+ margin-top: 20px;
+ overflow-y: auto !important;
+}
+
+#paymentContent iframe {
+ position: relative !important;
+ height: 100% !important;
+ overflow-y: auto !important;
+}
+
+#paymentContent::-webkit-scrollbar {
+ width: 5px;
+ border-radius: 10px;
+}
+
+#paymentContent::-webkit-scrollbar-thumb {
+ background: rgba(208, 208, 208, 0.377);
+ border-radius: 10px;
+}
+
+#paymentContent::-webkit-scrollbar-track {
+ background: transparent;
+}
+
+/* CUSTOMER DASHBOARD PAYMENT CLOSURE */
+
.hover\:scale-105:hover {
--tw-scale-x: 1.05;
--tw-scale-y: 1.05;
diff --git a/osinaweb/static/js/customer_dashboard/payment.js b/osinaweb/static/js/customer_dashboard/payment.js
index bf70bb96..3e15beb4 100644
--- a/osinaweb/static/js/customer_dashboard/payment.js
+++ b/osinaweb/static/js/customer_dashboard/payment.js
@@ -1,8 +1,13 @@
document.addEventListener("DOMContentLoaded", function () {
- // Function to initiate checkout
+ Checkout.configure({
+ session: {
+ id: 1, // Default session ID, will be replaced with actual session ID after initiation
+ }
+ });
+
+
function initiateCheckout() {
- // Fetch the CSRF token from the cookie
const csrftoken = getCookie('csrftoken');
console.log('CSRF Token:', csrftoken);
@@ -11,7 +16,7 @@ document.addEventListener("DOMContentLoaded", function () {
method: 'POST',
headers: {
'Content-Type': 'application/json',
- 'X-CSRFToken': csrftoken // Include the CSRF token in the request headers
+ 'X-CSRFToken': csrftoken
},
body: JSON.stringify({})
})
@@ -24,26 +29,20 @@ document.addEventListener("DOMContentLoaded", function () {
.then(data => {
// Handle success response
console.log("Session ID: " + data.session_id);
- // Configure Checkout with the fetched session ID
- configureCheckout(data.session_id);
+ // Update Checkout session with the fetched session ID and show the embedded page
+ Checkout.configure({
+ session: {
+ id: data.session_id,
+ }
+ });
+ $('#paymentContent').empty();
+ Checkout.showEmbeddedPage('#paymentContent', () => { $('#paymentModal').modal(); });
})
.catch(error => {
- // Handle error response
console.error('There was a problem with the fetch operation:', error);
- // You can display an error message to the user or perform other actions
});
}
- // Function to configure Checkout with session ID
- function configureCheckout(sessionId) {
- // Configure Checkout session with the fetched session ID
- Checkout.configure({
- session: {
- id: sessionId,
- }
- });
- }
-
// Function to get CSRF token from cookie
function getCookie(name) {
let cookieValue = null;
@@ -60,32 +59,22 @@ document.addEventListener("DOMContentLoaded", function () {
return cookieValue;
}
- // Configure Checkout and modal
- Checkout.configure({
- session: {
- id: 1, // Default session ID, will be replaced with actual session ID after initiation
- }
- });
-
-
const displayPaymentModalButton = document.querySelectorAll('.displayPaymentModal');
const closeButton = document.querySelector('#closePaymentModalButton');
const paymentModal = document.getElementById('paymentModal');
- // Add click event listener to each button
displayPaymentModalButton.forEach(function (button) {
button.addEventListener('click', function () {
paymentModal.classList.remove('hidden');
+ document.body.style.overflow = 'hidden';
initiateCheckout();
-
- Checkout.showEmbeddedPage('#paymentContent', () => { $('#paymentModal').modal(); });
});
});
closeButton.addEventListener('click', function () {
paymentModal.classList.add('hidden');
sessionStorage.clear();
+ document.body.style.overflow = '';
});
-
-});
\ No newline at end of file
+});
diff --git a/osinaweb/tailwind.config.js b/osinaweb/tailwind.config.js
index 9584dbde..81d273d9 100644
--- a/osinaweb/tailwind.config.js
+++ b/osinaweb/tailwind.config.js
@@ -2,9 +2,9 @@
module.exports = {
content: [
"./input.css",
- "./static/**/*.html",
"./static/dist/output.css",
"./osinacore/templates/**/*.html",
+ "./customercore/templates/**/*.html",
],
theme: {
screens: {
- 
- 
- 
- 
- 
- 
- 
- 
- 
- 
- 
- 
- 
+ 
+