Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Most Popular Users Leaderboard</title> | |
| <link rel="stylesheet" href="styles.css"> | |
| </head> | |
| <body> | |
| <header> | |
| <h1>Most Popular Users Leaderboard</h1> | |
| <p>Discover the top influencers in our community</p> | |
| </header> | |
| <main> | |
| <div class="tabs"> | |
| <input type="radio" name="tabs" id="tab1" checked> | |
| <label for="tab1">Tab 1</label> | |
| <input type="radio" name="tabs" id="tab2"> | |
| <label for="tab2">Tab 2</label> | |
| <input type="radio" name="tabs" id="tab3"> | |
| <label for="tab3">Tab 3</label> | |
| </div> | |
| <section class="tab-content active"> | |
| <h2>Leaderboard</h2> | |
| <ul> | |
| <li> | |
| <div> | |
| <img src="https://via.placeholder.com/50x50" alt="User avatar"> | |
| <div> | |
| <h3>John Doe</h3> | |
| <p> | |
| <a href="#">johndoe.com</a> | |
| <span class="mx-2">|</span> | |
| <a href="#">@johndoe</a> | |
| <span class="mx-2">|</span> | |
| <a href="#">johndoe/github</a> | |
| </p> | |
| </div> | |
| </div> | |
| </li> | |
| <!-- Add more user entries for Tab 1 here --> | |
| </ul> | |
| </section> | |
| <section class="tab-content"> | |
| <h2>Leaderboard</h2> | |
| <ul> | |
| <li> | |
| <div> | |
| <img src="https://via.placeholder.com/50x50" alt="User avatar"> | |
| <div> | |
| <h3>Jane Smith</h3> | |
| <p> | |
| <a href="#">janesmith.com</a> | |
| <span class="mx-2">|</span> | |
| <a href="#">@janesmith</a> | |
| <span class="mx-2">|</span> | |
| <a href="#">janesmith/github</a> | |
| </p> | |
| </div> | |
| </div> | |
| </li> | |
| <!-- Add more user entries for Tab 2 here --> | |
| </ul> | |
| </section> | |
| <section class="tab-content"> | |
| <h2>Leaderboard</h2> | |
| <ul> | |
| <li> | |
| <div> | |
| <img src="https://via.placeholder.com/50x50" alt="User avatar"> | |
| <div> | |
| <h3>Bob Johnson</h3> | |
| <p> | |
| <a href="#">bobjohnson.com</a> | |
| <span class="mx-2">|</span> | |
| <a href="#">@bobjohnson</a> | |
| <span class="mx-2">|</span> | |
| <a href="#">bobjohnson/github</a> | |
| </p> | |
| </div> | |
| </div> | |
| </li> | |
| <!-- Add more user entries for Tab 3 here --> | |
| </ul> | |
| </section> | |
| <section class="notes"> | |
| <h2>Notes</h2> | |
| <p>This is a placeholder for your notes section.</p> | |
| </section> | |
| </main> | |
| <script src="scripts.js"></script> | |
| </body> | |
| </html> |