Skip to content

Commit

Permalink
update the feedback.html for Tejashri-Taral#639
Browse files Browse the repository at this point in the history
  • Loading branch information
@Baig-fatema
Baig-fatema committed Oct 24, 2024
1 parent 21b3507 commit 16b6aab
Show file tree
Hide file tree
Showing 2 changed files with 242 additions and 16 deletions.
257 changes: 241 additions & 16 deletions feedback.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="images/logo1.png" type="image/x-icon">
<title>Feedback Form</title>
<!-- <link rel="stylesheet" href="preloaderStyle.css"> -->
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="./style.css">
<link rel="stylesheet" herf="https://use.fontawesome.com/releases/v5.4.1/css/all.css">
<link rel="stylesheet" href="./Style/popup.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link rel="stylesheet" href="preloaderStyle.css">
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="./style.css">
<link rel="stylesheet" herf="https://use.fontawesome.com/releases/v5.4.1/css/all.css">
<link rel="stylesheet" href="./Style/popup.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<style>
body {
background-color: #f8f9fa;
Expand Down Expand Up @@ -79,9 +78,10 @@

</head>
<body>
<header class="header" id="header" style="justify-content: center;">
<!-- header section -->
<header class="header" id="header">
<div class="logo">
<a href="/"> <img src="images/logo.png" alt="Logo" srcset=""> </a>
<a href="/"> <img src="images/logo.png" alt="Logo" srcset=""> </a>
<i class="fa-solid fa-bars menu" id="menu"></i>
</div>

Expand Down Expand Up @@ -119,21 +119,40 @@
</div>
</nav>



<nav class="utils">
<ul class="nav-links">
<li class="nav-link">
<i class="fa-solid fa-cart-shopping"></i>
</li>
<li class="nav-link">
<a href="login-sginup.html">
<i class="fa-solid fa-user"></i>
</a>
</li>
<li class="nav-link">
<i class="fa-solid fa-magnifying-glass" id="search-icon"></i>
</li>
</ul>
</nav>
</header>
<!-- Form -->

<!-- Form -->
<div class="feedback-container">
<img src="https://img.icons8.com/ios-filled/50/000000/rocket.png" alt="Feedback Icon" width="50">
<h2 class="text-center" style="font-size: 30px; font-style:bold;">Drop Us a Feedback</h2>

<form id="feedbackForm">
<div class="form-group">
<label for="name">Your Name</label>
<input type="text" id="name" name="name" class="form-control" placeholder="Your Name" required>
<br>
<input type="text" id="name" name="name" class="form-control" placeholder="Your Name" required style="width: 100%; border: 1px solid black; border-radius: 5px; padding-left: 10px; font-size: 18px;">
</div>

<div class="form-group">
<label for="email">Your Email</label>
<input type="email" id="email" name="email" class="form-control" placeholder="Your Email" required>
<input type="email" id="email" name="email" class="form-control" placeholder="Your Email" required style="font-size: 18px;">
</div>

<div class="form-group">
Expand Down Expand Up @@ -182,10 +201,12 @@ <h2 class="text-center" style="font-size: 30px; font-style:bold;">Drop Us a Feed

<div class="form-group">
<label for="message">Your Message Or Suggestion</label>
<textarea id="message" name="message" class="form-control" rows="4" placeholder="Your Message Or Suggestion" required></textarea>
<br>
<br>
<textarea id="message" name="message" class="form-control" rows="6" placeholder="Your Message Or Suggestion" required style="width: 100%; font-size: 18px; padding-left: 10px; padding-top: 10px;"></textarea>
</div>

<button type="submit" class="btn btn-primary btn-block">Send Feedback</button>
<button type="submit" class="btn btn-primary btn-block" style="align-items: center; justify-content: center; justify-items: center; width: 100%; background-color: #0056b3;">Send Feedback</button>
</form>
</div>

Expand Down Expand Up @@ -231,6 +252,7 @@ <h1>Quick Links</h1>
<li><a href="return-policy.html">Return Policy</a></li>
<li><a href="https://github.com/Tejashri-Taral/TrendTrove-Ecommerce" target="_blank">Star Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
<li><a href="feedback.html">Feedback</a></li>

</ul>
</div>
Expand All @@ -251,6 +273,209 @@ <h1>Subscribe to Newsletter</h1>
<div class="footer-copyright">
<div id="copyright">© <span id="year">2024</span> TrendTrove. All Rights Reserved.</div>
</div>

<script>
const currentYear = new Date().getFullYear();
document.getElementById('year').textContent = currentYear;
</script>

<div class="modal-box" id="modalbox" style="display: none;">
<div class="modal" id="modal">
<div id="close-btn">&times;</div>
<div class="modal-content">
<img src="images\confirmation.png" alt="" height="100px" >
<h2>Subscription Successful!</h2>
<p>Thank you for subscribing.</p>
<p> You will receive notifications, updates via email.</p>
</div>
<div class="social">
<li class="socials">
<a href="https://www.linkedin.com/in/tejashri-taral-5006a82a0/" id="linkedin" target="_blank">
<i class="fa-brands fa-linkedin"></i>
</a>
<a href="https://github.com/Tejashri-Taral" id="github" target="_blank">
<i class="fa-brands fa-github"></i>
</a>
<a href="https://x.com/Tejashri_10?t=SWxALwKxy-nVrTcbYTFUcA&s=08" id="twitter" target="_blank">
<i class="fa-brands fa-x-twitter"></i>
</a>
<a href="https://www.instagram.com/your_instagram" id="instagram" target="_blank">
<i class="fa-brands fa-instagram"></i>
</a>
</li>
</div>
</div>
</div>
<script src="./script/modal_box.js"></script>

<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<!-- ProgressBar Functionality -->
<script>
window.onscroll = function () {
updateProgressBar();
};
function updateProgressBar() {
const windowScroll = document.body.scrollTop || document.documentElement.scrollTop;
const documentHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
const scrollPercent = (windowScroll / documentHeight) * 100;
document.getElementById(" progress-bar ").style.width = scrollPercent + "%";
}

</script>
<!-- ProgressBar Functionality Ends-->
<script>
AOS.init();
let headerVisible = false;
document.getElementById("menu").addEventListener("click", function () {

if (headerVisible === false) {
document.getElementById("header").style.height = "280px";
headerVisible = true;
}
else {
document.getElementById("header").style.height = "50px";
headerVisible = false;
}

})
</script>
<script>
gsap.from("#header", {
duration: 1.5,
y: -100,
opacity: 0,
ease: "power4.out",
stagger: 1,
});

gsap.from(".nav-link", {
duration: 1,
opacity: 0,
y: 20,
delay: 0.5,
stagger: 0.2,
ease: "power3.out"
});

gsap.from("h1", {
duration: 1,
opacity: 0,
y: 50,
delay: 0.7,
stagger: 0.2,
ease: "power3.out"
});

gsap.from("p", {
duration: 1.5,
opacity: 0,
y: 30,
delay: 0.9,
stagger: 0.3,
ease: "power2.out"
});

gsap.from(".btn", {
duration: 1,
scale: 0.8,
opacity: 0,
delay: 1.2,
ease: "back.out(1.7)",
stagger: 0.2
});

gsap.from("img", {
duration: 1.5,
opacity: 0,
scale: 0.9,
delay: 1.5,
stagger: 0.3,
ease: "elastic.out(1, 0.3)"
});

gsap.from(".overlay", {
duration: 1,
opacity: 0,
y: 50,
delay: 1.7,
stagger: 0.3,
ease: "power3.out"
});

gsap.from(".footer-section", {
scrollTrigger: ".footer",
duration: 1.5,
opacity: 0,
y: 50,
ease: "power2.out",
stagger: 0.3,
});


gsap.from(".socials i", {
scrollTrigger: ".footer",
duration: 1,
opacity: 0,
scale: 0.5,
ease: "bounce.out",
stagger: 0.2,
delay: 0.5
});
</script>

<script>const tabs = document.querySelectorAll('.tab');
const cursor = document.getElementById('cursor');

tabs.forEach(tab => {
tab.addEventListener(' mouseenter', () => {
cursor.style.width = `${tab.offsetWidth}px`; // Set width to the current tab's width
cursor.style.left = `${tab.offsetLeft}px`; // Move cursor to the current tab's position
cursor.style.opacity = 1;
});

tab.addEventListener(' mouseleave', () => {
cursor.style.opacity = 0;
});
});

</script>
<a class=" gotopbtn" href="#"><i class="fas fa-arrow-up"></i></a>
<script src=" https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
AOS.init();

(function() {
let headerVisible = false;
document.getElementById(" menu").addEventListener("click", function () {
if (headerVisible === false) {
document.getElementById(" header").style.height = "290px";
headerVisible = true;
} else {
document.getElementById(" header").style.height = "50px";
headerVisible = false;
}
});

// Show "Go to Top" button after scrolling down
const goTopBtn = document.querySelector(" .gotopbtn");
window.addEventListener(" scroll", function () {
if (window.scrollY > 200) { // Show the button after scrolling down 200px
goTopBtn.style.display = "block";
} else {
goTopBtn.style.display = "none";
}
});

})(); // IIFE to avoid polluting global scope
</script>

<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>


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

<script>
document.getElementById('feedbackForm').addEventListener('submit', function (e) {
e.preventDefault();
Expand All @@ -265,7 +490,7 @@ <h1>Subscribe to Newsletter</h1>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<script>window.gtranslateSettings = {"default_language":"en","detect_browser_language":true,"wrapper_selector":".gtranslate_wrapper"}</script>
<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>

</body>
Expand Down
1 change: 1 addition & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -601,6 +601,7 @@ <h1>Quick Links</h1>
<li><a href="return-policy.html">Return Policy</a></li>
<li><a href="https://github.com/Tejashri-Taral/TrendTrove-Ecommerce" target="_blank">Star Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
<li><a href="feedback.html">Feedback</a></li>

</ul>
</div>
Expand Down

0 comments on commit 16b6aab

Please sign in to comment.