Занятые внешности

[html]
<style>

/* =========================================================
BAD ATMOSPHERE — FACE CLAIM
========================================================= */

#ba_faceclaim {
display:block !important;
width:94% !important;
max-width:900px !important;
margin:28px auto !important;
padding:0 !important;

background:#f1ede5 !important;
border-top:1px solid #2b2823 !important;
border-bottom:1px solid #bdb2a5 !important;
box-shadow:0 12px 28px rgba(55,47,39,.06) !important;

color:#2b2824 !important;
font-family:Arial,Helvetica,sans-serif !important;
font-size:14px !important;
line-height:1.7 !important;

box-sizing:border-box !important;
}

#ba_faceclaim *,
#ba_faceclaim *::before,
#ba_faceclaim *::after {
box-sizing:border-box !important;
}

/* HEADER */

#ba_faceclaim .fc_header {
padding:40px 42px 34px !important;
text-align:center !important;
}

#ba_faceclaim .fc_kicker {
display:block !important;
margin:0 0 10px !important;

color:#8b8175 !important;
font-size:9px !important;
font-weight:bold !important;
line-height:15px !important;
letter-spacing:3px !important;
text-transform:uppercase !important;
}

#ba_faceclaim .fc_title {
display:block !important;

color:#282520 !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:31px !important;
font-weight:normal !important;
line-height:39px !important;
letter-spacing:2px !important;
text-transform:uppercase !important;
}

#ba_faceclaim .fc_subtitle {
display:block !important;
margin:12px 0 0 !important;

color:#8f8579 !important;
font-size:8px !important;
font-weight:bold !important;
line-height:15px !important;
letter-spacing:2.2px !important;
text-transform:uppercase !important;
}

#ba_faceclaim .fc_header_line {
display:block !important;
width:90px !important;
height:1px !important;
margin:23px auto 0 !important;

background:#988b7d !important;
}

/* INTRO */

#ba_faceclaim .fc_intro {
padding:0 42px 34px !important;
}

#ba_faceclaim .fc_lead {
display:block !important;
margin:0 0 18px !important;
padding:22px 26px !important;

background:#ddd3c6 !important;
border-top:1px solid #b7aa9b !important;
border-bottom:1px solid #b7aa9b !important;

color:#332f2a !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:15px !important;
line-height:24px !important;
text-align:center !important;
}

#ba_faceclaim p {
margin:0 0 14px !important;

color:#38342f !important;
font-size:13px !important;
line-height:22px !important;
}

#ba_faceclaim a {
color:#51483f !important;
}

#ba_faceclaim strong {
color:#26221e !important;
}

/* TOP TABS */

#ba_faceclaim .fc_tabs {
display:grid !important;
grid-template-columns:1fr 1fr !important;

border-top:1px solid #b7aa9b !important;
border-bottom:1px solid #b7aa9b !important;

background:#d8cec1 !important;
}

#ba_faceclaim .fc_tab {
display:flex !important;
align-items:center !important;
justify-content:center !important;

min-height:50px !important;

margin:0 !important;
padding:8px 12px !important;

background:transparent !important;
border:0 !important;
border-right:1px solid #b7aa9b !important;
border-radius:0 !important;

color:#6d6359 !important;

font-family:Georgia,"Times New Roman",serif !important;
font-size:16px !important;
line-height:22px !important;
text-transform:uppercase !important;

cursor:pointer !important;
}

#ba_faceclaim .fc_tab:last-child {
border-right:0 !important;
}

#ba_faceclaim .fc_tab.active {
background:#2f2c27 !important;
color:#f0ebe4 !important;
}

/* PANEL */

#ba_faceclaim .fc_panel {
display:none !important;
padding:34px 42px 38px !important;
}

#ba_faceclaim .fc_panel.active {
display:block !important;
}

/* LETTER BLOCK */

#ba_faceclaim .fc_group {
margin:0 0 25px !important;
}

#ba_faceclaim .fc_group:last-child {
margin-bottom:0 !important;
}

#ba_faceclaim .fc_group_head {
display:flex !important;
align-items:center !important;
justify-content:space-between !important;

margin:0 0 12px !important;
padding:0 0 9px !important;

