Почему blur в css, или filter в svg вызывает жесткую просадку в ios/macos?

Александр Цымбал, Так и сделал)) Правда в примере с шетсиренками с тенью все равно лагает на 12 mini, пришлось для ios вырубать тень.

Но на ios/macos все браузеры это safari. Все другие это надстройки только

Как совместить overflow: hidden; и position: sticky?

Ankhena, Тоже так захотел, но на фоне этой секции тоже есть этот круг.

В итоге выгрузил этот круг обрезанный из figma. Почему сразу так не сделал, такие круги выгружались и в браузере обрезались по бокам. Приходилось blur докидывать с верху. Сейчас похоже круги сделаны лучше, или figma пофиксила это))

Почему анимация выполняется так?

Ankhena, Извините, я все равно не понимаю)) Я с теорией в данной области очень на вы, уже пару часов не могу понять как найти проблему

Почему анимация выполняется так?

Сергей Сергей, Ankhena, Не совсем понял как совместить центры. Вот так?

Как в swiper сделать свайп, не при зажатии слайда а в любом месте во слайдера?

ZLevoyRyko1, Бывает)) Не, swiper же отступы делает через margin. И зажатие срабатывает только на слайде, а не на обертке. Опцию не нашел, перечитал все раз 5

Как в swiper сделать свайп, не при зажатии слайда а в любом месте во слайдера?

Использую, у меня в теге вопроса он указан))

Не срабатывает анимация в keyframes?

Спасибо!) Просто через transition работало а тут нет, я в ступор впал))

Как обновить значения transform через js?

Сергей Сергей, Там еще свойства есть, и разбирать эту строку через регулярку не хочется

Как обновить значения transform через js?

Сергей Сергей, Целиком их не запишешь. Они рассчитываются динамически и ставятся через js. Мне после всех манипуляций нужно еще докинуть translateX, чтобы старые трансофрмации не сломались

Как задать pug.d.ts только для файлов pug?

Synbulat Biishev, Да это понятно. Я пишу свои функции и пробрасываю их в pug через locals. Чтобы внутри pug mixin их использовать. Так что декларация @types/pug и gulp-pug не заставит видеть мои функции(((

Как лучше подключать scss bem блоки?

К тому же логика БЭМ немного нарушается тогда

Почему? Это же типичный миксин => блока и элемент одновременно. это все по документации bem.

Я бы совместил советы из первого комента с нормальным БЭМ где он нужен.

Можете подробнее описать как вы считаете лучше делать?)

Правильно ли я понимаю что все стили из микса которые конфликтуют со стилями самого блока, должны быть вынесены в миксин блока?

Тогда не понятно зачем вообще миксование нужно...

Как лучше подключать scss bem блоки?

Александр Талалаев, Сергей delphinpro, Да вы правы, это лучше выносить в модификатор. Но я это привел чисто как пример проблемы))

Есть случае когда миксование лучше чем модификатор. Если например стили микса встречаются только один раз. И для одного момента не зачем плодить лишний модификатор.

Как лучше подключать scss bem блоки?

Сергей delphinpro, Да, точно, специфичность у них одна. Спасибо что поправили, не знал просто как правильно назвать это)

Gulp + scss + alias, как настроить webstorm чтобы понимал alias?

А как избавиться от ~ при импорте? С webpack конфигом видит alias, но только с ~ в начале(

Можно ли через pointer-events: none; прятать модальные окна?

gogowq,

боже, чел какой ты токсичный. Пишешь так, будто бы пытаешься меня чем то задеть))

Тут да, я что то ушел в агрессию. Прошу прощения, был не прав.

При нормальной компоновке проекта, все элементы модальных окон вызываются из задницы мира.

Это правда. Все модальные окна находятся перед закрывающемся тегом body. Но по ним кликнуть можно совершенной спокойно.

Модальное окно имеет же

position: fixed;left:0;top:0;width:100%;height:100%

чем уже перекрывает всю страницу, и все клики будут уже проходить по модальному окну.

Чтобы убрать данный эффект и ставиться pointer-events

А про удалить ссылку и прочее, что ты там писал-cмешно конечно))

Ну пример был описан так))

Можно ли через pointer-events: none; прятать модальные окна?

Сергей delphinpro, Вот мне про оптимизацию и было на самом деле интересно услышать)) Просто модальных окон может быть много. И я не знал какой способ более оптимизирован. visibility или pointer-events.

Вы определенно правы, через display будет явно больше оптимизации. Спасибо!)

Можно ли через pointer-events: none; прятать модальные окна?

gogowq, Причем тут opacity: 0;. И с чего вы взяли что при opacity: 0; с окном нельзя взаимодействовать? Оно будет кликабельным. Что за бред вы сказали?

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

Есть какое то правило чтобы оно применялось только к видимому элементу? Впервые слышу.

Раз уж вам мало сокращенного кода, я вам приведу его весь. Разжую так сказать.

.modal {
  transition: $transition-duration opacity $transition-timing-function;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  opacity: 0; // Скрываем
  pointer-events: none; // Предотвращает события мыши и щелчки по элементу.

  &--open {
    opacity: 1; // Показываем
    pointer-events: unset; // Разрешаем работать с окном
  }
}

Так-же цитата:

Свойство pointer-events позволяет управлять тем, как элементы будут реагировать на события мыши или прикосновения к сенсорному экрану. Часто применяется для того, чтобы в сложной компоновке можно было взаимодействовать с нижележащими элементами, игнорируя вышележащие.

Все идеально подходит друг к другу. И анимируется лучше чем visibility.

Ваш пример:

Например ,если не нужна ссылка в каком то элементе

. В каком смысле не нужна ссылка? Так удалите ее, или выставите display: none; Или переделайте без ссылки.

но никак не в вашем случае

- Скорее уже никак в вашем случае.

Ваш комментарий не много бесполезный. Вы не вникли в вопрос, и даже не прочитали его. И вряд ли знаете как работает opacity: 0 и pointer-events: none

Можно ли через pointer-events: none; прятать модальные окна?

Именно то что я хочу. Это предотвращает взаимодействие с модальным окном. А прозрачность убирает ее из видимости. Мне это нравится на много больше чем visibility))

Как реализовать такое?

Именно то что было нужно! Спасибо!

Gulp + scss + alias, как настроить webstorm чтобы понимал alias?

Андрей Воронцов, А как избавиться от ~ при импорте? С webpack конфигом видит alias, но только с ~ в начале(