<div class="p-1 bg-neutral-100/80">
    <div class="p-1 text-neutral-900 uppercase font-semibold bg-neutral-200/50 rounded-sm">
        Os melhores dos eventos
    </div>
    <div class="hallfame" id="hallfame-events">
        <div class="buttons flex justify-center items-center gap-10 m-auto py-5">
            <?php $cont = 0;
            foreach ($hallfame as $title) : $cont++; ?>
                <a class="p-1 rounded-full text-white block w-24 text-center text-xs bg-neutral-600 focus:ring focus:ring-neutral-400 hover:bg-neutral-900 transition ease-in-out duration-500 " href="#" view="<?= $cont ?>"><?= $title['title'] ?></a>
            <?php endforeach; ?>
        </div>
        <div class="ranking">
            <?php $cont = 0;
            foreach ($hallfame as $rank) : $cont++;
                $active = ($cont == 1) ? 'flex' : 'hidden';
            ?>
                <div class="ranking-view flex justify-center items-center gap-8 <?= $active ?>" view="<?= $cont ?>">
                    <?php foreach ($rank['ranking'] as $tops) : ?>
                        <a href="<?= __redirect("preview/{$tops['type']}/") ?><?= $tops['type'] == 'char' ? $tops['name'] : $tops['guild'] ?>">
                            <div class="text-center p-3 bg-neutral-200/60 border-2 border-neutral-200 rounded-xs text-xs">
                                <p class="p-1 bg-neutral-600 rounded-full text-white"> <?= $tops['type'] == 'char' ? $tops['name'] : $tops['guild'] ?></p>
                                <div class="my-4">
                                    <img src="<?= $tops['type'] == 'char' ?  __avatar($tops['imagem']) : __guildmark($tops['imagem']) ?>" class="w-24 h-24 object-contain">
                                </div>
                                <p class="p-1 bg-neutral-600 rounded-full text-white"><?= $tops['score'] ?> <small>(<?= $tops['tag_name'] ?>)</small></p>
                            </div>
                        </a>
                    <?php
                    endforeach; ?>
                </div>
            <?php
            endforeach; ?>
        </div>
    </div>
</div>
<div class="space-15"></div>