Платформа 7.2. Баг с применением стилей?

Добрый день.

Использовали респонсив экраны, где стили задавались следующим образом:

  .responsive-all {
    overflow: visible;

    &[width-range~="0-1000px"] {

      .panel-three-widget-container {
        width: calc(100% - 20px) !important;
        height: 400px !important;
      }
    &[width-range~="1001px-"] {

      .panel-three-widget-container {
        width: calc(33% - 20px) !important;
        height: 400px !important;
      }
}

Сейчас я вижу в отладчике браузера, что не изменяется класс .responsive-all с
image

на
image

при изменении ширины.
Если переоткрыть экран в одном из двух состояний (>1000 и <1000), то все отрабатывает корректно (т.е. вроде бы селекторы указаны верно).

Баг? Или что-то подправить в стилях нужно?

Добрый день!

Атрибут responsive="true" указан для контейнера с responsive-all?

Глеб

Глеб, похоже, что указано.
image

Собственно, в самом дэшборде, откуда и были подсмотрены стили, поведение тоже сломалось.
Хотел проверить еще и дэшбоарже, но получается, что в текущей версии dashboard я это сделать не могу, во всяком случае через ui. При создании данный атрибут в форме есть, а потом его нигде не найти.

На Вашем скриншоте видно, что responsive="true" у cssLayout со стилем responsive-four-column, а не responsive-all для которого написаны стили. Проблему воспроизвести не получилось, responsive стили работаю, например: https://demo10.cuba-platform.com/sampler/open?screen=responsive-csslayout.

Не могли бы Вы приложить демо проект, где проблема воспроизводится?

С уважением,
Глеб

1 симпатия

Я пока не до конца разобрался с “моим responsive”. Запощу тут. Возможно, ноги моей проблемы растут отсюда.
Экран:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns="http://schemas.haulmont.com/cuba/screen/window.xsd"
        caption="msg://caption"
        messagesPack="com.company.testgb.web.screens">
    <layout>
        <tabSheet id="tabSheet" width="100%">
            <tab id="mainTab" spacing="true" >
                <groupBox width="100%" height="100px"/>
            </tab>
        </tabSheet>
    </layout>
</window>

7.1.2:
GIF Gb71

7.2.3:
GIF Gb723

Спасибо, что сообщили о проблеме. Завел задачу на GitHub.

Глеб

1 симпатия

Глеб, доброго дня.

Вот тут приложил проект, на котором можно наблюдать, что responsive в 7.2 работает не совсем корректно:

  1. Если будем изменять ширину экрана изменением масштаба в браузере или minimize-maximize кнопкой окна браузера - стили отрабатывают корректно.
  2. Если будем изменять ширину, перемещая границу окна браузера, то стили не отработают.

Это вроде бы не критично, но в 7.1 работало и по варианту 2.
Может быть я чем-то ошибаюсь, тогда прошу подсказать в чем.

Спасибо, обновил задачу.

Глеб

1 симпатия