-
Notifications
You must be signed in to change notification settings - Fork 374
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Key Features: • Responsive Design: The meta viewport ensures the site looks good on all devices. • Events Grid: Each event is presented in a card layout with an image, title, date, and location. • Lazy Loading: Images use loading="lazy" to improve performance by only loading when the user scrolls near them. • Navigation: Each event card links to more details, improving user experience.
- Loading branch information
1 parent
2cfd781
commit 084bbc9
Showing
1 changed file
with
109 additions
and
0 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,109 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Upcoming Tech Events | Skillwise</title> | ||
| <meta name="description" content="Explore upcoming tech events on Skillwise. Attend webinars, conferences, and hackathons to upgrade your tech skills and network with industry professionals."> | ||
| <link rel="stylesheet" href="./assets/css/style.css"> | ||
| <link rel="shortcut icon" href="./favicon.svg" type="image/svg+xml"> | ||
| </head> | ||
| <body> | ||
|
|
||
| <section class="section events has-bg-image"> | ||
| <div class="container"> | ||
|
|
||
| <p class="title-sm text-center section-subtitle" id="tech-events-label">Explore Events</p> | ||
|
|
||
| <h2 class="headline-md text-center section-title"> | ||
| Upcoming <span class="span has-after">Tech Events</span> | ||
| </h2> | ||
|
|
||
| <p class="text-center description"> | ||
| Stay updated with the latest in technology by attending webinars, conferences, and hackathons. Our events cover AI, cloud computing, cybersecurity, and more. Join now to enhance your tech skills and expand your professional network! | ||
| </p> | ||
|
|
||
| <ul class="grid-list"> | ||
| <li> | ||
| <div class="card event-card"> | ||
| <div class="card-icon"> | ||
| <img src="./assets/images/events/ai_conference.jpg" width="300" height="100" loading="lazy" | ||
| alt="AI Conference image"> | ||
| </div> | ||
| <div> | ||
| <h3 class="title-lg">AI Conference 2024</h3> | ||
| <p class="title-sm">Date: March 15, 2024</p> | ||
| <p class="title-sm">Location: New York, NY</p> | ||
| </div> | ||
| <a href="event-ai-conference.html" class="layer-link" aria-label="Learn more about AI Conference"></a> | ||
| </div> | ||
| </li> | ||
|
|
||
| <li> | ||
| <div class="card event-card"> | ||
| <div class="card-icon"> | ||
| <img src="./assets/images/events/cloud_summit.jpg" width="300" height="100" loading="lazy" | ||
| alt="Cloud Summit image"> | ||
| </div> | ||
| <div> | ||
| <h3 class="title-lg">Cloud Computing Summit</h3> | ||
| <p class="title-sm">Date: April 10, 2024</p> | ||
| <p class="title-sm">Location: San Francisco, CA</p> | ||
| </div> | ||
| <a href="event-cloud-summit.html" class="layer-link" aria-label="Learn more about Cloud Computing Summit"></a> | ||
| </div> | ||
| </li> | ||
|
|
||
| <li> | ||
| <div class="card event-card"> | ||
| <div class="card-icon"> | ||
| <img src="./assets/images/events/cyber_security.jpg" width="300" height="100" loading="lazy" | ||
| alt="Cybersecurity Workshop image"> | ||
| </div> | ||
| <div> | ||
| <h3 class="title-lg">Cybersecurity Workshop</h3> | ||
| <p class="title-sm">Date: May 22, 2024</p> | ||
| <p class="title-sm">Location: Virtual</p> | ||
| </div> | ||
| <a href="event-cybersecurity-workshop.html" class="layer-link" aria-label="Learn more about Cybersecurity Workshop"></a> | ||
| </div> | ||
| </li> | ||
|
|
||
| <li> | ||
| <div class="card event-card"> | ||
| <div class="card-icon"> | ||
| <img src="./assets/images/events/hackathon.jpg" width="300" height="100" loading="lazy" | ||
| alt="Hackathon image"> | ||
| </div> | ||
| <div> | ||
| <h3 class="title-lg">Global Tech Hackathon</h3> | ||
| <p class="title-sm">Date: June 30, 2024</p> | ||
| <p class="title-sm">Location: Virtual</p> | ||
| </div> | ||
| <a href="event-global-tech-hackathon.html" class="layer-link" aria-label="Learn more about Global Tech Hackathon"></a> | ||
| </div> | ||
| </li> | ||
|
|
||
| <li> | ||
| <div class="card event-card"> | ||
| <div class="card-icon"> | ||
| <img src="./assets/images/events/data_science.jpg" width="300" height="100" loading="lazy" | ||
| alt="Data Science Summit image"> | ||
| </div> | ||
| <div> | ||
| <h3 class="title-lg">Data Science Summit</h3> | ||
| <p class="title-sm">Date: July 20, 2024</p> | ||
| <p class="title-sm">Location: Chicago, IL</p> | ||
| </div> | ||
| <a href="event-data-science-summit.html" class="layer-link" aria-label="Learn more about Data Science Summit"></a> | ||
| </div> | ||
| </li> | ||
| </ul> | ||
|
|
||
| <a href="register.html" class="btn btn-primary">Register for Events</a> | ||
|
|
||
| </div> | ||
| </section> | ||
| </body> | ||
| </html> |