Contact

404.html

@@ -329,9 +329,9 @@ <h4 class="mil-404-text mil-dark mil-mb-60">Oops! Something went wrong :(</h4>
                         </div>
                     </div>
 
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="mil-arrow">
+                    <!-- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="mil-arrow">
                         <path d="M 14 5.3417969 C 13.744125 5.3417969 13.487969 5.4412187 13.292969 5.6367188 L 13.207031 5.7226562 C 12.816031 6.1136563 12.816031 6.7467188 13.207031 7.1367188 L 17.070312 11 L 4 11 C 3.448 11 3 11.448 3 12 C 3 12.552 3.448 13 4 13 L 17.070312 13 L 13.207031 16.863281 C 12.816031 17.254281 12.816031 17.887344 13.207031 18.277344 L 13.292969 18.363281 C 13.683969 18.754281 14.317031 18.754281 14.707031 18.363281 L 20.363281 12.707031 C 20.754281 12.316031 20.754281 11.682969 20.363281 11.292969 L 14.707031 5.6367188 C 14.511531 5.4412187 14.255875 5.3417969 14 5.3417969 z" />
-                    </svg>
+                    </svg> -->
 
                     <svg width="250" viewBox="0 0 300 1404" fill="none" xmlns="http://www.w3.org/2000/svg" class="mil-lines">
                         <path fill-rule="evenodd" clip-rule="evenodd" d="M1 892L1 941H299V892C299 809.71 232.29 743 150 743C67.7096 743 1 809.71 1 892ZM0 942H300V892C300 809.157 232.843 742 150 742C67.1573 742 0 809.157 0 892L0 942Z" class="mil-move" />

README.md

@@ -57,7 +57,7 @@ We welcome contributions from everyone! Whether you're fixing bugs, adding new f
 2. *Clone Your Fork*  
    Clone your forked repository to your local machine:
    bash
-   git clone https://github.com/yourusername/club-website.git
+   git clone https://github.com/yourusername/CC-Website-5.O.git
 
 
 3. *Create a New Branch*  

blog-inner.html

@@ -603,9 +603,9 @@ <h6 class="mil-muted mil-up mil-mb-30">Germany</h6>
                         </div>
                     </div>
 
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="mil-arrow">
+                    <!-- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="mil-arrow">
                         <path d="M 14 5.3417969 C 13.744125 5.3417969 13.487969 5.4412187 13.292969 5.6367188 L 13.207031 5.7226562 C 12.816031 6.1136563 12.816031 6.7467188 13.207031 7.1367188 L 17.070312 11 L 4 11 C 3.448 11 3 11.448 3 12 C 3 12.552 3.448 13 4 13 L 17.070312 13 L 13.207031 16.863281 C 12.816031 17.254281 12.816031 17.887344 13.207031 18.277344 L 13.292969 18.363281 C 13.683969 18.754281 14.317031 18.754281 14.707031 18.363281 L 20.363281 12.707031 C 20.754281 12.316031 20.754281 11.682969 20.363281 11.292969 L 14.707031 5.6367188 C 14.511531 5.4412187 14.255875 5.3417969 14 5.3417969 z" />
-                    </svg>
+                    </svg> -->
 
                     <svg width="250" viewBox="0 0 300 1404" fill="none" xmlns="http://www.w3.org/2000/svg" class="mil-lines">
                         <path fill-rule="evenodd" clip-rule="evenodd" d="M1 892L1 941H299V892C299 809.71 232.29 743 150 743C67.7096 743 1 809.71 1 892ZM0 942H300V892C300 809.157 232.843 742 150 742C67.1573 742 0 809.157 0 892L0 942Z" class="mil-move" />

contact.html

@@ -296,7 +296,7 @@ <h3 class="mil-center mil-up mil-mb-120">Let's <span class="mil-thin">Talk</span
                             <div class="row justify-content-between">
                                 <div class="col-md-4 col-lg-4 mil-mb-60">
 
-                                    <div class="mil-muted mil-logo mil-up mil-mb-30">Ashley.</div>
+                                    <div class="mil-muted mil-logo mil-up mil-mb-30">Codechef ABESEC Chapter</div>
 
                                     <p class="mil-light-soft mil-up mil-mb-30">Subscribe our newsletter:</p>
 
@@ -313,7 +313,8 @@ <h3 class="mil-center mil-up mil-mb-120">Let's <span class="mil-thin">Talk</span
 
                                             <nav class="mil-footer-menu mil-mb-60">
                                                 <ul>
-                                                    <li class="mil-up mil-active">
+                                                    <li class="mil-up ">
+                                                    <li class="mil-up ">
                                                         <a href="home-1.html">Home</a>
                                                     </li>
                                                     <li class="mil-up">
@@ -322,7 +323,8 @@ <h3 class="mil-center mil-up mil-mb-120">Let's <span class="mil-thin">Talk</span
                                                     <li class="mil-up">
                                                         <a href="services.html">Services</a>
                                                     </li>
-                                                    <li class="mil-up">
+                                                    <li class="mil-up mil-active">
+                                                    <li class="mil-up mil-active">
                                                         <a href="contact.html">Contact</a>
                                                     </li>
                                                     <li class="mil-up">
@@ -410,58 +412,68 @@ <h6 class="mil-muted mil-up mil-mb-30">Germany</h6>
     <script>
         const form = document.querySelector("form");
 
-            form.addEventListener("submit", (e) => {
-                let username = document.querySelector("#name").value;
-                let email = document.querySelector("#email").value;
-                let message = document.querySelector("#message").value;
-                let subject = document.querySelector("#subject").value;
-                let messageBody = `Name: ${username} \n Email: ${email} \n Message: ${message}`;
-                e.preventDefault();
-                if (validateInputs(username, email, message)) {
-                    sendEmail(messageBody, subject);
-                }
-            });
-            let validateInputs = (username, email, message) => {
-                if (username === "" || email === "" || message === "") {
+        form.addEventListener("submit", (e) => {
+            let username = document.querySelector("#name").value;
+            let email = document.querySelector("#email").value;
+            let message = document.querySelector("#message").value;
+            let subject = document.querySelector("#subject").value;
+            let messageBody = `Name: ${username} \n Email: ${email} \n Message: ${message}`;
+            e.preventDefault();
+            if (validateInputs(username, email, message)) {
+                sendEmail(messageBody, subject);
+            }
+        });
+        let validateInputs = (username, email, message) => {
+            if (username === "" || email === "" || message === "") {
+                Swal.fire({
+                    title: "Error!",
+                    text: "Please fill all the fields!",
+                    icon: "error",
+                });
+                return false;
+            } else if (!validateEmail(email)) {
+                Swal.fire({
+                    title: "Error!",
+                    text: "Please enter a valid email!",
+                    icon: "error",
+                });
+                return false;
+            } else {
+                return true;
+            }
+        };
+        let validateEmail = (email) => {
+            const re = /^([a-z\d\.-]+)@([a-z\d-]+)\.([a-z]{2,3})(\.[a-z]{2,3})?$/;
+            return re.test(email);
+        };
+
+        let sendEmail = (messageBody, Subject) => {
+            Email.send({
+                Host: "smtp.elasticemail.com",
+                Username: "codechef@abes.ac.in",
+                Password: "3692DEA930CB877EDD379E52B57CACF9372C",
+                To: "codechef@abes.ac.in",
+                From: "codechef@abes.ac.in",
+                Subject: Subject,
+                Body: messageBody,
+            }).then((message) => {
+                if (message === "OK") {
                     Swal.fire({
-                        title: "Error!",
-                        text: "Please fill all the fields!",
-                        icon: "error",
+                        title: "Success!",
+                        text: "Message sent succesfully!",
+                        icon: "success",
                     });
-                    return false;
-                } else if (!validateEmail(email)) {
+                    form.reset();
+                }
+                else {
                     Swal.fire({
                         title: "Error!",
-                        text: "Please enter a valid email!",
+                        text: "Something went wrong!",
                         icon: "error",
                     });
-                    return false;
-                } else {
-                    return true;
                 }
-            };
-            let validateEmail = (email) => {
-                const re = /^([a-z\d\.-]+)@([a-z\d-]+)\.([a-z]{2,3})(\.[a-z]{2,3})?$/;
-                return re.test(email);
-            };
-
-            let sendEmail = (messageBody, Subject) => {
-                Email.send({
-                    SecureToken: "539a95a0-ee77-4607-bf1b-67a1cc15a033",
-                    To: "codechef@abes.ac.in",
-                    From: "codechef@abes.ac.in",
-                    Subject: Subject,
-                    Body: messageBody,
-                }).then((message) => {
-                    if (message === "OK") {
-                        Swal.fire({
-                            title: "Success!",
-                            text: "Message sent succesfully!",
-                            icon: "success",
-                        });
-                    }
-                });
-            };
+            });
+        };
 
     </script>
     <!-- jQuery js -->

css/event_style.css

@@ -0,0 +1,176 @@
+
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap");
+
+
+/* * {
+  box-sizing: border-box;
+} */
+
+
+
+/* img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+} */
+
+
+.card__container {
+  margin-top:20px;
+  display: flex;
+  flex-direction: row;
+  justify-content:space-evenly;
+  flex-wrap:wrap;
+  gap:50px;
+  padding-bottom: 100px;
+
+}
+
+.card__article {
+  position: relative;
+  overflow: hidden;
+
+}
+
+.card__img {
+  width: 328px; 
+  height: 350px; 
+  object-fit: cover; 
+  border-radius: 1.5rem; 
+}
+/* .row{
+  display: flex;
+  flex-direction: column;
+  flex-flow: wrap;
+  gap:20px;
+} */
+
+.card__data {
+  width: 80%; 
+  max-width: 80%; 
+  background-color: white;
+  padding: 1.5rem 2rem;
+  box-shadow: 0 8px 24px hsla(0, 0%, 0%, .15);
+  border-radius: 1rem;
+  position: absolute;
+  bottom: -9rem;
+  left: 0;
+  right: 0;
+  margin-inline: auto;
+  opacity: 0;
+  transition: opacity 1s 1s;
+  box-sizing: border-box; 
+  height: auto;
+  max-height: 100%;
+}
+
+
+
+.card__description {
+  display: block;
+  font-size: 12px;
+  margin-bottom: .25rem;
+  color:rgb(0, 0, 0);
+  /* background: linear-gradient(to right, #ff7e5f, #feb47b); 
+    -webkit-background-clip: text; 
+      -webkit-text-fill-color: transparent;  */
+}
+
+.card__title {
+  font-size: var(--h2-font-size);
+  font-weight: 500;
+  color: rgb(0, 0, 0);
+  margin-bottom: .7green
+}
+
+.card__button {
+  text-decoration: none;
+  font-size: var(--small-font-size);
+  font-weight: bold;
+  color: rgb(174, 204, 21);
+}
+
+.card__button:hover {
+  text-decoration: underline;
+}
+
+.text-overlay {
+  position: absolute;
+  top: 5%; 
+  left: 0; 
+  right: 0; 
+  margin: 0 auto; 
+  color: white;
+  font-size: 24px;
+  font-weight: bold;
+  background-color: rgba(170, 170, 170, 0.454); 
+  padding: 10px;
+  border-radius: 5px;
+  max-width: 90%; 
+  text-align: left; 
+  word-wrap: break-word;
+  box-sizing: border-box; 
+}
+.text-overlay:empty {
+  background-color: transparent; 
+  padding: 0; 
+  display: none; 
+}
+
+
+
+.card__article:hover .card__data {
+  animation: show-data 1s forwards;
+  opacity: 1;
+  transition: opacity .3s;
+}
+
+.card__article:hover {
+  animation: remove-overflow 2s forwards;
+}
+
+.card__article:not(:hover) {
+  animation: show-overflow 2s forwards;
+}
+
+.card__article:not(:hover) .card__data {
+  animation: remove-data 1s forwards;
+}
+
+@keyframes show-data {
+  50% {
+    transform: translateY(-10rem);
+  }
+  100% {
+    transform: translateY(-7rem);
+  }
+}
+
+@keyframes remove-overflow {
+  to {
+    overflow: initial;
+  }
+}
+
+@keyframes remove-data {
+  0% {
+    transform: translateY(-7rem);
+  }
+  50% {
+    transform: translateY(-10rem);
+  }
+  100% {
+    transform: translateY(.5rem);
+  }
+}
+
+@keyframes show-overflow {
+  0% {
+    overflow: initial;
+    pointer-events: none;
+  }
+  50% {
+    overflow: hidden;
+  }
+}
+