Challenge image
Practice

Challenge title

Organized by AIcrowd User avatar

Problem

Lorem ipsum problem statement

Categories

Participants

1.2k

Submissions

2.7k
<div class="list-item-challenge-practice">
  <div class="challenge-main">
    <a class="challenge-image" href="/">
      <img src="./../../assets/images/placeholder-challenge-1.png" alt="Challenge image"> 
    </a>

    <div class="challenge-text">
      <div class="badge-practice">
        <span class="badge-practice-dot"></span>
        Practice
      </div>

      <h3 class="challenge-title">
        <a class="challenge-link" href="/">Challenge title</a>    
      </h3>

      <div class="preview-organizer">
        <span class="preview-organizer-text">
          Organized by
        </span> 

        <span class="preview-organizer-name">
          <a class="preview-organizer-link" href="/">AIcrowd</a>
        </span>

        <a class="preview-organizer-avatar" href="/" aria-label="Organizer Name" data-balloon-pos="up">
          <img class="avatar" src="./../../assets/images/placeholder-organizer-avatar-2.png" alt="User avatar">
        </a>
      </div>
    </div>
  </div> 

  <div class="challenge-problem">
    <h4 class="challenge-title-secondary">Problem</h4>
    <span>Lorem ipsum problem statement</span>
  </div>

  <div class="challenge-categories">
    <h4 class="challenge-title-secondary">Categories</h4>
    <ul class="challenge-list">
      <li class="challenge-list-item">
        <a class="challenge-link" href="/">#category</a>
      </li>

      <li class="challenge-list-item">
        <a class="challenge-link" href="/">#another_category</a>
      </li>
    </ul>
  </div>

  <div class="challenge-participants">
    <h4 class="challenge-title-secondary">Participants</h4>
    <span>1.2k</span>
  </div>

  <div class="challenge-submissions">
    <h4 class="challenge-title-secondary">Submissions</h4>
    <span>2.7k</span>  
  </div>
</div>