https://forumstatic.ru/files/001c/ab/7e/35663.png

Внешности

  • Генерируются динамически.

  • Придержанные — в гостевой.

  • Всё указываем латиницей.

  • Для поиска press f воспользуйтесь ctrl+f.


[html]<style>
:root {
  --dynamic-font-size: 1.2rem;
}
.hehe-fclist {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  align-content: center;
  justify-content: center;
  gap: var(--size-2xs) var(--size-lg);
  width: 100%;
  min-height: 2rem;

  .fc {
    text-transform: capitalize;
  }

  .npc sup {
    font-family: var(--font-accent);
    text-transform: uppercase;
    color: var(--color-neutral-500);
  }

  &:not(:has(> .fc)):before {
    content: "";
    position: absolute;
    width: 2rem;
    height: 2rem;
    border: var(--size-2xs) solid;
    border-color: var(--color-neutral-500) transparent var(--color-neutral-500) transparent;
    border-radius: 50%; /* Make it a perfect circle */
    animation: spin 1.2s linear infinite; /* Apply the animation */
  }
}

/* 3. Define the spinning animation */
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg); /* Rotate 360 degrees */
  }
}
</style>

<div id="hehe-target" class="hehe-fclist"></div>

<script>
const generateFCList = (characters) => {
  const fcs = Object.keys(characters).map(key => ({
    name: key,
    fc: characters[key].fc,
    id: characters[key].id,
  }));
  const charTemplate = (id, name) => `<a href="/profile.php?id=${id}"target=_blank>${name}</a>`;
  const npcTemplate = (name) => `<span class="npc">${name} <sup>npc</sup></span>`

  const container = document.getElementById("hehe-target");
  fcs.sort((a, b) => a.fc.localeCompare(b.fc)).forEach(({ fc, name, id }) => {
    container.innerHTML += `<span class="fc"><strong>${fc}</strong> — ${id ? charTemplate(id, name) : npcTemplate(name)}</span>`;
  });
}

const vHash = +new Date();

const script = document.createElement('script');
script.charset = 'windows-1251';
script.src = `https://forumstatic.ru/files/001c/ab/7e/10010.js?v=${vHash}`;

script.addEventListener('load', () => {
  generateFCList(window.characters);
});

script.addEventListener('error', () => {
  console.error('Script failed to load.');
});

document.body.appendChild(script);
</script>[/html]