[html]<!-- Стиль для вкладок в постах (done by Kolobdur) -->
<style>
.tablet {
background-image: url(https://forumupload.ru/uploads/001b/ce/b4/4/104993.png);
width: 700px;
height: 920px;
margin-left: 20px;
}
/* Строка имени */
.stim {
width: 578px;
border: 1px;
border-color: #000;
background-color: #959D9F;
font-family: Oswald;
text-align: center;
position: absolute;
margin-top: 40px;
margin-left: 55px;
text-transform: uppercase;
}
.tabbed > input {
display: none;
}
.tabbed > label {
width: 100px;
margin-top: 110px;
margin-left: 43px;
margin-bottom: -90px;
display: block;
padding-top: 10px;
padding-left: 5px;
padding-right: 5px;
font-family: Oswald;
text-size: 20px;
text-transform: uppercase;
}
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end) {cursor: pointer;z-index: 1;}
/* Оформление */
/* Оформление неактивного переключателя */
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end) {
background: transparent;
color: #191970;
height: 30px;
}
/* Оформление активного переключателя и при наведении */
.tabbed > label:not(.nav-top-start):not(.nav-top-end):not(.nav-bottom-start):not(.nav-bottom-end):hover,
.tabbed > input:checked + label {
background: #A02223 !important;
color: azure !important;
}
/* Оформление поля с контентом */
.tabs-body {
background: transparent;
color: #000;
}
/* Даем имена переключателям и полю с контентом */
/* Имя поля с контентом */
.tabs-body {grid-area: tabs-body;}
/* Имена переключателей слева */
#nav-left-1 {grid-area: nav-left-1;}
#nav-left-2 {grid-area: nav-left-2;}
#nav-left-3 {grid-area: nav-left-3;}
#nav-left-4 {grid-area: nav-left-4;}
#nav-left-5 {grid-area: nav-left-5;}
#nav-left-6 {grid-area: nav-left-6;}
#nav-left-7 {grid-area: nav-left-7;}
#nav-left-8 {grid-area: nav-left-8;}
#nav-left-9 {grid-area: nav-left-9;}
#nav-left-10 {grid-area: nav-left-10;}
.tabs-body {
width: auto;
position: relative;
}
.tabs-body > div {
position: absolute;
top: 0;
left: 0;
line-height: 1.4em;
opacity: 0;
width: auto;
height: 726px;
padding: 10px;
z-index: 0;
margin-top: 110px;
margin-right: 55px;
text-align: justify;
overflow: auto;
}
/* Переключатели */
/* Слева */
#nav-left-1:checked ~ .tabs-body > .body-left-1,
#nav-left-2:checked ~ .tabs-body > .body-left-2,
#nav-left-3:checked ~ .tabs-body > .body-left-3,
#nav-left-4:checked ~ .tabs-body > .body-left-4,
#nav-left-5:checked ~ .tabs-body > .body-left-5,
#nav-left-6:checked ~ .tabs-body > .body-left-6,
#nav-left-7:checked ~ .tabs-body > .body-left-7,
#nav-left-8:checked ~ .tabs-body > .body-left-8,
#nav-left-9:checked ~ .tabs-body > .body-left-9,
#nav-left-10:checked ~ .tabs-body > .body-left-10,
/* Справа */
#nav-right-1:checked ~ .tabs-body > .body-right-1,
#nav-right-2:checked ~ .tabs-body > .body-right-2,
#nav-right-3:checked ~ .tabs-body > .body-right-3,
#nav-right-4:checked ~ .tabs-body > .body-right-4,
#nav-right-5:checked ~ .tabs-body > .body-right-5,
#nav-right-6:checked ~ .tabs-body > .body-right-6,
#nav-right-7:checked ~ .tabs-body > .body-right-7,
#nav-right-8:checked ~ .tabs-body > .body-right-8,
#nav-right-9:checked ~ .tabs-body > .body-right-9,
#nav-right-10:checked ~ .tabs-body > .body-right-10 {
transform: translateY(0px);
transform: translateX(0%);
opacity: 1;
z-index: 1;
}
input[id^=nav] ~ .tabs-body > div[class^=body] {
}
</style>
<!-- В пост. Только слева. (done by Kolobdur) -->
<style>
.tabbed {
display: grid;
grid-template: /* навигация слева и поле */
"nav-left-1 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-2 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-3 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-4 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-5 tabs-body tabs-body tabs-body tabs-body" 1fr
"nav-left-6 tabs-body tabs-body tabs-body tabs-body" 1fr
/* Коллонки */
/ 1fr 1fr 1fr 1fr 1fr;
width: 100%;
}
</style>
<div class="tablet">
<div class="stim"><td>Меррил Кроуфорд <br> Уровень доступа: С </div>
<div class="tabbed">
<!-- Навигация слева -->
<!-- Слева 1 -->
<input type="radio" name="tabs-body" id="nav-left-1" checked>
<label for="nav-left-1">Личные данные</label>
<!-- Слева 2 -->
<input type="radio" name="tabs-body" id="nav-left-2">
<label for="nav-left-2">Внешность</label>
<!-- Слева 3 -->
<input type="radio" name="tabs-body" id="nav-left-3">
<label for="nav-left-3">Способность 1</label>
<!-- Слева 4 -->
<input type="radio" name="tabs-body" id="nav-left-4">
<label for="nav-left-4">Способность 2</label>
<!-- Слева 5 -->
<input type="radio" name="tabs-body" id="nav-left-5">
<label for="nav-left-5">Характер</label>
<!-- Слева 6 -->
<input type="radio" name="tabs-body" id="nav-left-6">
<label for="nav-left-6">Биография</label>
<div class="tabs-body">
<!-- Контент вкладок слева -->
<div class="body-left-1">
<center><img src="https://forumupload.ru/uploads/001b/fb/3e/105/463597.jpg"></center>
Арт<br>
Пол: Мужской<br>
Дата рождения: 06.04.2093<br>
Возраст: 30 лет<br>
Рост и вес: 180, 80<br>
<br>
Семейное положение: холост<br>
Должность/Статус: Комендант общежития<br>
Ник в чате академии: Crow<br>
<br>
Отличительные признаки
<br>
Цвет глаз: Серо-голубой<br>
Цвет волос: Белый<br>
Татуировки/Шрамы/Пирсинг/Пигментация: Несколько шрамов: после ранения продолговатый шрам на спине; после ожога и перелома на ключице; на правом плече после сведенной татуировки. Пирсинга не имеет.
<br>
</div>
<div class="body-left-2"><br>
Среднее телосложение, скорее суховатое. Средний рост, светлые глаза и длинные волосы. Одевается согласно обстановке. Не любитель ярких и броских образов, если того не требует поставленная задача. Предпочитает деловой или казуальный стиль. Считает берцы самой удобной обувью.
</div>
<div class="body-left-3">
► Страх<br><br>
Применение: Активная. Применяется на других. За один контакт только на одного противника за раз. Не дальше 10 м.<br><br>
Ограничения: <br>
Успех и длительность внушения зависят от расстояния и концентрации. Если атака имела успех, на потерпевшем эффект длится дольше. А у персонажа следующий день пройдет в состоянии, схожем с тяжелым похмельем.<br><br>
Описание способности: Способность по внушению безотчетного панического страха направленного действия при зрительном контакте с оппонентом. Никаких ассоциаций или мыслей, только приступ безотчетного страха и паники. Действие распространяется только на людей-мутантов-самоосознанных существ. Животные и различного пошиба твари мимо.
</div>
<div class="body-left-4">
► Сила, ловкость, выносливость. <br><br>
Применение: Пассивная способность, применяется на себя.<br><br>
Ограничения: <br>
Активируется непроизвольно при повышении адреналина, ощущении опасности, возникновении прямой конфронтации. Максимальная продолжительность эксплуатации повышенных ресурсов - 2-е суток к ряду. После организм отключается. Нуждается в долгом мертвом сне.<br><br>
Описание способности: Повышение физических характеристик: сила, ловкость, выносливость. Владельцем используется небольшими регулярными периодами, чтобы не впасть в спячку, но и поддерживать привычку быстрой активации. Если не имеет практического применения в полевых условиях, то отыгрывается в спортзале.
</div>
<div class="body-left-5">
Дисциплинирован, рассудителен. Внешне спокоен, даже флегматичен. Сохраняет дистанцию и соблюдает субординацию. Не мстителен и крайне редко бывает агрессивен. С окружающими общается вежливо, доброжелателен. В меру своего опыта подозрителен.
</div>
<div class="body-left-6">
Родился в семье научного сотрудника и инструктора по стрельбе. Детство прошло без особых потрясений, даже наоборот. Порядок и дисциплина всюду следовали за малым. Конечно, в момент взросления в нем периодически просыпались приступы малолетнего бунтарства, возникали попытки мелкого хулиганства. Тем не менее, родители довольно быстро возвращали себе контроль. Важным моментом являлось привитое сыну чувство справедливости, желание быть полезным, состояться как достойный член общества. По примеру предков, естественно.<br>
Обнаружение способностей, безусловно, внесло определенную смуту в устоявшемся порядке в семье. Однако, отец не видел в этом настолько значительной проблемы при условии соблюдения мер предосторожности. Конечно, до 18-ти о способностях не сообщалось. Зато для родителей явился неожиданностью выбор сыном жизненного пути. Он по собственной инициативе поступил на боевую подготовку в Академию. Обучение проходило, как и у многих, со своими успехами и провалами, конфликтами и влюбленностями, но недостаточно долговечными для продолжения по окончании учебы.
И этого ему было все еще мало, чтобы растерять юношеский энтузиазм. Все изменилось в ходе прохождения службы в штурмовой группе. Там парнише пришлось столкнуться с такими проявлениями, как противников, так и командующих, вследствие которых розовые очки разбились стеклами внутрь. Боль, страх, потери - прекрасные учителя, но берут за свои уроки очень дорого, как говорится.<br>
После получения нескольких тяжелых ранений, вышел в отставку. Не мог оставаться без дела, которое занимало бы все его внимание и время. В конце концов обратился в Академию на должность коменданта студенческого общежития.<br><br>
Секретная информация:
</div>
</div>
</div>
[/html]
Отредактировано Merril Crawford (2023-11-26 14:46:34)
