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

animeshnik_ALT
Собрал некоторые проблемы стиля, а также самого шикимори с моими решениями.
спойлер
/* Проблемы E-design */
/* Скрытие длинного текста в заголовках */
.headline, .midheadline, .subheadline {
  overflow: hidden;
}
/* Тэги на главной странице в разрешении 481-570px выходят за границы */
.b-news_wall-topic .status-line .tags {
  flex-wrap: wrap;
}
/* Уменьшение размера misc-links чтобы помещались в заголовок */
body.p-profiles .mass-actions .action a:after, body.p-profiles .subheadline .misc-links > a:after, .headline .misc-links > a:after, .midheadline .misc-links > a:after, .subheadline .misc-links > a:after {
  width: 27px;
  height: 26px;
}
/* в текстовом редакторе WYSIWYG текст наезжает на кнопку */
.l-footer .links {
    padding-top: 6px;
}
/* В разрешении от 409px до 480px история исчезает */
@media screen and (max-width: 480px) {
  .p-profiles .profile-head .c-history {
      display: block;
  }
}
/* Кнопки на странице редактирования именно ссылок уехали. Пример: https://shikimori.me/ranobe/1313-gosick/edit/external_links */
#vue_external_links .b-collection_item .drag-handle[data-v-97e2d164] {
  left: unset !important;
  top: 25px !important;
}
/* Либо так (выглядит не очень)
#vue_external_links .b-collection_item .drag-handle[data-v-97e2d164] {
  margin-top: 0 !important;
  left: unset !important;
}
#vue_external_links .b-collection_item .delete[data-v-97e2d164] {
  left: 8px;
} */

/* Зачем скрывать постеры?
#profiles_show .b-catalog_entry-tooltip > a, #profiles_show .entry-tooltip_container > .image-link, #profiles_show .b-catalog_entry-tooltip .image, #profiles_show .b-catalog_entry-tooltip > a {
    display: none;
}
   Исправляем*/
#profiles_show .b-catalog_entry-tooltip > a, #profiles_show .entry-tooltip_container > .image-link, #profiles_show .b-catalog_entry-tooltip .image, #profiles_show .b-catalog_entry-tooltip > a {
    display: flex;
}
/* Данная настройка только мешает
.b-menu_logo img, .p-clubs-show .l-content .logo img {
    background: rgba(var(--white-color), var(--hundred));
    box-shadow: 0 0 20px rgba(var(--shadows-color), 0.5);
}
   Исправляем*/
.b-menu_logo img, .p-clubs-show .l-content .logo img {
    background: none;
    box-shadow: none;
}

/* На телефоне очень странно выглядит таблица в списке манги. Особенно если поставлена галочка «Отображать тома у манги». Моё решение заключается в удалении лишних элементов с экрана 
  Простой вариант */
