Как изменить отзывчивые точки останова в моем приложении пользовательского интерфейса угловой ясности?

Я искал и не могу найти подробное руководство о том, как это сделать. У меня есть простое приложение angular 5, которое использует пользовательский интерфейс ясности VMware, и я создал его с помощью angular-cli и использую css. Я хочу изменить точки останова в сетке здесь: https://vmware.github.io/clarity/documentation/v0.13/grid

Я думал, что это будет обычная задача, описанная на веб-сайте ясности VMware, но мне не повезло собрать воедино, как это сделать.

Мой раздел стилей .angular-cli.json выглядит так:

"styles": [
        "../node_modules/@clr/icons/clr-icons.min.css",
        "../node_modules/@clr/ui/clr-ui.min.css",
        "../node_modules/nouislider/distribute/nouislider.min.css",
        "styles.css"
      ],

Это работает нормально. Но теперь мне нужно переопределить отзывчивые точки останова.

Я попытался добавить main.scss и установить node-sass и следовать приведенному здесь руководству, чтобы переопределить: https://vmware.github.io/clarity/documentation/v0.11/themes#examples

Однако мое приложение не будет компилироваться, и я даже не уверен, что это правильный подход. Ошибка: @import "~bootstrap/scss/normalize"; ^ Файл для импорта не найден или не читается: ~bootstrap/scss/normalize

Спасибо за любую помощь, указывающую мне в правильном направлении.


angular breakpoints vmware-clarity
person Peter Speltz    schedule 29.09.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Возможно, вы просматриваете разные версии документации, так как версии 0.11 и 0.13 имеют разные правила темы. Убедитесь, что вы используете ту же версию документации, что и в вашем коде. 0.12+ поддерживает только Angular 6.

Если вы просто хотите изменить точки останова только для Datagrid, я рекомендую просто написать CSS, который устанавливает новые точки останова, а не пытаться создать весь CSS Clarity. Это становится труднее поддерживать только для одного переопределения. Я не уверен, что именно вам нужно переопределить, но лучше всего использовать devtools, чтобы найти селекторы, которые изменяют макеты на основе медиа-запросов.

person Jeremy Wilken    schedule 01.10.2018