diff --git a/CodeWithHarry-Repo b/CodeWithHarry-Repo new file mode 160000 index 0000000..ebf3609 --- /dev/null +++ b/CodeWithHarry-Repo @@ -0,0 +1 @@ +Subproject commit ebf3609e93540a8e981f4de9e287450afd5531fb diff --git a/Harshita/index.html b/Harshita/index.html new file mode 100644 index 0000000..f19208b --- /dev/null +++ b/Harshita/index.html @@ -0,0 +1,45 @@ + + + + + + + College Hackathons + + + + +
+

HackEve

+
+ + +
+
+

Unleash Your Potential – Explore, Innovate, Connect!

+
▶
+
+ +
☰
+ + + + + + + + \ No newline at end of file diff --git a/Harshita/script.js b/Harshita/script.js new file mode 100644 index 0000000..63a6bd4 --- /dev/null +++ b/Harshita/script.js @@ -0,0 +1,46 @@ +document.getElementById("searchBtn").addEventListener("click", function () { + let query = document.getElementById("search").value; + alert("Searching for: " + query); +}); + +function togglePopup() { + let popup = document.getElementById("popup"); + popup.style.display = (popup.style.display === "block") ? "none" : "block"; +} + +document.addEventListener("click", function (event) { + let popup = document.getElementById("popup"); + let icon = document.querySelector(".popup-icon"); + + if (!popup.contains(event.target) && !icon.contains(event.target)) { + popup.style.display = "none"; + } +}); + +const images = ["sc1.png", "sc2.png", "sc3.png"]; +const quotes = [ + "Unleash Your Potential – Explore, Innovate, Connect!", + "Hack, Build, and Create the Future!", + "Join, Collaborate, and Succeed in Every Event!" +]; + +let index = 0; + +function nextSlide() { + index = (index + 1) % images.length; + + let landingDiv = document.querySelector(".landing"); + landingDiv.style.transform = "translateX(-100%)"; + + setTimeout(() => { + document.getElementById("sc1").src = images[index]; + document.getElementById("quote-text").innerText = quotes[index]; + landingDiv.style.transition = "none"; + landingDiv.style.transform = "translateX(100%)"; + + setTimeout(() => { + landingDiv.style.transition = "transform 0.8s ease-in-out"; + landingDiv.style.transform = "translateX(0)"; + }, 50); + }, 800); +} diff --git a/Harshita/style.css b/Harshita/style.css new file mode 100644 index 0000000..a302d67 --- /dev/null +++ b/Harshita/style.css @@ -0,0 +1,179 @@ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + text-align: center; + background-color: #f4f4f4; +} + +header { + background-color: #333; + color: white; + height: 60px; + /* padding: 10px; */ + padding-top: 10px; + font-size: 20px; +} +h1{ + margin-top: 10px; +} + +.hero { + margin-top: 50px; +} + +h2 { + font-size: 28px; + margin-bottom: 20px; +} + +input { + padding: 10px; + width: 250px; + margin-right: 10px; + border: 1px solid #ccc; + border-radius: 5px; +} + +button { + padding: 10px 20px; + background-color: #007bff; + color: white; + border: none; + border-radius: 5px; + cursor: pointer; +} + +button:hover { + background-color: #0056b3; +} + +footer { + background-color: #333; + color: white; + padding: 10px; + position: absolute; + width: 100%; + bottom: 0; +} + +.popup-icon { + position: fixed; + bottom: 80px; + right: 20px; + font-size: 30px; + cursor: pointer; + background: #007bff; + color: white; + padding: 10px; + border-radius: 50%; +} + +.popup-menu { + display: none; + position: fixed; + bottom: 80px; + right: 80px; + background: white; + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); + border-radius: 5px; + padding: 10px; + width: 150px; +} + +.popup-menu ul { + list-style: none; + padding: 0; + margin: 0; +} + +.popup-menu ul li { + padding: 10px; + border-bottom: 1px solid #ddd; +} + +.popup-menu ul li:last-child { + border-bottom: none; +} + +.popup-menu ul li a { + text-decoration: none; + color: black; + display: block; +} + +.popup-menu ul li a:hover { + background: #007bff; + color: white; + border-radius: 5px; +} + +.landing{ + background-color: #eaede6; + height: 350px; + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + padding: 15px; +} +#sc1{ + margin-right: 700px; + margin-top: 20px; + height: 350px; + width: 60%; +} + +.quote { + flex: 1; + text-align: right; + font-family: 'Times New Roman', Times, serif; + color: #4f3939; + animation: slideIn 1.5s ease-in-out forwards; + padding-right: 300px; + font-size: larger; +} + + +@keyframes slideIn { + from { + opacity: 0; + transform: translateX(-100px); + } + + to { + opacity: 1; + transform: translateX(0); + } +} + +.forward-icon { + font-size: 24px; + cursor: pointer; + color: #007bff; + padding: 10px; + position: absolute; + right: 20px; + top: 50%; + transform: translateY(-50%); +} + +.forward-icon:hover { + color: #0056b3; +} + +.landing { + display: flex; + align-items: center; + justify-content: space-between; + padding: 20px; + position: relative; + overflow: hidden; + width: 100%; +} + +.slide-container { + display: flex; + transition: transform 0.8s ease-in-out; + width: 100%; +}