[html]<!-- Стиль для вкладок в постах (done by Kolobdur) -->
<style>
.tablet {
background-image: url(http://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/58/904157.jpg"></center>
Ronan/The Raven Boys<br>
Пол: мужской<br>
Дата рождения: 13.08.03<br>
Возраст: 21 <br>
Рост и вес: 1.87<br>
<br>
Семейное положение: холост<br>
Должность/Статус: студент 4-го курса кризис менеджмента <br>
Ник в чате академии:disOrder<br>
<br>
Отличительные признаки
<br>
Цвет глаз: голубой<br>
Цвет волос: брюнет<br>
Татуировки/Шрамы/Пирсинг/Пигментация: есть несколько татуировок на плечах, спине в форме крыльев, на лобке газонокосилка (кривая работа знакомых), шрамы на лбу, брови, руках и коленях, родинки на лице и спине.
</div>
<div class="body-left-2"><br>
Сида видно издалека. Он слишком длинный, немного сутулый, с ежиком тёмных волос. Одежду носит мешковатую, любит спортивные костюмы, джинсы, удобную обувь. На пальцы напяливает кольца и перстни, на шее висит толстая цепь. Его голос тихий, уверенный, если повышает - басит и немного хрипит. Не любит разговаривать, скорее человек дела. Ладони широкие, тёплые, созданы для объятий. Размер ноги 45 растоптанный. Лицо изъедено шрамами от прыщей, последствием драк и другой подростковой дурости. Брови мохнатые привычно хмурятся. Нос длинный, прямой. Не любит щетину и мохнатые подмышки, бреется.
</div>
<div class="body-left-3">
► Сон без сновидений<br><br>
Применение: Активная способность. Применяется на других через прикосновение или словесное внушение (от 1 см до 10 метров). Действует на людей и на животных. <br><br>
Ограничения: Самое главное ограничение - это болевой порог обладателя способности. После применения силы его голову разрывает головная боль, при этом она накапливается, сливаясь в мучительные мигрени. Длительность сна зависит от усталости того, на кого направлено. На кофеиновых наркоманов может подействовать на пару минут, но их будет выворачивать от конфликтов силы и кофе. <br><br>
Описание способности: Для активации необходимо коснуться объекта, кожи или одежды - не важно, главное быть максимально близко, либо словесно приказать. Сон отключает объект от десяти минут и до нескольких часов. После применения способности болит голова и портится характер.
</div>
<div class="body-left-4">
► Слезы милосердия <br><br>
Применение: Активная способность. Применяется на себе и других. <br><br>
Ограничения: Для активации нужно пустить слезинку. Ввиду того, что способность появилась недавно, а носитель неприятного характера, самая большая проблема - заставить Сида заплакать. Лечит поверхностные раны, либо внутренние, но их нужно прикладывать местно. Его больную голову не лечит. После применения способности необходимо восполнить жидкость в теле.<br><br>
Описание способности: Лечение слезами.
</div>
<div class="body-left-5">
Успеваемость: средняя (где-то лучше, где-то хуже) <br><br>
Мрачнятина, которая смотрит на всех, как на ничтожество. Он не любит людей, ему невыносимы общительные люди, и он готов усыпить тех, кто не понимает простого слова "съебись". У Сида перманентно болит голова, поэтому он хмур и раздражителен. Единственные люди, к кому он благосклонен, кто способен избавить его от боли. Добра не забывает, обиду не прощает. В темные времена способен олицетворять зло ради зла, когда причин не нужно, чтобы харкнуть кому-то в суп в столовой. Он не боится ответки, ему невыносимо в этом мире. Подписывается на разные дела только из внутреннего желания словить кайф: от того что нарушает порядки, от приключений или от того, как сокурсника пиздят, а он смотрит. В целом, он сам себе на уме. Не назвать добрым малым, потому что из своих драных штанов выскакивает, всем доказывая обратное. "Мразота" - для него комплимент, а "мудак" - признание в любви. Чем больше желчи, тем лучше. Как любой говнюк, способен третировать мелких, не давать прохода слабым, подставлять грязно и жестоко. С возрастом стал спокойней и избирательнее. Может, пистоны старших ему как-то вправили мозги, но кто забывает старые приколы? В какие-то моменты и старая кошка - котёнок. Вот и он в любой момент способен сорваться, запинывая в угол и требуя мелочь на столовку.
</div>
<div class="body-left-6">
Сид родился в приличной обеспеченной семье. У него была и няня, и дорогие шмотки, но не было внимания родителей из-за их постоянной работы. Первый раз его сила сработала на няне. Она пела нежную песню на ночь и сказала Сиду спать, на что он ответил: "сама спи". Женщина тут же и отключилась, а через полчаса нашла Сида на кухне. Судя по крошкам, он напал на печенье, а судя по тени, он уснул под столом. С того момента началась его головная боль. Первое время никто и подумать не мог, что это не медицинская проблема. Домашний доктор осмотрел Сида вдоль и поперёк, пока не пришёл к родителям со своим вердиктом - ребёнок изменённый. Много денег тогда легко в его карман.
<br><br>
Сида прятали до четырнадцати лет, пока его мигрени от способности, не стали невыносимыми. Он лез на стену, обливался слезами и от боли засыпал. На общем собрании было решено отправить ребёнка в интернат. Так "лучше" ему, а вдвойне его родителям. Слишком уж он стал неуправляемым. Не таким его желали видеть. Не в такого Сид мечтал превратиться. Не я такой, жизнь такая, ага, держи статус "М". В интернате от него больше пользы, чем дома.
<br><br>
В 18 лет поступил в академию. Так как особых увлечений не имел, увлекся своим наставником. Хотел быть похожим на него и спасать тупых чистых людей.
<br><br>
Красную неделю пережил на своей шкуре. Его смогли спасти только после того, как он выдохся усыплять спасателей. Он был слишком напуган, прячась в подвале, чтобы вообще хоть кого-то подпускать к себе. Мертвые знакомые до сих пор приходят к нему в кошмарах. После двухмесячного возвращения домой, чтобы пролечить и голову, и нервы, Сида снова возвращают в академию, только другую, и он по прежнему ждет, что однажды его тоже разорвут в клочья только за то, что он не такой как все. <br>
<br><br>
Секретная информация: тут банально, Сид - зайка, который нуждается в бескомпромиссной любви
</div>
</div>
</div>
</div>
[/html]
Отредактировано Sid Hailey (2023-10-30 18:15:26)