@media screen and (max-width: 480px) {
  /*.p-user_rates-index .list-lines tr .num.hoverable:nth-child(4), .p-user_rates-index .list-lines tr .num.hoverable:nth-child(5), th.num.order-control[data-order="chapters"], th.num.order-control[data-order="volumes"] {
    display: none !important;
  }
  th.num.order-control[data-order="kind"] {
    display: table-cell !important;
  }*/
  .p-user_rates-index .list-lines tr .num, .p-user_rates-index .list-lines tr .num.hoverable, th.num.order-control[data-order="my"], .p-user_rates-index .list-lines tr .num:nth-child(3) {
    display: none !important;
	}
} 

  /*Оставляем главы до момента, пока они не станут мешать 
@media screen and (max-width: 480px) {
  .p-user_rates-index .list-lines tr .num.hoverable:nth-child(5), th.num.order-control[data-order="volumes"] {
    display: none !important;
  }
  th.num.order-control[data-order="kind"] {
    display: table-cell !important;
  }
  .p-user_rates-index .list-lines thead tr .num:nth-child(3) {
    padding-right: 4px;
  }
  span.current-value[data-field="chapters"] {
    display: block !important;
  }
}
@media screen and (max-width: 350px) {
  th.num.order-control[data-order="chapters"], .p-user_rates-index .list-lines tr .num.hoverable:nth-child(4) {
    display: none !important;
  }
  .p-user_rates-index .list-lines thead tr .num:nth-child(3) {
    padding-right: 0;
  }
}

/* на страницах модерации не наводятся аватарки модераторов https://shikimori.me/moderations/abuse_requests https://shikimori.me/moderations/bans https://shikimori.me/moderations/critiques https://shikimori.me/moderations/articles 
Решение, но на странице https://shikimori.me/moderations/abuse_requests съехал текст, хз как без костылей его обратно впихнуть */
.p-moderations ul.b-list {
    display: inline-block;
}
/* Страница https://shikimori.me/moderations/abuse_requests съехали маркеры, а также справа от заголовка "очередь" исчезли иконки */
/* Слово "Спойлер" отсутствует */
body * [class*="_marker"]::before {
  content: attr(data-text);
}
/* Костыли, надо бы сделать по нормальному */
@media screen and (min-width: 768px) {
  .b-log_entry.b-abuse_request .marker {
      top: 14px !important;
      left: 0 !important;
      margin-right: 10px !important;
  }
  .b-log_entry.b-abuse_request .b-offtopic_marker {
    margin-right: 6px !important;
  }
  .b-log_entry.b-abuse_request .b-abuse_marker {
    margin-left: 6px !important;
  }
  .marker.b-spoiler_marker[data-text="спойлер"] {
      margin-left: 8px !important;
  }
  .b-log_entry.b-abuse_request .marker.b-summary_marker {
      margin-left: 18px !important;
      margin-right: 0 !important
  }
}
@media screen and (max-width: 767px) {
  .b-log_entry.b-abuse_request .b-offtopic_marker {
    left: 4px;
  }
  .b-log_entry.b-abuse_request .marker.b-summary_marker {
    margin-right: 8px !important;
  }
  .b-log_entry.b-abuse_request .marker.b-abuse_marker {
    top: 14.5px;
    margin-left: 6px !important;
    margin-right: 4px !important;
  }
  .b-log_entry.b-abuse_request .b-spoiler_marker {
    top: 14.5px;
    margin-left: 5px !important;
    margin-right: 9px !important;
  }
}

/* Есть в основном коде шики */
@media screen and (max-width: 1023px) {
  .p-db_entries-edit_field .menu-slide-outer .l-content {
      width: 100% !important;
  }
}

/*Исправление нижнего скролла у хрома*/
body {
  width: unset !important;
}
/*либо*/
html {
  background-color: rgba(var(--menu-back), 1);
}
/*либо
::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.7);
}
::-webkit-scrollbar-thumb:active {
  background-color: rgba(255, 255, 255, 0.6);
}
::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.5);
}


/*На некоторых страницах турниров (наверно старых) другие классы. Пример: https://shikimori.me/contests/11-luchshie-anime-studii-sunrise */
#contests_show .results .b-catalog_entry:hover, #contests_show .results .b-catalog_entry {
  background: transparent !important;
  transform: scale(1);
  box-shadow: none;
}

/* меню WYSIWUG при редактировании комментария оказывается за header'ом */
.menubar[data-v-082d85bb] {
    top: 45px;
}
/*На странице аниме при выборе фильтра надпись "исключить" закрывает вопросик*/
.b-collection-filters .block-list .filter, .b-collection-filters .b-block_list .filter {
  right: 21px;
}
/*Кнопка выбора типа TV сериала была левее кружочка*/
.sub input[type="checkbox"]:before {
  position: relative;
  left: 19px;
}

/*Ждем исправления от морра*/
/* Непосредственно на странице редактирования */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .p-db_entries-edit_field .l-page .menu-slide-outer:not(.ipad-expanded) .menu-slide-inner {
       width: 100%; 
  }
}
/* Кому мешает ссылка? */
.p-user_rates-index header.head a.misc {
    display: block;
}

/*Фикс скрытия отзывов, комментов и т.д.*/
.b-height_shortener, .expand {
    position: relative;
}

/*Фикс при разрешении 768-восемьсот какая-то*/
@media screen and (min-width: 768px) and (max-width: 900px) {
  .menu-dropdown {
    max-width: 180px;
  }
}

/*Текст почему-то не переходит на другую строчку*/
.b-input textarea[type=text] {
  white-space: wrap;
}
Ответы

Нет комментариев

назад
Твой комментарий
Вернуться к редактированию
Предпросмотр
Скрыть