Комментарий #9803141

animeshnik_ALT
Часть [1/5]
подсказка для тех, кого нет на шикимори
Дисклеймер: Там где это возможно подсказка полностью дублирует оригинальную подсказку от шикимори, благодаря чему подсказка будет практически идентична оригинальной, к чему я и стремился. Я не гарантирую что данная подсказка будет работать у вас нормально. Проверено на e-design, shiki-theme и без стилей. Если вы можете что-то исправить, добавить или улучшить - пишите, добавлю, ибо мне уже впадлу.

Важно! При использовании собственных шаблонов подсказка может работать некорректно. Может у span указано display: none; может у .b-tag указано opacity: 0; может у b-link, b-image, b-poster, no-zoom. Я не знаю. В таком случае придется вручную вставлять значения по умолчанию. С этим я не могу ничего поделать.

Для начала начнем с самого лёгкого - копирования кода css.
css
Для начала вставляем код для всех, далее то, что в спойлерах. Лишнего не копируем, иначе будет каша.
если есть стрелка
Вот такая дичь: (в shiki-theme её нет)
527x326518x282
/*Если есть стрелка*/
.tooltip.my:not(.tooltip-left) {
    right: -23.58px;
}
.tooltip-left.minified.my {
  left: calc(-300px - 20px - 23.58px); /*Ширина подсказки + паддинг + стрелка*/
}
.tooltip-left.minified.with_poster.my {
  left: calc(-480px - 20px - 23.58px);
}
.tooltip-left.my .dropshadow-right {
    right: -23.58px;
    width: 23.58px;
}
.tooltip.my:not(.tooltip-left) .dropshadow-left {
    left: -23.58px;
    width: 23.58px;
}
.tooltip:not(.minified).tooltip-left.my {
  left: calc(-480px - 20px - 23.58px);
}
.tooltip.my .tooltip-left.my {
  width: 23.58px;
  height: 100%;
}
.tooltip.my .tooltip:not(.tooltip-left).my .dropshadow-left {
  width: 23.58px;
}
.tooltip.my .tooltip-left.my .dropshadow-right {
  width: 23.58px;
}
e-design
для тех, кто импортировал cosmo-library
/*Для юзеров e-design, импортировавших cosmo library*/
.about .tooltip.my .b-catalog_entry, .about .tooltip.my .b-catalog_entry:last-child {display: inherit;pointer-events: unset;padding: 5px 5px;width: auto !important;}
.about .tooltip.my .b-catalog_entry .cover {margin: unset;padding: unset;border-radius: unset;pointer-events: unset;background: unset !important;box-shadow: unset;-webkit-transition: unset;}
.about .tooltip.my .cover:hover {box-shadow: none !important;}
.tooltip.my .b-catalog_entry:hover {box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.2) !important;}
.tooltip.my article.b-catalog_entry, .tooltip.my article.b-catalog_entry:hover {box-shadow: none !important;padding: 0 !important;}
/*e-design*/
.tooltip.my .b-add_to_list .ed-options {
  border-radius: 7px;
}
.tooltip.my .b-add_to_list .ed-options .option {
  font-weight: 400;
  border-top: none;
}
.tooltip.my .b-add_to_list .ed-options .remove-trigger .text {
  color: #ffa09e;
}
.tooltip.my .b-catalog_entry-tooltip .inner a.name {
  color: rgba(var(--white-color), var(--hundred)) !important;
}
.tooltip.my .b-catalog_entry-tooltip .inner a.name:hover {
  color: rgba(var(--hover-color), var(--hundred)) !important;
}
shiki-theme
/*Для shiki-theme*/
.tooltip.my {
  top: -44px;
}
.tooltip.my:not(.tooltip-left) {
  height: 331px;
}
.tooltip-left.my:after {content: '';position: absolute;right: -319px;width: 19px;height: 331px;top: 0;}
.tooltip.my .tooltip-inner {
  overflow: visible;
}
.tooltip.my .b-add_to_list.active .trigger-arrow {
  transform: rotate(180deg);
}
.tooltip.my .b-anime_status_tag.released:after {
  content: "вышло";
}
.tooltip.my .b-anime_status_tag.ongoing:after {
  content: "выходит";
}
.tooltip.my .b-add_to_list .ed-options .option {
  position: relative;
  padding: 0 1rem;
  font-size: .875rem;
  line-height: 40px;
}
.tooltip.my .b-add_to_list.active .ed-options {
  max-height: 240px;
}
.b-add_to_list .ed-options .option::before {content: '';position: absolute;top: 0;right: 0;bottom: 0;left: 0;background: #fff;opacity: 0;pointer-events: none;}
.tooltip.my .b-add_to_list.active .ed-options .option:hover:before {
  opacity: 0.08;
}
Для юзеров --custom-image
/*Для юзеров --custom-image*/
.tooltip.my .b-catalog_entry-tooltip>.entry-tooltip_container>a:before{
  display: none;
}
.tooltip.my .b-catalog_entry-tooltip>.entry-tooltip_container>a img {
  position: unset;
}
Для всех:
/*Своя подсказка*/
@media screen and (max-width: 1023px) {
  .tooltip.my {
    display: none !important;
  }
}
.tooltip.my {
  display: none;
  top: calc(-40px - 48px);; /*Паддинг + ещё чтобы было на одном уровне*/
}
.tooltip.my .marker {
  display: none;
}
.tooltip.my:not(.tooltip-left) {
  right: -19px; /* +тень */
}
.tooltip-left.minified.my {
  left: calc(-300px - 20px - 19px); /*Ширина подсказки + паддинг + тень*/
}
.tooltip-poster {
  position: relative;
}
.tooltip-poster:hover .tooltip.my {
  display: inherit;
}
.tooltip-left.my .dropshadow-right {
    background: transparent;
    height: 100%;
    position: absolute;
    right: -19px;
    top: 0;
    width: 19px;
    z-index: -1;
}
.tooltip.my:not(.tooltip-left) .dropshadow-left {
    background: transparent;
    height: 100%;
    left: -19px;
    position: absolute;
    top: 0;
    width: 19px;
    z-index: -1;
}
.tooltip.my:not(.tooltip-left) .dropshadow-right, .tooltip-left .dropshadow-left {
  width: 0;
}
.tooltip.minified:not(.with_poster).my .tooltip-inner {
  width: 300px;
}
.tooltip.minified.with_poster.my .tooltip-inner {
  width: 480px;
}
.tooltip-left.minified.with_poster.my {
  left: calc(-480px - 20px - 19px); /*Ширина подсказки + паддинг + тень*/
}
.tooltip.minified.with_poster.my .b-catalog_entry-tooltip>.entry-tooltip_container>a img {
  width: 160px !important;
  height: 249px !important;
}
.tooltip.minified.with_poster.my .b-catalog_entry-tooltip .entry-tooltip_container .inner {
  width: 278px;
}
.tooltip.minified.my .b-image, .tooltip.minified.my .b-link, .tooltip.minified.my .b-poster, .tooltip.minified.my .no-zoom {
  all: unset !important;
}
.tooltip.my:has(.close:active) {
  display: none;
}
.tooltip.my .additional-images {
  min-width: 48px; /*Чтобы постер не был слишком мелким*/
}
.tooltip.my .b-catalog_entry-tooltip .inner .additional-images .link .title {
  text-align: center;
}
.tooltip.my a.name > span {
  font-size: 13px;
  font-weight: 700;
  line-height: 20px;
  margin-bottom: 5px;
  cursor: pointer;
}
.tooltip.my {
  cursor: default;
}
.tooltip.my img {
  cursor: pointer;
}

/*Подсказка для тайтлов*/
.tooltip.my br {
  display: none;
}
.tooltip.my .b-text_with_paragraphs br {
  display: block;
}
.tooltip.my .tooltip-poster > .tooltip.my {
  display: none;
}
.tooltip.my .tooltip-poster {
  display: inline-flex;
}
.tooltip.my .tooltip-poster:hover > .tooltip.my {
  display: inherit;
}
.tooltip.my .tooltip.my {
  top: -84px;
}
/*Стрелочка*/
.tooltip.my .b-add_to_list.active .trigger-arrow {
  transform: rotate(-90deg);
}
/*Менюшка*/
.tooltip.my .b-add_to_list .ed-options {
  max-height: 0;
  transition: max-height .3s ease;
  overflow: hidden;
}
.tooltip.my .b-add_to_list.active .ed-options {
  max-height: 200px;
}
.tooltip.my .b-add_to_list .ed-options .remove-trigger .text {
  color: #ff4136;
}
.tooltip-left.my {
  left: calc(-480px - 20px - 19px);
}
.tooltip.my .tooltip:not(.tooltip-left).my .dropshadow-left {
  width: 19px;
}
.tooltip.my .tooltip-left.my .dropshadow-right {
  width: 19px;
}
.tooltip-left.my .tooltip:not(.tooltip-left).my .tooltip-arrow {
  right: 100%;
  left: unset;
  transform: rotate(180deg);
}
.tooltip.my article.c-column {
  width: auto;
}

/*Русификация*/
.tooltip.my .b-anime_status_tag.released:before {
  content: "вышло";
}
.tooltip.my .b-anime_status_tag.ongoing:before {
  content: "выходит";
}
.tooltip.my .b-add_to_list .trigger .text .status-name[data-text="completed"]:after, .tooltip.my .b-add_to_list .option .text .status-name[data-text="completed"]:after {
  content: "Просмотрено ";
}
.tooltip.my .b-add_to_list .trigger .text .status-name[data-text="watching"]:after, .tooltip.my .b-add_to_list .option .text .status-name[data-text="watching"]:after {
  content: "Смотрю ";
}
.tooltip.my .b-add_to_list .trigger .text .status-name[data-text="dropped"]:after, .tooltip.my .b-add_to_list .option .text .status-name[data-text="dropped"]:after {
  content: "Брошено ";
}
.tooltip.my .b-add_to_list .trigger .text .status-name[data-text="on_hold"]:after, .tooltip.my .b-add_to_list .option .text .status-name[data-text="on_hold"]:after {
  content: "Отложено ";
}
.tooltip.my .b-add_to_list .trigger .text .status-name[data-text="rewatching"]:after, .tooltip.my .b-add_to_list .option .text .status-name[data-text="rewatching"]:after {
  content: "Пересматриваю ";
}
.tooltip.my .b-add_to_list .trigger .text .status-name[data-text="planned"]:after, .tooltip.my .b-add_to_list .option .text .status-name[data-text="planned"]:after {
  content: "Запланировано ";
}
.tooltip.my .b-add_to_list .option .text .status-name[data-text="remove_list"]:after {
  content: "Удалить из списка";
}
/*Фикс сэйю*/
#profiles_show .tooltip.my .b-catalog_entry .cover .title.two_lined {
  display: none;
}
.about .tooltip.my article.b-catalog_entry {
  padding: 0 !important;
}
.tooltip.my .b-text_with_paragraphs, .tooltip.my .title, .tooltip.my .key {
  cursor: text;
}
Ответы
animeshnik_ALT
animeshnik_ALT#
@animeshnik_ALT, Часть [2/5]
спойлер
Для юзеров моего импрота "Добавляем постер в подсказку"
/* Для юзеров моего импрота "Добавляем постер в подсказку" */
#profiles_show .tooltip.minified:not(.with_poster).my .tooltip-inner {
  width: 300px;
}
#profiles_show .tooltip:not(.minified).my .tooltip-inner, #profiles_show .tooltip.with_poster.my .tooltip-inner {
  width: 480px;
}
#profiles_show .tooltip.my .b-catalog_entry-tooltip .entry-tooltip_container {
  justify-content: unset;
}
#profiles_show .tooltip.my .b-catalog_entry-tooltip .entry-tooltip_container .inner {
  min-height: unset;
}
#profiles_show .tooltip:not(.with_poster).my .b-catalog_entry-tooltip .entry-tooltip_container .inner {
  width: 280px;
}
#profiles_show .tooltip.with_poster.my .b-catalog_entry-tooltip .entry-tooltip_container .inner {
  width: 278px;
}
#profiles_show .tooltip.my .b-catalog_entry-tooltip .inner {
  flex-grow: 1;
}
#profiles_show .tooltip.my .b-catalog_entry-tooltip .inner a.name:before {
  display: none;
}