border-bottom:1px solid #c6bbae !important;
}

#ba_faceclaim .fc_letters {
color:#2e2924 !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:16px !important;
line-height:22px !important;
}

#ba_faceclaim .fc_label {
color:#94897d !important;
font-size:7px !important;
font-weight:bold !important;
line-height:12px !important;
letter-spacing:1.5px !important;
text-transform:uppercase !important;
}

#ba_faceclaim .fc_item {
display:grid !important;
grid-template-columns:minmax(0,1fr) auto !important;
gap:16px !important;

padding:9px 0 !important;

border-bottom:1px solid rgba(185,172,157,.45) !important;
}

#ba_faceclaim .fc_item:last-child {
border-bottom:0 !important;
}

#ba_faceclaim .fc_face {
color:#39342f !important;
font-size:13px !important;
line-height:20px !important;
}

#ba_faceclaim .fc_character {
color:#6e645a !important;
font-size:12px !important;
line-height:20px !important;
text-align:right !important;
}

#ba_faceclaim .fc_empty {
color:#9a8f83 !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:13px !important;
font-style:italic !important;
line-height:20px !important;
}

/* ADD / CHANGE */

#ba_faceclaim .fc_add {
display:grid !important;
grid-template-columns:64px minmax(0,1fr) !important;
column-gap:24px !important;

padding:34px 42px 36px !important;

background:rgba(214,204,191,.18) !important;
border-top:1px solid #c6bbae !important;
}

#ba_faceclaim .fc_add_mark {
padding:0 18px 0 0 !important;

border-right:1px solid #b9ac9d !important;

color:#9b8e7f !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:23px !important;
line-height:31px !important;
text-align:right !important;
}

#ba_faceclaim .fc_add_title {
display:block !important;

color:#2a2722 !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:18px !important;
line-height:26px !important;
}

#ba_faceclaim .fc_add_en {
display:block !important;
margin:6px 0 18px !important;

color:#908579 !important;
font-size:8px !important;
font-weight:bold !important;
line-height:13px !important;
letter-spacing:2px !important;
text-transform:uppercase !important;
}

#ba_faceclaim .fc_note {
display:block !important;
margin:18px 0 0 !important;
padding:12px 15px !important;

background:#e4dcd1 !important;
border-left:2px solid #968675 !important;

color:#71685e !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:12px !important;
font-style:italic !important;
line-height:19px !important;
}

/* FINAL */

#ba_faceclaim .fc_final {
padding:34px 42px 36px !important;

background:#d8cec1 !important;
border-top:1px solid #aa9c8c !important;

text-align:center !important;
}

#ba_faceclaim .fc_final_line {
display:block !important;
width:100px !important;
height:1px !important;
margin:0 auto 21px !important;

background:#87796a !important;
}

#ba_faceclaim .fc_final_title {
display:block !important;

color:#2b2722 !important;
font-family:Georgia,"Times New Roman",serif !important;
font-size:17px !important;
line-height:26px !important;
letter-spacing:1px !important;
text-transform:uppercase !important;
}

#ba_faceclaim .fc_signature {
display:block !important;
margin:11px 0 0 !important;

color:#766b60 !important;
font-size:8px !important;
font-weight:bold !important;
line-height:14px !important;
letter-spacing:2px !important;
text-transform:uppercase !important;
}

/* MOBILE */

@media screen and (max-width:700px) {

#ba_faceclaim {
width:100% !important;
margin:18px auto !important;
}

#ba_faceclaim .fc_header,
#ba_faceclaim .fc_intro,
#ba_faceclaim .fc_panel,
#ba_faceclaim .fc_add,
#ba_faceclaim .fc_final {
padding-left:22px !important;
padding-right:22px !important;
}

#ba_faceclaim .fc_title {
font-size:25px !important;
line-height:32px !important;
}

#ba_faceclaim .fc_add {
display:block !important;
}

#ba_faceclaim .fc_add_mark {
margin:0 0 11px !important;
padding:0 0 8px !important;

border-right:0 !important;
border-bottom:1px solid #b9ac9d !important;

text-align:left !important;
}

#ba_faceclaim .fc_item {
grid-template-columns:1fr !important;
gap:2px !important;
}

