[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> Уровень доступа: C </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/7/657753.png"></center>
League of Legends | Kayn<br>
Пол: Мужской<br>
Дата рождения: 30.07.2096<br>
Возраст: 29 <br>
Рост и вес: 178 см/90 кг<br>
<br>
Семейное положение: Встречается с кем-то, но скрывает это.<br>
Должность/Статус: Куратор 3-го курса.<br>
Ник в чате академии: thecoolinvisible<br>
<br>
Отличительные признаки
<br>
Цвет глаз: Правый глаз зелёный, левый беловатый с красным белком из-за способности.<br>
Цвет волос: Малиновый.<br>
Татуировки/Шрамы/Пирсинг/Пигментация: Вокруг левого глаза кожа чуть более красного оттенка, ярче выражается при применении способности. В ушах по три серьги: пара чёрных гвоздиков и две пары колец в хрящах.<br>
</div>
<div class="body-left-2"><br>
Парень с развитой мускулатурой, волосами, окрашенными в малиновый цвет волосами и разного цвета глазами, зелёный правый и белый с красным белком левый. Старается поддерживать образ крутого парня, поэтому стрижётся и одевается соответственно. Вокруг левого глаза цвет кожи немного краснее, чем в целом, из-за приобретённого на Амазонке лёгкого загара этого почти не видно, однако этот загар слезает довольно быстро. Иногда носит повязку на левом глазу, так как он чувствителен к яркому свету, и Каин считает, что это в принципе круто. Предпочитает одежду чёрного цвета с яркими неоновыми вставками.
</div>
<div class="body-left-3">
► Обнаружение жизни<br><br>
Применение: Активная способность, применяется на область радиусом до 30 м в пасмурную погоду и ночью и до 15 м в шторм или яркий солнечный день. <br><br>
Описание способности: Способность, при помощи которой можно выявить живых существ рядом. При этом обладатель видит живой организм, как скопление огоньков. При должном развитии способности обладатель может различать количество объектов, находящихся в одной группе.<br>
Каин пошёл дальше. Он сумел добиться возможности различать не только животных, но и определять их внешний вид вплоть до наличия на существе шерсти или дополнительных конечностей.<br><br>
Ограничения: Для активации требуется расфокусировать взгляд и резко сфокусировать назад (можно просто зажмуриться и быстро открыть глаза), при этом способность отключается, если проделать это снова. По времени так же есть ограничение - Каин смог держать активным этот вид зрения максимум 34 минуты, после чего глаза начинает сильно жечь. После отключения способность выводит глаза Каина из строя, и он на время слепнет. В детстве слеп на оба глаза и минимум часа на два-три. Сейчас слепнет только левый глаз на примерно полчаса и правый плохо видит чуть поменьше времени.
</div>
<div class="body-left-4">
► Невидимость <br><br>
Применение: Активная способность, при помощи которой Каин в основном выбивает себе часик на “посидеть в одиночестве”.<br><br>
Описание способности: Способность полностью скрывать тело от окружающих. <br><br>
Ограничения: Применяется при стрессе или вымотанности. Длительность не больше 70 минут, после отключения какое-то время ощущается слабость в теле.
</div>
<div class="body-left-5">
Поначалу Каин может показаться позёром и пассивно-агрессивной личностью, что в принципе не сильно далеко от правды, если ему надоедать, злить или выводить на эмоции, однако в большинстве случаев принимает сторону мирного урегулирования конфликтов. Он любит производить впечатление на окружающих, лучше конечно положительное, нежели отрицательное. За друзей Каин горой, им он доверяет и считает своей семьёй. Но социальная батарейка не такая большая, как хотелось бы, поэтому иногда ему нужен часик в день наедине с собой в тишине, иначе Каин начинает злиться и становиться дёрганным.
</div>
<div class="body-left-6">
Родился в Атланте, в обычной семье, ничего необычного. Отец офисный клерк, мать медсестра, брат старше на два года. Смешно, но его звали Авель. Вышло в жизни Каина всё совсем не как в библейском сюжете. Братья не особо ладили, потому что старший младшего задирал. Авель думал, что с рождением младшего брата родители совсем про него забыли, а потому, когда во время очередной ссоры у Каина на глазах брата изменился глаз, Авель испугался, что теперь младший брат станет ещё более особенным для отца и матери. И старший, пока родители тем же днём обсуждали, как спрятать младшего, просто пошёл и сдал его. Мелкого забрали следующим же вечером. Больше Каин их не видел.<br>
Он был мягким ребёнком для своих шести лет, когда попал в интернат. Поэтому местные задиры избрали его своей мишенью. Вот только частые потасовки с братом помогли Каину отстаивать себя и свои интересы. В какой-то момент он стал сам нападать первый. Тут-то и появился на горизонте его будущий лучший друг Тони. И началом их знакомства была банально драка. Однако враждовали они не долго, всё решилось буквально за пару месяцев, и первым руку протянул, как ни странно, Тони, который вдруг уверился, что сосед по комнате не так уж и плох. Их с Каином крепкая дружба началась с одной конфеты, которую Каин получил вместе с неловкими извинениями. Не смотря на доверительные отношения, Энтони оказался очень активным пареньком, даже чересчур. К 14-ти годам Тони в жизни Каина стало так много, что он желал только одного - немного личного пространства. Видимо, судьба его пожалела и выдала невидимость.<br>
Вместе с Энтони они сумели поступить в одну и ту же академию. Там же они сумели сойтись характерами с ещё двумя студентами и даже преподавателем, который сопровождал их на небольшие миссии. Так появилась их небольшая, но дружная команда, их маленькая семья. Вместе они пережили нападение приспешников Апостола на неё. Каин выжил, хоть и был ранен при отступлении в силу того, что его прикрывали во время временной слепоты. Их вместе с командой сумели эвакуировать, но по по пути состояние Тони ухудшилось, и он впал в кому. Было решено оставить его в медкорпусе академии по прилёту, к тому же и Каину пришлось прилечь на больничную койку - к ранениям добавились проблемы с психикой. После этого пять лет Каин не отходил от Тони далеко, даже ругался с врачами, которые пытались не пускать его к лучшему другу. Так как их всей группой перевели в единственную оставшуюся академию, другие члены команды поддерживали друг друга, как могли и чем могли. С их помощью Каин смог взять себя в руки и налечь на учёбу основательно, хотя раньше это было для немного немного проблематично. Чтобы быть поближе к Тони, вся команда решила остаться работать в академии. Поэтому Каин стал куратором.
<br><br>
Секретная информация:<br>
Каин никому не говорит о родителях и брате, предпочитая рассказывать, что он сирота. Также Каин не раскрывает личности того, кто успел запасть ему в сердце, боясь, что снова потеряет кого-то из тех, кого теперь считает своей семьёй.<br><br>
</div>
</div>
[/html]
Отредактировано Kayn Wright (2024-01-08 18:45:34)
