4 месяца и 1 неделя
Время за аниме и мангой
1 неделя
1 месяц
3 месяца
6 месяцев
1 год
Активность на сайте
Общие
Жанровые
Франшизы
7 / 204
Обо мне
О моей теме
Коллекция тем
«Ночная» схема
Cборщик
Вкладки (табы)
Иконки
Заметки
Сборщик с упрощенным подбором цветов: grin3671.github.io

Если вы не хотите заморачиваться с настройкой трех цветов, то можете скопировать этот код:
/* Основной файл темы */
@import url(https://shiki-theme.web.app/import/main.css);
/* Шрифт Roboto */
@import url(https://shiki-theme.web.app/import/font-roboto.css);
/* Стили обложки профиля */
@import url(https://shiki-theme.web.app/import/profile-cover.css);
/* Материальные поля ввода */
@import url(https://shiki-theme.web.app/import/md-textfields.css);
/* Изменения профиля v1.0 */
@import url(https://shiki-theme.web.app/import/profile-update.1.css);
/* Изменения профиля v1.1 (дополнение к v1.0) */
@import url(https://shiki-theme.web.app/import/profile-update.1.1.css);
/* Светлая тема */
@import url(https://shiki-theme.web.app/import/theme-light.css);

/* Настройки переменных темы */
@media {:root {
  /* Обложка профиля */
  --user-cover: url(https://i.imgur.com/A9fsHnT.jpg);
  /* Фон сайта */
  --user-background: none;
}}

/* Моя обложка в профиле */
.p-profiles .profile-head::before {
  display: block;
  background-position: center 50%;
}
Важно: если вы отключаете чужие стили, то .p-profiles .profile-head::before надо заменить на .p-profiles .profile-head[data-user-id=2727]::before, где 2727 — ваш ID.



Я также рекомендую поставить следующиеимпорты, для большего удобства:
/* Замена обычных спойлеров большими блоками на всю ширину области */
@import url(https://css-club.web.app/css/td_spoiler.min.css);
/* Модуль для постеров */
@import url(https://css-club.web.app/css/rate_module.min.css);
/* Фиксированный размер обложек */
@import url(https://css-club.web.app/css/fixed_cover.min.css);
Подробнее о них написано тут: /CSS-Клуб/Импортируемые-шаблоны



Для заинтересованных:
  • Обновления темы: /commits
  • Ветки разработки: /branches
  • Известные ошибки и планируемые улучшения: /issues
  • Яндекс.Деньги: 41001258665103


NOTE кросс-браузерность и пр.
  • В псевдоэлементах нельзя использовать em для font-size (по крайней мере перезапись значений), т.к. в IE9-11 перезапись не работает и происходит перемножение:
    .text-large::after
      font-size: 1.25em // 20px - все браузеры
    
      @media (min-width: 960px)
        font-size: 1.5em // 24px - нормальные браузеры, 30px - IE9+ (16 * 1.25 * 1.5)
    Stack Overflow: stackoverflow.com/q/6322916 (2011 г), stackoverflow.com/q/25750684 (2014 г)
  • Быстро перейти на английскую локаль: ?locale=en (сохраняется при переходах).


Прочее

Описание
Обычный вариант
С анимацией (фиксированный размер)
steam ver.
Карусель – это видоизменённые табы, поэтому внутри других табов она работать не будет.

Описание
Оформление Bootstrap'a
Круглые плашки
Вкладки сбоку
Класс to-process и атрибут data-dynamic=tabs обязательны для контейнера с табами. Внутри этого контейнера скрипт находит элементы с атрибутом data-tab-switch и data-tab, которые будут расцениваться как "Кнопки табов" и "Табы" соответственно. Вложенные табы не работают.

Важно! «Круглые плашки» и «Вкладки сбоку» – часть моей темы, начиная с версии v1.4.2-beta.3.

Описание
BBCode
CSS


Всплывающее окно

BUG: Закреплённое (fixed) верхнее меню будет "выше" слоя с цитатой, и останется доступным для клика.

Описание
Предпросмотр
BBCode
CSS

Steppers – пошаговые инструкции

Позволяют представить информацию в виде инструкции, разбитой на несколько логических шагов.
На деле это просто перекраска списка [list].

Инструкция (на табах)
  • Откройте сборщик
  • Узнайте свой ID
  • Первая настройка
    Необязательно
  • Соберите тему
Откройте страницу сборщика grin3671.github.io/shiki-theme/ в новой вкладке.
На этом сайте вы сможете легко настроить тему и получить готовый код своей темы.

Обо мне
Модуль для постеров
Персонажи
Модерация
Рассинхронизация:
Удалено на MALе: Кандидаты на роль «Not Trusted Version Changer»
  • Thief_27Thief_27 — гугл транслейт, копирование текстов без указания источника.
Скрыть 705 комментариев
Показать 705 комментариев
Загрузить ещё 10 из 705 комментариев
grin3671
grin3671#
@รςɭเгՇ, на отдельной странице комментария и в пустом диалоге этим блоком пользоваться невозможно, поэтому вряд ли. Мне всплывающее окно нравится гораздо больше, чем сдвигающая блоки текущая раздвижная панель, но я не знаю как решить эту проблему.
รςɭเгՇ
รςɭเгՇ#
@grin3671, А можно по подробнее на этот счёт, просто я лично у себя не вижу никаких проблем.
grin3671
grin3671#
@รςɭเгՇ, как-то так:
746x556
Тут просто overflow на b-topic, в общем-то ничего сложного.

701x329
А вот тут просто места нет для раскрытия этого окна
รςɭเгՇ
รςɭเгՇ#
@grin3671, И впрямь какое то безвыходное положение(пустой диалог) да и вообще там нужно определённое количество комментов для свободного места. Можно конечно просто отображение внизу сделать чисто для этой страницы, но это не решает проблему.
grin3671
grin3671#
@รςɭเгՇ, для пустого диалога можно использовать что-то вроде empty states, но с этим нужно очень аккуратно — далеко не в каждый дизайн это впишется..
1017x597
รςɭเгՇ
รςɭเгՇ#
@grin3671, Вот этот способ реально хорош, а ведь и впрямь на Шики чего то такого и не хватало. :tea2:
Единственная проблема только с цветом картинки. Плохо что CSS не умеет перекрашивать картинки по белому цвету. Можно конечно через фильтр чего то добиться, но это совсем не то.
รςɭเгՇ
รςɭเгՇ#
@grin3671, Пользуясь случаем сделал нечто похожее для комментов. :)
920x486
По моему сайт с этим прям преобразовывается
Твой комментарий
Вернуться к редактированию
Предпросмотр
Скрыть