[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> Уровень доступа: F </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/152/514035.png"></center>
Art<br>
Пол: мужской<br>
Дата рождения: 01.04.2104<br>
Возраст: 19<br>
Рост и вес: 180/72<br>
<br>
Семейное положение: свободен<br>
Должность/Статус: студент, инноватор, 2 курс, подрабатывает в морге<br>
Ник в чате академии: Art<br>
<br>
Отличительные признаки
<br>
Цвет глаз: хейзел<br>
Цвет волос: черный<br>
Татуировки/Шрамы/Пирсинг/Пигментация: проколото левое ухо.<br>
</div>
<div class="body-left-2"><br>
Высокий худой брюнет. Любимый цвет в одежде - черный. Неравнодушен к черепам в принтах и аксессуарах.
</div>
<div class="body-left-3">
► Тропа боли<br><br>
Применение: пассивная, применяется на себя, обширная область применения.<br><br>
Описание способности: способность ментальная, но воспринимается на уровне восприятия запахов. Распознание чужой физической боли в радиусе 1 км от себя. Успех распознавания зависит от наличия сознания у существа, а также от интенсивности боли. Выработалась как подспорье ко второй способности. Боль - значит, ранение или болезнь, что может повлечь за собой смерть и, как следствие, появление мертвого сырья. Способен выследить по этому "запаху".<br><br>
Ограничения: действует всегда, но лишает здорового обоняния практически полностью.
</div>
<div class="body-left-4">
► Некроморфизм <br><br>
Применение: активная, применяется на мертвую плоть в радиусе досягаемости.
<br> <br>
Описание способности: изменение и управление мертвой плотью, создание некроморфов различной сложности, контроль над ними.<br><br>
Ограничения: способность развивается со временем и практикой. На момент исполнения 19-и лет: время действия не более 3-х часов, радиус действия 200 м. Для активации необходимы адреналин, стресс или намеренная концентрация на доступных останках. После применения необходимо утолить острое чувство голода белком животного происхождения. Желательно в сыром виде.
</div>
<div class="body-left-5">
Успеваемость: Средняя.<br><br>
Хорош в теоретической учебе, в лабораторных условиях. Любознателен и в целом сообразителен. Мыслит аналитически, имеет слабость к сомнениям. Проявляет интерес к медицине, напрашивается на оказание содействия сотрудникам медблока. Неконфликтен и замкнут. Отзывчив и в душе достаточно доверчив, что старается не афишировать. Со стороны иногда вызывает мрачное впечатление, однако совершенно не против наладить отношения. Опасается слишком деятельных или импульсивных студентов. Суровые преподаватели боевых дисциплин повергают в тихую панику.
При любых столкновениях старается договориться, потому что боец из него как из дерьма пуля. Что и отражается на той части обучения, которую терпеть ненавидит. Любые миссии, полевые вылазки и прочая военная романтика не для него. Стрелок посредственный, физическая подготовка - "еле-еле душа в теле". При выполнении старается, но это далеко не всегда бывает на пользу.
</div>
<div class="body-left-6">
Родился в Рио в семье обычных людей среднего достатка. Помимо родителей имеется старшая сестра. Несмотря на общее детство, дети росли совершенно разными. В отличие от активной общительной девочки, которая стремилась к успехам в учебе и популярности среди сверстников, Лиам сторонился других детей, предпочитая наблюдать за играми со стороны. В школе также не особо выделялся, время от времени попадая в категорию аутсайдеров. Он был тем самым странным мальчиком, который мог найти умирающее животное, когда ничего не предвещало, который мог задать странный вопрос о самочувствии, хотя никто ничего не говорил вслух. Однако, никогда не пытался никому навредить, а потому особых опасений не вызывал.<br>
Видя разницу между детьми, родители ожидаемо сконцентрировались на поддержке и мотивации дочери. Мальца оставили, что называется, предоставленным самому себе, решив, что интровертность со временем пройдет, он перерастет это. Гораздо хуже стало во время пробуждения второй способности в одиннадцать лет. Триггером послужило недовольство матери из-за невысокой отметки в школе. Одному богу известно, откуда взялась увесистая тушка уличной крысы. Тело животного было изуродовано, но это не помешало ей довольно агрессивно атаковать испуганную женщину. Самое отвратное, что эту тварь было крайне сложно убить.<br>
Вопрос с обследованием и отправкой в интернат решился молниеносно. Так как Лиам не числился надеждой семьи Крофтов, по нему не то, чтобы сильно тосковали. Теперь его странности были проблемой Охры. Как это ни странно, ему тоже стало легче. Мальчик был окружен такими же необычными детьми. Это помогло ему в понимании себя и окружающих. Именно в интернате Крофт наконец разжился друзьями. Бывали, безусловно, и случаи с недругами, но не настолько критично, чтобы впадать в уныние.<br>
Лет в шестнадцать один из его самых близких друзей годом постарше внезапно сделал признание в совсем не тех самых дружественных чувствах, попытался поцеловать. Момент был настолько неожиданным, что парень в ступоре отшатнулся и предпочел замять инцидент. В дальнейшем он, конечно, хорошенько обдумал случившееся и понял, что у него такая перспектива отторжения не вызывает, но было уже поздно. Друг пресек любые попытки поговорить и оставил Крофта наедине со своими переживаниями, после чего вскоре и вовсе выпустился. С тех пор парень предпочитает аккуратно подходить к вопросу романтизма.<br>
А дальше Академия. Новые люди: соседи, преподаватели, сотрудники. Снова нужно было привыкать и искать пути сосуществования. За год вполне влился, оставаясь в лояльно-интровертном режиме с окружающими.
<br><br>
Секретная информация:<br>
старается скрыть в принципе все, начиная от своих эмоций до фактов из биографии, так как именно этим оперируют все, кто намерен так или иначе задеть. Прекрасно понимает, что его способности и наклонности выглядят отталкивающе для других, поэтому не вдается в детальное описание. Особенно в то, как ему нравится их использовать.<br><br>
</div>
</div>
[/html]
Отредактировано Liam Croft (2024-01-10 03:44:49)
- Подпись автора