Для персонажей
*Если смотрите не в моём профиле, а по ссылке, то для отображения нужно для начала скопировать себе css код с первой части*


Очень загадочная и уверенная в себе девушка. Возможно ее внешний вид и подчеркивает то что она является сестрой церкви Фавония, но ее манеры и взгляд говорят то это лишь одна сторона медали. Ее Крио способности подчеркивают ее хладнокровие, пронизывая врагов ужасающим холодом.

инструкция
[div=cc-6]
[div=tooltip-poster c-column]
[img]https://avatars.mds.yandex.net/i?id=ae882a43892043d45886a09470bb5622_l-5883245-images-thumbs&n=13[/img]
[div=tooltip minified with_poster my]
[div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=b-catalog_entry-tooltip][div=entry-tooltip_container]
[img]https://avatars.mds.yandex.net/i?id=ae882a43892043d45886a09470bb5622_l-5883245-images-thumbs&n=13[/img]
[div=inner][div=line]
[url=//ссылка-на-имя data name][span=name-ru]Розария[/span][/url][/div]
[div=additional-images][div=link]
[div=title]Игра[/div]
[div=c-column b-catalog_entry]
[url=//ссылка-на-новеллу cover user_rates-minified]
[span=image-decor][span=image-cutter]
[poster=2308856]
[/span][/span][/url][/div][/div]
[div=link]
[div=title]Сэйю[/div]
[div=c-column b-catalog_entry]
[people ids=18511, wall columns=0]
[/div][/div][/div][div=text][div=b-text_with_paragraphs]
Очень загадочная и уверенная в себе девушка. Возможно ее внешний вид и подчеркивает то что она является сестрой церкви Фавония, но ее манеры и взгляд говорят то это лишь одна сторона медали. Ее Крио способности подчеркивают ее хладнокровие, пронизывая врагов ужасающим холодом.
[/div][/div][/div][/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[/div]

Классы cc-6 и c-column добавлены лишь для того, чтобы подсказка не выходила сбоку, они необязательны если вы уже используете какой-то шаблон.

Персонажу, при наведении на которого мы хотим показать подсказку, присваиваем класс tooltip-poster.
Для подсказки слева, к [div=tooltip minified with_poster my] добавляем ещё класс tooltip-left.
Если вам не нужен постер слева, просто удалите класс with_poster и изображение между [div=entry-tooltip_container] и [div=inner].
Остальное разберетесь сами, не дураки.
спойлер
Если у вас подсказка появляется как на скрине, значит вам нужно изменить размер блока tooltip-poster до размера постера. Можете использовать колонки, как в примере выше.
1535x325
animeshnik_ALT
animeshnik_ALT#
@animeshnik_ALT, Часть [3/5]
спойлер
Для тайтлов
*Если смотрите не в моём профиле, а по ссылке, то для отображения нужно для начала скопировать себе css код с первой части*


ОПИСАНИЕ
Студия:
Жанры:
Сёнен
Сэйнэн
Машины
ОПИСАНИЕ ЖАНРА
Сёдзе
ОПИСАНИЕ ЖАНРА
9.44
рейтинг:

– 10

инструкция
[div=cc-4]
[div=tooltip-poster c-column]
[poster]https://avatars.mds.yandex.net/i?id=b5f041fddbe61db224611d636687b780_l-5179985-images-thumbs&n=13[/poster]
[div=tooltip my]
[div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=b-catalog_entry-tooltip][div=entry-tooltip_container]
[url=//ссылка-на-изображение image-link][poster=2309272][/url]
[div=inner][div=line name]
[url=//ссылка-на-тайтл data name]
[span=name-ru]Человек паук[/span]
[/url][/div][div=text][div=b-text_with_paragraphs]
ОПИСАНИЕ
[/div][/div][div=line-container][div=line]
[div=key]Тип:[/div]
[div=value]
[url=//ссылка-на-тэг b-tag]Кино[/url]
[url=//ссылка-на-тэг b-tag]2000 год[/url]
[url=//ссылка-на-тэг b-tag]PG-13[/url]
[span=b-anime_status_tag released data-text=released][/span]
[/div][/div][/div][div=line-container][div=line]
[div=key]Студия:[/div]
[div=value]
[url=//ссылка-на-тэг b-tag]Studio[/url]
[/div][/div][/div]
[div=line-container][div=line]
[div=key]Жанры:[/div]
[div=value]
[url=/animes/genre/27-Shounen b-tag bubbled-processed]
[span=genre-ru]Сёнен[/span][/url]
[url=/animes/genre/42-Seinen b-tag bubbled-processed]
[span=genre-ru]Сэйнэн[/span][/url]
[div=tooltip-poster][url=/animes/genre/3-Cars b-tag bubbled-processed]
[span=genre-ru]Машины[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
ОПИСАНИЕ ЖАНРА
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/25-Shoujo b-tag bubbled-processed]
[span=genre-ru]Сёдзе[/span][/url]
[div=tooltip tooltip-left my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
ОПИСАНИЕ ЖАНРА
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[/div][/div][/div]
[div=rating]
[span]9.44[/span]
[span=text]рейтинг:[/span]
[/div][/div][/div]
[div][div=b-user_rate][div]
[div=b-add_to_list user-defined completed expanded]
[div=trigger][div=trigger-arrow] [/div][div=edit-trigger][div=edit] [/div][div=text]
[span=status-name data-text=completed][/span]
[span]–  10[/span]
[/div][/div][/div][div=expanded-options]
[div=option add-trigger data-status=dropped]
[div=text]
[div=status-name data-text=dropped] [/div]
[/div][/div]
[div=option add-trigger data-status=on_hold]
[div=text]
[div=status-name data-text=on_hold] [/div]
[/div][/div]
[div=option add-trigger data-status=planned]
[div=text]
[div=status-name data-text=planned] [/div]
[/div][/div]
[div=option add-trigger data-status=rewatching]
[div=text]
[div=status-name data-text=rewatching] [/div]
[/div][/div]
[div=option add-trigger data-status=watching]
[div=text]
[div=status-name data-text=watching] [/div]
[/div][/div]
[div=option remove-trigger]
[div=text]
[div=status-name data-text=remove_list] [/div]
[/div][/div][/div][/div][/div][/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div][/div]
[/div]

Опять же cc-4 и c-column не обязательны.
Если не нужен постер внутри, просто удалите его, лол. Вот это > [url=//ссылка-на-изображение image-link][poster=2309272][/url]
Для подсказки слева добавляем к [div=tooltip my] класс tooltip-left. То же относится и к вложенным подсказкам.

Чтобы поменять зеленую надпись "вышло", измените класс released внутри [span=b-anime_status_tag released data-text=released][/span] data-text=released можно не менять, но не удаляйте его. Русифицированные значения: released, ongoing.

Чтобы изменить меню добавления в список изменяем completed внутри [div=b-add_to_list user-defined completed expanded], а также по желанию меняем текст внутри. Для этого изменяем значения у data-text=dropped. data-status=dropped можно не трогать.
Русифицированные значения: completed, watching, dropped, on_hold, rewatching, planned.

Также внутри подсказки можно создать ещё подсказку, я так сделал для жанров. Для этого делаем как в примере выше. Обязательно оборачиваем жанр в блок tooltip-poster.
Готовые тэги жанров с текстом будут в следующих частях.
1 жанр
[div=tooltip-poster][url=/animes/genre/27-Shounen b-tag bubbled-processed]
[span=genre-ru]Сёнен[/span][/url]
[div=tooltip tooltip-left my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Сёнен аниме и манга в основном рассчитаны на мальчиков или юношей от 12 до 18 лет. В центре повествования сильный и харизматичный персонаж, который упорно добивается поставленных целей (чаще всего труднодостижимых) в определенных сферах (например, спорт, музыка и т.д.). Герой сенена добрый, справедливый, удачливый парень, который противостоит силам зла.
Сюжет в таком аниме развивается стремительно: главному персонажу и его друзьям предстоит испытать множество интересных приключений, смешных происшествий, принять участие в трудных соревнованиях и т.д.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
animeshnik_ALT
animeshnik_ALT#
@animeshnik_ALT, Часть [4/5]
спойлер
Готовые жанры
Жанр начинается с [div=tooltip-poster] и заканчивается [/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/42-Seinen b-tag bubbled-processed]
[span=genre-ru]Сэйнэн[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Сэйнэн аниме и манга рассчитаны на мужскую аудиторию от 18 лет. Здесь, в отличие от сёнена, затрагиваются более «взрослые» темы. Главным героем чаще всего является сильный, харизматичный и умный парень, решающий серьёзные жизненные проблемы, поэтому основное внимание уделяется раскрытию характеров персонажей и их мыслям, а не активным действиям. Часто сэйнэн содержит кровавые или эротические сцены. Основная идея сэйнэна состоит в том, что жизнь жестока и непредсказуема, в ней нет четкого разделения на чёрное и белое. А жизнь человека – это всего лишь результат его мировоззрения и «приложенных усилий в пропорции к усилиям, приложенным другими».
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/3-Cars b-tag bubbled-processed]
[span=genre-ru]Машины[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Главными действующими лицами произведений данного жанра выступают, фигурально выражаясь, колёса и моторы. Основные элементы сюжета — гонки или погони на автомобилях или мототранспорте. Красной нитью через повествование может проходить рассказ о судьбе гонщика, водителя, пилота болида. Как правило, представленные транспортные средства имеют какую-либо особенность, в чём-то уникальны или демонстрируются "культовые" модели автопрома. Акцент может быть сделан и на техническом усовершенствовании машин в целях достижения более высоких результатов.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/25-Shoujo b-tag bubbled-processed]
[span=genre-ru]Сёдзе[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Сёдзё аниме и манга рассчитаны на девочек и девушек, где акцент делается на чувства и отношения между персонажами. Наибольшее внимание уделяется дружбе и любви, но могут затрагиваться и повседневные мелочи, нюансы конкретных взаимоотношений и переживания по поводу философских проблем. Все женские персонажи очень привлекательны, а в аниме нередко используется красивая графика.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/17-Martial-Arts b-tag bubbled-processed]
[span=genre-ru]Боевые искусства[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Боевые искусства — системы единоборств и самозащиты различного происхождения. Основная аудитория - мальчики, юноши и просто любители единоборств. Центральная линия сюжета – изучение какого-то вида боевого искусства. Особое внимание уделяется развитию навыков и росту силы персонажей. С помощью своих выдающихся способностей герои расправляются с врагами, побеждают в соревнованиях.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/8-Drama b-tag bubbled-processed]
[span=genre-ru]Драма[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
В драматических аниме или манге основной акцент делается на игре сильных чувств, глубоких противоречиях и конфликтах, трудноразрешимых проблемах, которые нередко имеют непоправимые последствия. Драме свойственна трагичность, но может быть и счастливый конец.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/10-Fantasy b-tag bubbled-processed]
[span=genre-ru]Фэнтези[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
В фэнтизийных аниме и манге часто встречаются элементы фольклора, чаще всего западноевропейского, но нередко используется и колорит Востока, и элементы японской и китайской мифологии. Основное действие происходит в вымышленном мире со сказочными существами. Непременный атрибут фэнтези - магия и волшебство.
Характерное отличие этого жанра состоит в том, что особенности этого мира и существование вымышленных существ не объясняются с научной точки зрения, а являются нормой.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/38-Military b-tag bubbled-processed]
[span=genre-ru]Военное[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
В произведениях данного жанра демонстрируется функционирование различных воинских формирований от исторически достоверных армий, до отряда наемников или группы пилотов боевых роботов. Как правило, присутствуют боевые столкновения от индивидуальных схваток, до широкомасштабных сражений армий большой численности. Так же основной акцент в произведении может быть сделан на демонстрации военной техники, оружия, различных тактических приемов или на гуманитарный аспект последствий войн.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/40-Psychological b-tag bubbled-processed]
[span=genre-ru]Психологическое[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Основная цель такого аниме или манги - показать, как работает человеческая психология. Самый популярный сюжет - как сообразительный персонаж использует знание психологии, чтобы добиться собственных целей.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/24-Sci-Fi b-tag bubbled-processed]
[span=genre-ru]Фантастика[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Жанр, характеризуемый использованием фантастического допущения, «элемента необычайного», нарушением границ реальности, принятых условностей. Фантастическое допущение, или фантастическая идея — основной элемент жанра фантастики. Он заключается во введении в произведение фактора, который не встречается или невозможен в реальном мире.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/41-Thriller b-tag bubbled-processed]
[span=genre-ru]Триллер[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Жанр, нацеленный вызвать у зрителя внезапный прилив эмоций, чувство тревоги, возбуждение. Жанр не имеет чётких границ, элементы триллера присутствуют во многих произведениях разных жанров.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/4-Comedy b-tag bubbled-processed]
[span=genre-ru]Комедия[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Комедийные аниме и манга рассчитаны на широкую аудиторию. Основная цель комедии - развеселить и дать возможность отдохнуть, что вовсе не исключает поднятия философских вопросов или привнесение весьма жесткой сатиры. Здесь можно увидеть шутки, насмешки, забавные ситуации, весьма своеобразных персонажей, игру слов. Комедия бывает как самостоятельным жанром, так и "украшением" других.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/13-Historical b-tag bubbled-processed]
[span=genre-ru]Исторический[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Этот жанр рассчитан на широкую аудиторию. Действия в аниме и манге связаны с определёнными историческими событиями. Чаще всего это эпизоды из истории Западной Европы, Японии или Китая. Описываемые действия могут соответствовать реальности или быть вымышленными.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/21-Samurai b-tag bubbled-processed]
[span=genre-ru]Самураи[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Главными героями этого аниме или манги являются самураи. Большое внимание уделяется самурайскому кодексу чести – бусидо - и подвигам, и приключениям самураев. Действие обычно происходит на историческом фоне. Иногда основными действующими лицами являются ниндзя.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
animeshnik_ALT
animeshnik_ALT#
@animeshnik_ALT, Часть [5/5]
спойлер
Готовые жанры часть 2
[div=tooltip-poster][url=/animes/genre/22-Romance b-tag bubbled-processed]
[span=genre-ru]Романтика[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
В аниме и манге данного жанра акцент делается на близких взаимоотношениях между героями, а также трудностях и препятствиях на их пути.
Чувства могут быть как между девушкой и парнем, так и между девушкой и девушкой, парнем и парнем. На протяжении всего произведения зритель сопереживает злоключениям героев, радуется их успехам, ненавидит, когда, например, парень не выбрал понравившегося персонажа, а кого-то другого.
Романтической линии может отводиться и второстепенная роль, основной целью которой является лишь желание вызвать мечтания у зрителя о той или иной паре.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/23-School b-tag bubbled-processed]
[span=genre-ru]Школа[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Поскольку жанр посвящен всему, что связано со школой, основной аудиторией являются подростки. Главный акцент делается на школьных проблемах, включая взаимоотношения со сверстниками, родителями и учителями, становление личности и самоопределение. Основное действие происходит в клубах, поездках, на фестивалях и т.д.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/36-Slice-of-Life b-tag bubbled-processed]
[span=genre-ru]Повседневность[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Основная цель таких аниме или манги - художественно, и в то же время максимально достоверно, рассказать о повседневных проблемах. В центре повествования будничная жизнь нескольких человек определенного возраста, чаще всего это школьники.
Обычно аниме состоит из нескольких маленьких новелл, где описаны сцены или ситуации, в которые можно попасть в реальной жизни. В повседневности есть и место комедии – тогда главные герои постоянно оказываются в череде нелепых и комических ситуаций.
Повседневность считается самым трудным жанром, поэтому требует от мангак, режиссёров и сейю высшего пилотажа и профессионализма.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/37-Supernatural b-tag bubbled-processed]
[span=genre-ru]Сверхъестественное[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Жанр, где основной акцент делается на сверхъестественных и необъяснимых явлениях. Непременные персонажи этого жанра - вампиры, призраки, духи, демоны. Наиболее популярен японский фольклор, отражающий буддийско-синтоистское представление о мире, в которое местами вкрапляются элементы христианства.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/7-Mystery b-tag bubbled-processed]
[span=genre-ru]Детектив[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Преимущественно литературный и кинематографический жанр, произведения которого описывают процесс исследования загадочного происшествия с целью выяснения его обстоятельств и раскрытия загадки.
Аниме и манга этого жанра композиционно состоят из: завязки - обычно загадочного происшествия той или иной направленности, от потери казалось бы безделушки до убийства; кульминации - как правило высшее напряжение умственных усилий в решении задачи или наибольшая угроза лицам ведущим расследование; развязки - объяснение случившегося, решение загадки, оглашение причастных и виновных. Каждая история может находить реализацию в отдельной художественной форме лаконичного или развернутого формата, либо истории могут быть объединены в цикл по какому-либо признаку, например главным действующим лицам.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/19-Music b-tag bubbled-processed]
[span=genre-ru]Музыка[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
В аниме или манге рассказывается о музыке и музыкантах, трудностях достижения музыкальной мечты и музыкальной карьеры.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/5-Dementia b-tag bubbled-processed]
[span=genre-ru]Безумие[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Жанр аниме безумие характеризуется либо алогичностью происходящего в сюжетной компоненте, либо кажущейся бессмысленностью в визуальном плане. В первом случае произведения нацелены на обратный эффект: казалось бы безумное действо имеет целью заставить зрителя задуматься, взглянуть с другого ракурса на привычное и устоявшееся. Этот художественный приём может применяться и для привнесения юмористического оттенка в произведение. Во втором случае не несущему сюжетной нагрузки визуальному ряду обычно сопутствует соответствующее музыкальное сопровождение для погружения зрителя в состояние, которого добивается автор: тревожное, умиротворённое, созерцательное и пр.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/35-Harem b-tag bubbled-processed]
[span=genre-ru]Гарем[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Аниме или манга этого жанра имеют черты комедийного и романтического характера и рассчитаны на широкую аудиторию. Обычно по сюжету главный герой вовлечен в любовные истории с более чем 3 представителями противоположного пола. Основное внимание чаще всего уделяется выяснению отношений между персонажами.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/15-Kids b-tag bubbled-processed]
[span=genre-ru]Детское[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Аниме и манга этого жанра направлены в основном на детскую аудиторию. Произведения носят позитивный, жизнеутверждающий характер. Сцены насилия, жестокости отсутствуют или носят юмористический оттенок. Отрицательные персонажи порой выполнены так, чтобы и при одном визуальном восприятии резко контрастировали с положительными, и даже отсутствие реплик героев не оставляло сомнений в симпатиях маленького зрителя или читателя. Морально-нравственных вопросов требующих глубокого осмысления не поднимается, если они присутствуют, то их понимание лежит на поверхности.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/18-Mecha b-tag bubbled-processed]
[span=genre-ru]Меха[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Это научно-фантастический жанр, отличительной чертой которого являются человекоподобные машины, чаще всего используемые в бою. Главными героями являются персонажи, управляющие этими роботами изнутри. Основной акцент делается на контакте и синхронизации людей и машин. Характерной чертой меха является детальное описание запуска такой машины и взаимодействие с ней.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/20-Parody b-tag bubbled-processed]
[span=genre-ru]Пародия[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
В пародийных аниме или манге обычно высмеиваются другие жанры при помощи гротеска и сатиры. Характерные черты определенного жанра или жанров гиперболизируются и доводятся до абсурда.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
[div=tooltip-poster][url=/animes/genre/30-Sports b-tag bubbled-processed]
[span=genre-ru]Спорт[/span][/url]
[div=tooltip my][div=tooltip-inner][div=tooltip-arrow] [/div][div=clearfix][div=close] [/div][div=tooltip-details][div=comment-block][div=body b-text_with_paragraphs]
Этот жанр аниме или манги целиком посвящён достижениям персонажей в определённом виде спорта. Чаще всего сюжет вращается вокруг одной спортивной команды (зачастую школьной), которая, благодаря высокой мотивации и труду, постепенно побеждает всех соперников.
Основная цель – показать, что если есть сильное желание и интерес, то человек непременно добьётся успеха независимо от таланта.
[/div][/div][/div][div=dropshadow-right] [/div][div=dropshadow-left] [/div][/div][/div][/div][/div]
animeshnik_ALT
animeshnik_ALT#
@animeshnik_ALT, Код немного улучшен. Из-за ограничения приходится создавать доп. часть.
Оставлю тут ещё код, который использую в подсказке
Скрытие текста
-webkit-line-clamp: 10; значит что будет максимум 10 строк текста и троеточие.
Первое постеры для персонажей, второе для тайтлов.
/*Скрытие текста*/
.tooltip.minified.my .b-text_with_paragraphs {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 10;
  -webkit-box-orient: vertical;
}
.tooltip:not(.minified).my .b-text_with_paragraphs {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
.tooltip:not(.minified).my .tooltip.my .b-text_with_paragraphs {
  display: block; /*Отключение скрытия в подсказках жанров*/
}
разные опциональные фиксы
/*Фикс сэйю*/
#profiles_show .tooltip.my .b-catalog_entry .cover .title.two_lined {
  display: none;
}
.about .tooltip.my article.b-catalog_entry {
  padding: 0 !important;
}
.tooltip.my .b-catalog_entry {
  float: none !important;
}
/*Фикс в "не аниме"*/
.tooltip.my .line span {
  display: unset;
}
.tooltip.my {
  text-align: start;
}
.Ssylki-anime-v-1 .tooltip.my span {
  display: initial;
}
.Ssylki-anime-v-1 .tooltip.my .b-link {
  position: unset;
  display: unset;
  opacity: 1 !important;
  min-height: unset;
  line-height: unset;
  z-index: unset;
  border-radius: unset;
  background: unset;
  overflow: unset;
}
.tooltip.my .line .b-tag {
  position: relative;
  display: inline-flex;
  border-radius: 10px;
  font-size: 12px;
  line-height: 16px;
}
Отключение анимаций при наведении на большой постер
.tooltip.my .entry-tooltip_container > a img {
  transform: none;
  border-radius: var(--custom-image-border) !important;
  box-shadow: none !important;
  filter: none !important;
}
мой box-shadow
вот это:

/*box-shadow*/
/*Запланировано*/
.tooltip.my .b-add_to_list.planned .trigger, .tooltip.my .b-add_to_list.planned .ed-options {
  box-shadow: 0 0 5px royalblue, 0 0 10px royalblue, 0 0 15px royalblue, 0 0 20px royalblue !important;
}
/*Просмотрено*/
.tooltip.my .b-add_to_list.completed .trigger, .tooltip.my .b-add_to_list.completed .ed-options {
  box-shadow: 0 0 5px green, 0 0 10px green, 0 0 15px green, 0 0 20px green !important;
}
/*В ближ. планах(брошено)*/
.tooltip.my .b-add_to_list.dropped .trigger, .tooltip.my .b-add_to_list.dropped .ed-options {
  box-shadow: 0 0 5px firebrick, 0 0 10px firebrick, 0 0 15px firebrick, 0 0 20px firebrick !important;
}
/*Отложено или брошено*/
.tooltip.my .b-add_to_list.on_hold .trigger, .tooltip.my .b-add_to_list.on_hold .ed-options   {
  box-shadow: 0 0 5px chocolate, 0 0 10px chocolate, 0 0 15px chocolate, 0 0 20px chocolate !important;
}
/*Смотрю*/
.tooltip.my .b-add_to_list.watching .trigger, .tooltip.my .b-add_to_list.watching .ed-options {
  box-shadow: 0 0 5px darkslateblue, 0 0 10px darkslateblue, 0 0 15px darkslateblue, 0 0 20px darkslateblue !important;
}
/*Пересматриваю*/
.tooltip.my .b-add_to_list.rewatching .trigger, .tooltip.my .b-add_to_list.rewatching .ed-options {
  box-shadow: 0 0 5px #04cb87, 0 0 10px #04cb87, 0 0 15px #04cb87, 0 0 20px #04cb87 !important;
}
назад
Твой комментарий
Вернуться к редактированию
Предпросмотр
Скрыть