Skip to content
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

Fix cursor trail effect to appear only on the home page #765

Closed
wants to merge 3 commits into from
Closed

Fix cursor trail effect to appear only on the home page #765

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
2a7b23c
Fix cursor trail effect to appear only on the home page
ritiksingh-01 Oct 14, 2024
bbf4d0e
Merge branch 'main' into cursor_trail_update
Priyanshi0112 Oct 15, 2024
4054928
Merge branch 'main' into cursor_trail_update
Priyanshi0112 Oct 16, 2024
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
218 changes: 124 additions & 94 deletions Feedback.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,7 @@

<link rel="stylesheet" href="src/css/index.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
<div class="gtranslate_wrapper"></div>
<script>window.gtranslateSettings = {"default_language":"en","detect_browser_language":true,"wrapper_selector":".gtranslate_wrapper"}</script>
<script src="https://cdn.gtranslate.net/widgets/latest/float.js" defer></script>

<style>
body {
font-family: "Poppins", sans-serif;
Expand Down Expand Up @@ -49,9 +47,6 @@
color: black;
padding: 10px;
}



.navbar.dark-mode {
background-color: black;
/* Dark mode navbar */
Expand Down Expand Up @@ -709,12 +704,13 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
">↑</button>
</div>
</footer>
<!-- FAQ Popup Button -->
<button id="faqButton"

<!-- FAQ Popup Button -->
<button id="faqButton"
style="position: fixed; bottom: 20px; right: 80px; z-index: 1000; background-color: #2980b9; color: white; border: none; padding: 10px 20px; border-radius: 5px; cursor: pointer; display: none;">FAQ</button>

<!-- FAQ Popup -->
<div id="faqPopup"
<!-- FAQ Popup -->
<div id="faqPopup"
style="display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.3); z-index: 1001; max-width: 80%; max-height: 80%; overflow-y: auto;">
<h2>Frequently Asked Questions</h2>
<div class="faq-content">
Expand All @@ -738,8 +734,10 @@ <h3>How can hospitals benefit from AmbuFlow?</h3>
our integrated system.</p>
</div>
</div>
<!-- Add close button for FAQ Popup -->
<button id="closeFaqPopup" style="margin-top: 20px;">Close</button>
<button id="closeFaqPopup"
style="background-color: #e74c3c; color: white; border: none; padding: 5px 10px; border-radius: 5px; cursor: pointer; margin-top: 10px;">Close</button>
</div>
<button id="closeFaqPopup" style="background-color: #e74c3c; color: white; border: none; padding: 5px 10px; border-radius: 5px; cursor: pointer; margin-top: 10px;">Close</button>
</div>

<!-- Add this div for the translator popup -->
Expand All @@ -748,14 +746,81 @@ <h3>How can hospitals benefit from AmbuFlow?</h3>
</div>

<script src="preloader.js"></script>
<script>
// Add event listeners to each star label for toggling the selection
const stars = document.querySelectorAll('.star-rating input');
stars.forEach(star => {
star.addEventListener('change', function () {
// Remove the checked state from all stars
stars.forEach(s => {
const label = document.querySelector(`label[for="${s.id}"]`);
label.style.color = '#ddd'; // Reset color for unselected stars

<script src="preloader.js"></script>

<!-- -->
<script>
// Back to top button functionality
const backToTopButton = document.getElementById('backToTopBtn');
<script>
// adding code for dark mode
document.addEventListener('DOMContentLoaded', function () {
const toggleButton = document.getElementById('dark-mode-toggle');
const darkModeButton = document.querySelector('.dark-mode-toggle');
const logoImage = document.querySelector('.logo img'); // Select the logo image
const navbar = document.querySelector('.navbar'); // Select the navbar

// Reset to light mode for the Contact page
document.body.classList.remove("dark-mode");
document.body.classList.add("light-mode");
darkModeButton.innerHTML = '<i class="fa-solid fa-moon"></i>'; // Set icon for light mode
navbar.classList.remove("dark-mode"); // Ensure navbar is in light mode

// Clear the sessionStorage for theme on this page
sessionStorage.removeItem("theme");

toggleButton.addEventListener('click', function () {
document.body.classList.toggle('dark-mode');
navbar.classList.toggle('dark-mode'); // Toggle dark mode for navbar

// Update sessionStorage based on current mode
if (document.body.classList.contains('dark-mode')) {
sessionStorage.setItem("theme", "dark");
darkModeButton.innerHTML = '<i class="fa-solid fa-sun"></i>'; // Change icon
} else {
sessionStorage.setItem("theme", "light");
darkModeButton.innerHTML = '<i class="fa-solid fa-moon"></i>'; // Change icon
}

});
});

// end
</script>

<script>
// Add event listeners to each star label for toggling the selection
const stars = document.querySelectorAll('.star-rating input');
stars.forEach(star => {
star.addEventListener('change', function () {
// Remove the checked state from all stars
stars.forEach(s => {
const label = document.querySelector(`label[for="${s.id}"]`);
label.style.color = '#ddd'; // Reset color for unselected stars
});
// Highlight the selected star and all previous stars
this.checked = true;
const currentStarValue = this.value;
for (let i = 1; i <= currentStarValue; i++) {
const label = document.querySelector(`label[for="star${i}"]`);
label.style.color = '#ffdd00'; // Highlight selected stars
}
});
});
</script>
// Handle form submission
const form = document.getElementById('feedback-box');
const feedbackBox = document.querySelector('.feedback-box');
const thankYouMessage = document.getElementById('thank-you-message');

<<<<<<< HEAD
form.addEventListener('submit', function (event) {
event.preventDefault(); // Prevent the default form submission
<script src="preloader.js"></script>

<script>
Expand Down Expand Up @@ -896,94 +961,63 @@ <h3>How can hospitals benefit from AmbuFlow?</h3>
});

requestAnimationFrame(animateCircles);
=======
// Show the button when scrolled down 100px from the top
window.onscroll = function () {
if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
backToTopButton.style.display = "block";
} else {
backToTopButton.style.display = "none";
>>>>>>> c3e6128543c5c7da4acc09c472a624a52adb1043
}
};
// Show the thank-you message
thankYouMessage.style.display = 'flex';

// Scroll to top when the button is clicked
backToTopButton.addEventListener('click', () => {
window.scrollTo({ top: 0, behavior: 'smooth' });
});
</script>

// Hide the form to avoid further submissions
form.style.display = 'none';

<script>
// Dark mode functionality
document.addEventListener('DOMContentLoaded', function () {
const toggleButton = document.getElementById('dark-mode-toggle');
const darkModeButton = document.querySelector('.dark-mode-toggle');
const logoImage = document.querySelector('.logo img'); // Select the logo image
const navbar = document.querySelector('.navbar'); // Select the navbar

// Reset to light mode for the Contact page
document.body.classList.remove("dark-mode");
document.body.classList.add("light-mode");
darkModeButton.innerHTML = '<i class="fa-solid fa-moon"></i>'; // Set icon for light mode
navbar.classList.remove("dark-mode"); // Ensure navbar is in light mode

// Clear the sessionStorage for theme on this page
sessionStorage.removeItem("theme");

toggleButton.addEventListener('click', function () {
document.body.classList.toggle('dark-mode');
navbar.classList.toggle('dark-mode'); // Toggle dark mode for navbar

// Update sessionStorage based on current mode
if (document.body.classList.contains('dark-mode')) {
sessionStorage.setItem("theme", "dark");
darkModeButton.innerHTML = '<i class="fa-solid fa-sun"></i>'; // Change icon
// Redirect to the home page after 2 seconds
setTimeout(function () {
window.location.href = 'index.html';
}, 5000); // Adjust the delay as needed
});
</script>
// Add this new code for the Back to Top functionality
const backToTopBtn = document.getElementById('backToTopBtn');
const faqButton = document.getElementById('faqButton');
const faqPopup = document.getElementById('faqPopup');
const closeFaqPopup = document.getElementById('closeFaqPopup');

// Show/hide buttons when user scrolls
window.onscroll = function () {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
backToTopBtn.style.display = "block";
faqButton.style.display = "block";
} else {
sessionStorage.setItem("theme", "light");
darkModeButton.innerHTML = '<i class="fa-solid fa-moon"></i>'; // Change icon
backToTopBtn.style.display = "none";
faqButton.style.display = "none";
}
});
});

// FAQ Popup functionality
const faqButton = document.getElementById('faqButton');
const faqPopup = document.getElementById('faqPopup');
const closeFaqPopup = document.getElementById('closeFaqPopup');
};

faqButton.addEventListener('click', () => {
faqPopup.style.display = 'block';
});
// Scroll to top when button is clicked
backToTopBtn.addEventListener('click', function () {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
});

closeFaqPopup.addEventListener('click', () => {
faqPopup.style.display = 'none';
});
// FAQ Popup functionality
faqButton.addEventListener('click', () => {
faqPopup.style.display = 'block';
});

// Close popup when clicking outside
window.addEventListener('click', (event) => {
if (event.target === faqPopup) {
closeFaqPopup.addEventListener('click', () => {
faqPopup.style.display = 'none';
}
});

// Show/hide buttons when user scrolls
window.onscroll = function () {
const backToTopBtn = document.getElementById('backToTopBtn');
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
backToTopBtn.style.display = "block";
faqButton.style.display = "block";
} else {
backToTopBtn.style.display = "none";
faqButton.style.display = "none";
}
};
});

// Add the translator popup functionality
const translateBtn = document.getElementById('translateBtn');
const gTranslate = document.getElementById('gTranslate');

translateBtn.addEventListener('click', function() {
gTranslate.style.display = gTranslate.style.display === 'none' ? 'block' : 'none';
if (gTranslate.style.display === 'none') {
gTranslate.style.display = 'block';
} else {
gTranslate.style.display = 'none';
}
});

// Close the translator popup when clicking outside
Expand All @@ -994,6 +1028,7 @@ <h3>How can hospitals benefit from AmbuFlow?</h3>
});
</script>

<!-- Add this script at the end of the body -->
<script>
window.gtranslateSettings = {
"default_language": "en",
Expand All @@ -1002,23 +1037,18 @@ <h3>How can hospitals benefit from AmbuFlow?</h3>
"alt_flags": {"en": "usa"}
}
</script>

<script src="https://cdn.gtranslate.net/widgets/latest/float.js" defer></script>

<script>
});

window.addEventListener('click', (event) => {
if (event.target === faqPopup) {
faqPopup.style.display = 'none';
}
});
</script>


<!-- Add this if it's not already present -->
<div class="circle"></div>
<!-- Add this if it's not already present -->
<div class="circle"></div>
</body>
</html>
</html>
Loading