-
Notifications
You must be signed in to change notification settings - Fork 106
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
6c4cb67
commit 79e66ec
Showing
11 changed files
with
492 additions
and
5 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,309 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <title>Code Social | Home</title> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
| <link rel="stylesheet" href="styles.css" type="text/css" /> | ||
| <link rel="stylesheet" href="eventstyle.css"> | ||
| <script src="script.js" defer></script> | ||
| <script type="text/javascript" src="darkmode.js" defer></script> | ||
|
|
||
| <link | ||
| href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" | ||
| rel="stylesheet" | ||
| /> | ||
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css"> | ||
| </head> | ||
|
|
||
| <body> | ||
| <nav class="navbar"> | ||
| <a href="index.html" class="flex" | ||
| ><img src="images/logo.png" class="logo" /> | ||
| <span class="website-name tracking-tight">Code Social</span></a | ||
| > | ||
|
|
||
| <!-- Hamburger Menu --> | ||
| <div class="hamburger-menu"> | ||
| <div class="toggle-button"> | ||
| <img | ||
| src="/images/hamburger.png" | ||
| alt="open" | ||
| id="hamburger-img" | ||
| /> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Navbar Links --> | ||
| <ul class="navbar-links flex" > | ||
| <li class="ml-20"> | ||
| <a href="events.html">Live Events</a> | ||
| <ul class="dropdown"> | ||
| <li> | ||
| <a href="maintenance.html">Why don't you react?</a> | ||
| </li> | ||
| </ul> | ||
| </li> | ||
| <li class="community"> | ||
| <a href="maintenance.html">Join Our Community</a> | ||
| <ul class="dropdown"> | ||
| <li><a href="maintenance.html">WhatsApp</a></li> | ||
| <li><a href="maintenance.html">Discord</a></li> | ||
| </ul> | ||
| </li> | ||
| <li> | ||
| <a href="maintenance.html">Meet Our Team</a> | ||
| </li> | ||
| <li> | ||
| <a href="maintenance.html">Join Our Team</a> | ||
| </li> | ||
| <li> | ||
| <a href="maintenance.html">Contact Us</a> | ||
| </li> | ||
| <li> | ||
| <a href="maintenance.html">Follow Us</a> | ||
| </li> | ||
| <!-- Dark Mode Toggle --> | ||
| <li> | ||
| <button id="theme-toggle" class="theme-toggle-btn"> | ||
| <img | ||
| src="images/dark-mode.png" | ||
|
|
||
| alt="theme-mode" | ||
|
|
||
| id="theme-toggle-icon" | ||
| /> | ||
| </button> | ||
| <!-- when light mode is active -> use "dark-mode.png" and when dark mode is active -> use "light-mode.png" --> | ||
| </li> | ||
| </ul> | ||
| </nav> | ||
|
|
||
| <!-- header section --> | ||
| <div class="header"> | ||
| <div class="img-parent"> | ||
| <div class="img"> | ||
| <img src="images/header.jpg" alt=""> | ||
| </div> | ||
| <div class="img-overlay"></div> | ||
| </div> | ||
| <div class="img-content"> | ||
| <h1>Live Events</h1> | ||
| <p>Join us for a groundbreaking technology Events where | ||
| innovation meets inspiration. Explore the latest Events | ||
| in React, JavaScript,Node js, Css and many more .... | ||
| </p> | ||
| <p>Network with industry leaders, attend insightful workshops, and | ||
| discover cutting-edge solutions</p> | ||
| </div> | ||
| </div> | ||
| <!-- event card section --> | ||
| <div class="container"> | ||
| <div class="item-container"> | ||
| <div class="img-container"> | ||
| <img src="images/Green.jpeg" alt="Event image"> | ||
| </div> | ||
|
|
||
| <div class="body-container"> | ||
| <div class="overlay"></div> | ||
|
|
||
| <div class="event-info"> | ||
| <p class="title">React Workshop</p> | ||
| <div class="separator"></div> | ||
| <p class="info">Webinar</p> | ||
| <p class="price">Free</p> | ||
|
|
||
| <div class="additional-info"> | ||
| <p class="info"> | ||
| <i class="fas fa-map-marker-alt"></i> | ||
| Offline meet up | ||
| </p> | ||
| <p class="info"> | ||
| <i class="far fa-calendar-alt"></i> | ||
| Sat, Sep 19, 10:00 AM EDT | ||
| </p> | ||
|
|
||
| <p class="info description"> | ||
| Learn to create interactive web applications | ||
| using React. Master components, state management, and routing. Join us to level up your web development skills. <span>more...</span> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| <button class="action">Join it</button> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="item-container"> | ||
| <div class="img-container"> | ||
| <img src="images/red.jpeg" alt="Event image"> | ||
| </div> | ||
|
|
||
| <div class="body-container"> | ||
| <div class="overlay"></div> | ||
|
|
||
| <div class="event-info"> | ||
| <p class="title">JavaScript Talk</p> | ||
| <div class="separator"></div> | ||
| <p class="info">Webinar</p> | ||
| <p class="price">Free</p> | ||
|
|
||
| <div class="additional-info"> | ||
| <p class="info"> | ||
| <i class="fas fa-map-marker-alt"></i> | ||
| Offline meet up | ||
| </p> | ||
| <p class="info"> | ||
| <i class="far fa-calendar-alt"></i> | ||
| Sat, Sep 19, 10:00 AM EDT | ||
| </p> | ||
|
|
||
| <p class="info description"> | ||
| Learn JavaScript fundamentals and advanced techniques. | ||
| Build interactive web applications with ease. | ||
| Join us to become a JavaScript pro. <span>more...</span> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| <button class="action">Join it</button> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="item-container"> | ||
| <div class="img-container"> | ||
| <img src="images/yellow.jpeg" alt="Event image"> | ||
| </div> | ||
|
|
||
| <div class="body-container"> | ||
| <div class="overlay"></div> | ||
|
|
||
| <div class="event-info"> | ||
| <p class="title">Node.js Webinar</p> | ||
| <div class="separator"></div> | ||
| <p class="info">Webinar</p> | ||
| <p class="price">Free</p> | ||
|
|
||
| <div class="additional-info"> | ||
| <p class="info"> | ||
| <i class="fas fa-map-marker-alt"></i> | ||
| Offline meet up | ||
| </p> | ||
| <p class="info"> | ||
| <i class="far fa-calendar-alt"></i> | ||
| Sat, Sep 19, 10:00 AM EDT | ||
| </p> | ||
|
|
||
| <p class="info description"> | ||
| Learn Node.js to create efficient and | ||
| scalable server-side applications. Master | ||
| asynchronous programming and real-time features. <span>more...</span> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| <button class="action">Join it</button> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="item-container"> | ||
| <div class="img-container"> | ||
| <img src="images/blue.jpeg" alt="Event image"> | ||
| </div> | ||
|
|
||
| <div class="body-container"> | ||
| <div class="overlay"></div> | ||
|
|
||
| <div class="event-info"> | ||
| <p class="title">CSS Masterclass</p> | ||
| <div class="separator"></div> | ||
| <p class="info">Webinar</p> | ||
| <p class="price">Free</p> | ||
|
|
||
| <div class="additional-info"> | ||
| <p class="info"> | ||
| <i class="fas fa-map-marker-alt"></i> | ||
| Offline meet up | ||
| </p> | ||
| <p class="info"> | ||
| <i class="far fa-calendar-alt"></i> | ||
| Sat, Sep 19, 10:00 AM EDT | ||
| </p> | ||
|
|
||
| <p class="info description"> | ||
| Learn advanced CSS techniques to create beautiful and | ||
| responsive web designs. Join us to master CSS and elevate your web projects. <span>more...</span> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| <button class="action">Join it</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| <!-- Adding footer --> | ||
| <footer class="footer-section"> | ||
| <div class="container"> | ||
| <!-- Logo and About Section --> | ||
| <div class="footer-logo-about"> | ||
| <a href="index.html" class="footer-logo-link"> | ||
| <img src="images/logo.png" alt="Code Social Logo" class="footer-logo"> | ||
| <span class="website-name">Code Social</span> | ||
| </a> | ||
| <p class="footer-about-text"> | ||
| Code Social Community is a vibrant and inclusive space for tech enthusiasts <br> to learn, grow, and | ||
| connect. Founded in 2023, our mission is to empower individuals <br> with resources, mentorship, and | ||
| opportunities to cultivate their skills, explore their interests, and <br>collaborate with | ||
| like-minded peers. | ||
| </p> | ||
| <div class="social-icons"> | ||
| <a href="https://wa.me/your-whatsapp-number" target="_blank"><img src="./images/whatsapp-icon.png" | ||
| alt="WhatsApp"></a> | ||
| <a href="https://discord.gg/MSTNyRSPYW" target="_blank"><img src="./images/discord-icon.png" | ||
| alt="Discord"></a> | ||
| <a href="https://www.linkedin.com/company/code-social/" target="_blank"><img | ||
| src="./images/linkedin-icon.png" alt="LinkedIn"></a> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Links Section --> | ||
| <div class="footer-links"> | ||
| <div class="footer-column"> | ||
| <p class="footer-title">Quick Links</p> | ||
| <ul class="footer-list"> | ||
| <li><a href="#">About Us</a></li> | ||
| <li><a href="events.html">Events</a></li> | ||
| <li><a href="#">Community Guidelines</a></li> | ||
| <li><a href="#">Careers</a></li> | ||
| </ul> | ||
| </div> | ||
| <div class="footer-column"> | ||
| <p class="footer-title">Help</p> | ||
| <ul class="footer-list"> | ||
| <li><a href="#">Contact Us</a></li> | ||
| <li><a href="#">Volunteer Opportunities</a></li> | ||
| <li><a href="#">Terms & Conditions</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Footer Bottom --> | ||
| <hr class="footer-divider"> | ||
| <p class="footer-bottom-text">© Copyright 2024, All Rights Reserved by Code Social</p> | ||
| </footer> | ||
|
|
||
| <script> | ||
| window.embeddedChatbotConfig = { | ||
| chatbotId: "j2Uy2CrJfZueGX7wNtJT_", | ||
| domain: "www.chatbase.co" | ||
| } | ||
| </script> | ||
| <script | ||
| src="https://www.chatbase.co/embed.min.js" | ||
| chatbotId="j2Uy2CrJfZueGX7wNtJT_" | ||
| domain="www.chatbase.co" | ||
| defer> | ||
| </script> | ||
| </body> | ||
|
|
||
| </html> |
Oops, something went wrong.