#ba_faceclaim .fc_character {
text-align:left !important;
}

}

</style>

<span class="fc_kicker">
Bad Atmosphere / New York City
</span>

<span class="fc_title">
Занятые внешности
</span>

<span class="fc_subtitle">
Face Claim / New York City
</span>

</div>

<div class="fc_lead">
Здесь собраны внешности, уже занятые персонажами форума.
</div>

<p>
Дубли допускаются только с разрешения игрока, который занял внешность первым.
Если договорились — сообщите администрации, и мы спокойно добавим второго
персонажа в список без объявления гражданской войны.
</p>

<p>
<strong>Список сортируется по имени выбранной внешности.</strong>
</p>

</div>

<button
type="button"
class="fc_tab active"
data-fc="men"
>
Men / Мужские внешности
</button>

<button
type="button"
class="fc_tab"
data-fc="women"
>
Women / Женские внешности
</button>

</div>

<div class="fc_group_head">
<span class="fc_letters">A — C</span>
<span class="fc_label">01 / Face Claim</span>
</div>

<span class="fc_face">
Chico Lachowski
</span>

<span class="fc_character">
<a href="https://badnyc.f-rpg.me/profile.php?id=4">
Joshua Farago
</a>
</span>

</div>

<span class="fc_face">
Dan Stevens
</span>

<span class="fc_character">
<a href="https://badnyc.f-rpg.me/profile.php?id=7">
Nathan Warner
</a>
</span>

</div>

<span class="fc_face">
Hayden Christensen
</span>

<span class="fc_character">
<a href="https://badnyc.f-rpg.me/profile.php?id=2">
Cayden Thorne-Cross
</a>
</span>

</div>

</div>

<span class="fc_character">
<a href="ССЫЛКА_НА_ПРОФИЛЬ">
Jang Cheol
</a>
</span>

</div>

</div>

<span class="fc_face">
Tomohisa Yamashita
</span>

<span class="fc_character">
<a href="https://badnyc.f-rpg.me/viewtopic.php?id=29#p67">
Kato Genji
</a>
</span>

</div>

</div>

<div class="fc_group_head">
<span class="fc_letters">A — C</span>
<span class="fc_label">02 / Face Claim</span>
</div>

<span class="fc_face">
Anna Sophia Robb
</span>

<span class="fc_character">
<a href="https://badnyc.f-rpg.me/profile.php?id=10">
Daisy Bloom
</a>
</span>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div>

<span class="fc_add_title">
Как добавить или изменить внешность
</span>

<span class="fc_add_en">
Add / Change / Remove
</span>

<p>
Оставьте сообщение в этой теме, если нужно занять,
сменить или освободить внешность.
</p>

<p>
Если берёте уже занятую внешность, приложите подтверждение
согласия первого игрока.
</p>

<div class="fc_note">
Ниже находится готовый шаблон заявки.
</div>

</div>

<span class="fc_final_title">
Face Claim / New York City
</span>

<span class="fc_signature">
Same Face / Different Problems
</span>

</div>

var root = document.getElementById('ba_faceclaim');

if (!root) return;

var tabs = root.querySelectorAll('.fc_tab');
var panels = root.querySelectorAll('.fc_panel');

for (var i = 0; i < tabs.length; i++) {

tabs[i].addEventListener('click', function () {

var name = this.getAttribute('data-fc');

for (var j = 0; j < tabs.length; j++) {

tabs[j].classList.toggle(
'active',
tabs[j].getAttribute('data-fc') === name
);

}

for (var k = 0; k < panels.length; k++) {

panels[k].classList.toggle(
'active',
panels[k].getAttribute('data-fc-panel') === name
);

}

});

}

})();
</script>

[/html]

Код:

[b]Внешность:[/b] имя внешности

[b]Персонаж:[/b] [url=ССЫЛКА НА ПРОФИЛЬ]имя персонажа (на англ.)[/url]

[b]Действие:[/b] занять / сменить / освободить

Bad Atmosphere

Меню навигации

Пользовательские ссылки

Информация о пользователе

Занятые внешности

Сообщений 1 страница 1 из 1

Поделиться119 августа, 2026г. 22:24:58