Отключить настройки фонового изображения и мозаики выше.
В этой теме есть три настройки:
Поле для добавления собственного фонового изображения
Опция для его повторения (мозаики)
И опция для отключения обоих параметров выше
Если вы отключите опцию мозаики, изображение будет установлено с background-size: cover, и ваш браузер пропорционально масштабирует изображение, чтобы полностью покрыть фон. Например:
Я один такой с этой проблемой, используя эту тему? Когда я тестирую в Google PageSpeed, он показывает 99%, но страница не загружается, поэтому результаты вводят в заблуждение.
В чём причина, что Google не может увидеть — страница не загружается?
Хм, да, я вижу ту же проблему… Похоже, что что-то в теме мешает версии Discourse, которую мы показываем Google. Я разберусь. Кажется, это та же проблема, что и с печатным видом, о которой сообщалось выше.
Я пытаюсь сделать Graceful значительно шире на десктопе. Пробовал следующее:
#main-outlet {
width: auto;
max-width: 1210px; /* Это делает контейнер таким же широким, как логотип/элементы управления заголовком */
}
Этот CSS сделал общий контейнер шире, и рекомендуемые темы внизу красиво растягиваются по странице, но общая ширина постов в темах слишком узкая (для моей широкой версии).
Пользовался инспектором и пробовал множество элементов, но, не будучи экспертом, не смог добиться того, чтобы ширина тем/постов соответствовала ширине #main-outlet.
Не могли бы вы помочь мне?
Спасибо.
Также пробовал это:
#main-outlet {
width: auto;
max-width: 80%;
}
Но не могу добиться того, чтобы ширина постов соответствовала ширине контейнера:
Это не очень элегантно, но хотя бы работает «нормально» с большими блоками кода — на большом экране разработчика читать стало проще.
Было бы здорово показать .timeline-container, но мне не удалось заставить это работать через переопределение класса, как было предложено. Вероятно, из-за моих недостаточно развитых навыков CSS.
Спасибо за вашу помощь и за эту замечательную тему.
Мне очень нравится эта тема! Большое спасибо, что поделились ею с нами!
Я заметил, что на мобильной версии исчезают цветные полосы категорий. Это сделано намеренно, и есть ли способ их вернуть?
Также можно ли отключить фон, если для категории установлен свой фон? Всё работает нормально, но при прокрутке длинных постов экран начинает дергаться, и временами просвечивает фон темы.
…но это отображает только белую полосу, а не конкретный цвет категории. Как сделать так, чтобы отображался правильный цвет категории? Я знаю, что это связано с переменными цветов категорий, но не могу найти соответствующие ссылки.
Я новичок в CSS и подобных вещах, так что, возможно, делаю что-то не так.
Должно быть, я туплю, но не могу заставить логотип менять размер с помощью компонента темы, созданного для настройки CSS. Я могу изменить общую высоту заголовка, но логотип упрямо остаётся прежним. Этот CSS, похоже, отменяет любые мои попытки изменить его:
.d-header #site-logo {
max-height: 35px !important;
}
Согласно инспектору Chrome, это значение берётся из файла: desktop-scss-graceful.scss
Изменение размера логотипа работает отлично в теме по умолчанию, и, как я уже сказал, изменение высоты заголовка работает в Graceful, но только не с логотипом…
Да, !important переопределяет любой другой CSS без !important… Я не помню, зачем он там, но стоит проверить, можно ли его удалить. Работает ли это, если вы добавите !important в свой собственный CSS?
.d-header #site-logo {
max-height: 50px !important; // <-- ваша собственная высота здесь
}
Спасибо за быстрый ответ! Я действительно заметил !important и пытался добавить его к своему стилю, но безрезультатно. Странно то, что сейчас, когда я сохраняю это изменение и страница обновляется, на миг логотип появляется правильного размера, а затем снова уменьшается. И в инспекторе он выглядит так, будто всё в порядке:
По крайней мере, в том смысле, что 35px отключён. Но порядок, по меньшей мере, кажется странным. В любом случае, это всё ещё не работает. Как-то странно.
Кстати, я добавил это в Common CSS…
Обновление: нашёл! Это:
.d-header #site-logo {
height: 2.667em;
}
в файле header.scss!
И если я добавлю свой height: с !important, всё работает!
Хорошо, следующий вопрос, который, как я думаю, специфичен для этой темы. Я использую её как основу для создания своего рода личного «блога» (на самом деле это цифровой сад, но это довольно obscure термин). Поскольку практически каждый пост будет написан мной, я хочу убрать или уменьшить заметность некоторых визуальных элементов, связанных с авторством, в первую очередь аватаров, особенно в списках тем на главной странице и в категориях. Обведено красным то, что я хотел бы скрыть, если это возможно:
Использование инструментов разработчика Chrome для поиска классов/ID и попытки их скрыть (примечание для себя: не скрывать ember-view )
Также я изучаю и экспериментирую с различными компонентами, чтобы отображать первое изображение в теме в виде миниатюры. Если бы я мог заменить эти аватары на маленькие миниатюры первого изображения в теме, это было бы отлично. Но их скрытие — уже хороший шаг.