LIFERAY 7.2 GA1 Тема: Мой собственный стиль s css влияет на меню Liferay по умолчанию (в левой части и вверху)

Question

У меня проблема при разработке новой темы Liferay 7.2 на основе gradle в качестве инструмента для сборки, проблема в том, что я добавил пользовательский css в файл _custom.scss, чтобы настроить некоторые стили в своей теме панель управления по умолчанию и панель управления liferay по умолчанию выглядят очень плохо, и моя тема выглядит не адаптивно (я имею в виду стиль и есть кнопки, которые больше не отображаются, например, toast-animation- btn не виден).

С моей точки зрения, может быть, мой пользовательский css (поскольку у меня большой файл css, это что-то вроде Migration from 6.2 --> 7.2) влияет на работу портала liferay по умолчанию -> это только мое мнение, и, возможно, я могу ошибаться ...

В противном случае, если мои рассуждения верны, пожалуйста, как может помешать моим стилям повлиять на меню по умолчанию liferay?

Answer 1

Многое изменилось между 6.2 и 7.x html разметка. Я настоятельно рекомендую протестировать каждую маленькую функцию css независимо и переписать ту, которая больше не совместима. Под функцией я подразумеваю весь код css, связанный с указанным c портлетом или разделом вашего шаблона.

Кроме того, сами шаблоны темы сильно изменились и не являются строго совместимыми. В этом случае я бы предложил начать с новых шаблонов темы и вернуть одну за другой настройку, которую вы сделали в ней. Также обратите внимание на новую функцию содержимого страницы: https://portal.liferay.dev/docs/7-2/user/-/knowledge_base/u/creating-content-pages Возможно, вы сможете заменить многие настройки темы на них в более удобном для пользователя и веб-администратора виде.

Это означает, что если вы просто хотите изолировать свой sass-код от воздействия на меню администратора, в шаблоне по умолчанию нет быстрого способа определить раздел содержимого страницы (ну, есть #wrapper и # контента, но они слишком обобщенные c и присутствуют также на странице администратора). Я бы предложил добавить идентификатор на нужном уровне вашего собственного шаблона. После этого просто вставьте весь свой sass-код в этот идентификатор.