G-Loot DS — brawl info #3 structure

by Augustin Hiebel

HTML

<div class="flex-1 surface accordion rounded-lg">
  <div class="accordion-item">
    <div class="accordion-header">
      <div class="item">
        <div class="item-image">
          <figure class="avatar avatar-xs avatar-simple">
            <div><span class="icon icon-reading"></span></div>
          </figure>
        </div>
        <div class="item-body">
          <div class="p-2 item-title font-headings text-lg italic">Brawl details / how to play</div>
        </div>
        <div class="item-actions">
          <div><span class="icon icon-24 icon-arrow-sm-down"></span></div>
        </div>
      </div>
    </div>
    <div class="accordion-collapse" style="height: 0px;">
      <div>
        <div class="">
          <ul class="gap-2 p-2 grid grid-cols-3 grid-rows-2">
            <li class="p-3 rounded bg-gradient-to-b from-ui-800 to-ui-700/25">
              <h4 class="font-headings text-base uppercase text-ui-200 mb-1">Objective</h4>
              <p class="text-sm text-ui-300 leading-relaxed">Your score is based on your kills and assists. Kills provide twice as many points as assists towards your match score</p>
            </li>
            <li class="p-3 rounded bg-gradient-to-b from-ui-800 to-ui-700/25">
              <h4 class="font-headings text-base uppercase text-ui-200 mb-1">Game mode</h4>
              <p class="text-sm text-ui-300 leading-relaxed">Competitive 2v2 &amp; 3v3 (Ranked only).</p>
            </li>
            <li class="p-3 rounded bg-gradient-to-b from-ui-800 to-ui-700/25">
              <h4 class="font-headings text-base uppercase text-ui-200 mb-1">Brawl points</h4>
              <p class="text-sm text-ui-300 leading-relaxed">
                Your total Brawl points are based on your combined [number] best Solo matches. Clan Brawl points are based on your Clan’s players with the highest Brawl points from their matches.
              </p>
            </li>
            <li class="p-3 rounded bg-gradient-to-b from-ui-800 to-ui-700/25">
...