Карточки тем

[Discourse]

	Краткое описание	Topic Cards изменяют внешний вид списка тем, отображая их в виде карточек с миниатюрой
	Предпросмотр	Предпросмотр в Discourse Theme Creator
	Репозиторий	https://github.com/discourse/discourse-topic-cards
	Новичок в темах Discourse?	Руководство для начинающих по использованию тем Discourse

Установить этот компонент темы

Поскольку это #официальный компонент темы, поддерживаемый командой Discourse, запросы на #поддержку, сообщения об #ошибках, предложения по ux и #новым функциям можно отправлять в соответствующие категории здесь, на Meta, с соответствующими тегами компонента темы. Нажмите на ссылку ниже, чтобы начать.

 Поддержка  Ошибка  UX  Функция

Этот компонент темы может вызывать конфликты с другими пользовательскими изменениями списка тем

Возможности

Этот компонент вдохновлен миниатюрами тем, упрощает использование, добавляет краткие описания и возможность клика по всей карточке, а также включает дополнительные стили CSS.

• Сделать всю карточку кликабельной (кроме аватара автора оригинального сообщения)
• Отображать краткое описание
• Отображать миниатюру темы, если она доступна
• Отображать дату публикации
• Убрать часть метаданных и сделать лайки более заметными

Рабочий стол

Мобильное устройство

Настройки

Перевод	По умолчанию
published	Опубликовано

Размещено у нас? Компоненты тем доступны для использования в наших тарифах Standard, Business и Enterprise.

[Moin]

Вертикальная синяя линия перекрывает часть текста

(Похоже, это не зависит от браузера или устройства: я пробовал Edge/Windows, Chrome/Android и Firefox/Android)

[frold]

работало из коробки в Chrome на Windows и в Chrome на iPhone 8

[chapoi]

@Moin

Вертикальная синяя линия закрывает части текста

Да, забыл об этом. Исправлю – спасибо

[jayme]

Как мне убрать вкладки «Ответы» и «Активность» под кнопкой «+ Новая тема»?
Из-за них моя тема выглядит слишком короткой и это выглядит не очень, ха-ха

[Lilly (Lillian)]

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

[chapoi]

Границы/box-shadow плохо работают с карточками, поэтому пришлось немного импровизировать, чтобы создать альтернативное указание

https://github.com/discourse/discourse-topic-cards/pull/6

[Moin]

@chapoi

Пришлось немного импровизировать, чтобы получить индикатор замены

Странно, но сейчас я не вижу никакого индикатора

[chapoi]

Вы используете команды j/k для навигации?

[Moin]

Нет, я просто использовал Tab. На самом деле я использовал свой планшет. После нажатия кнопки «Назад» пост обычно подсвечивается. Здесь этого не произошло. Я пробовал это только на компьютере для записи.

[derak (Cristian Deraco)]

потрясающий компонент темы!

[Gonerdot]

Я попытался установить этот компонент на множество тем, но он везде выглядит немного криво. Что я делаю не так?

[chapoi]

Хм… сложно сказать. Похоже, что высота карточек каким-то образом ограничена, а содержимое больше обычного.

Сначала проверьте, не вызвано ли это конфликтом с другими компонентами или темой. Я вижу, что у вас также включена правая боковая панель, что, возможно, влияет на некоторые расчеты размеров.

Пожалуйста, проверьте это и дайте мне знать?

[Gonerdot]

Я отключил все остальные компоненты, но проблема не была решена.

[chapoi]

Странно! Можно посмотреть на форум, где вы его установили?

[Gonerdot]

Строительство домов

Но вам нужно изменить тему на Dracula в настройках профиля.

[chapoi]

Спасибо, я посмотрю!

[Gonerdot]

Мне кажется, что проблему можно решить, ограничив количество символов в превью, но я не знаю, как это сделать

[chapoi]

Хорошо, карточкам тем нужно задать максимальную высоту, иначе возникнут проблемы, как здесь:

Я не могу сказать, почему у вас не получается, потому что в примере на Theme Creator я тоже использую многострочные заголовки, и всё выглядит нормально:

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

Как вы и предложили, возможное решение — ограничить заголовок одной строкой. Для этого можно добавить следующий CSS:

.topic-card {
  .link-top-line {
      max-width: 100%;
      overflow: hidden;
      
     .title {
        display: block;
        white-space: no-wrap;
      }
   }
}