Size: a a a

2020 August 10

AR

Alexey Raspopov in Frontend UA
Кто-нибудь может подтвердить, в Хроме пофиксили возможность использовать анимации для псевдо элементов?
источник

AR

Alexey Raspopov in Frontend UA
Проверил в codepen, точно работает. Остается вопрос почему не анимируется ::-webkit-progress-bar или ::-webkit-progress-value 😓
источник

AS

Alexey Shvayka in Frontend UA
Alexey Raspopov
Кто-нибудь может подтвердить, в Хроме пофиксили возможность использовать анимации для псевдо элементов?
пофиксили еще в 2013м
источник

AS

Alexey Shvayka in Frontend UA
для этих псевдоэлементов ни то что анимация не работает, но даже не все стили
источник

AS

Alexey Shvayka in Frontend UA
учитывая что кроме хрома еще есть браузеры, лучше сразу все резетать и делать руками, поверх a11y фичей которые дает <progress>
источник

AR

Alexey Raspopov in Frontend UA
Я всё ресетнул и потом узнал как много разницы в псевдоэлементах progress у фф и хрома
источник

AR

Alexey Raspopov in Frontend UA
Ещё чуть чуть и я просто сделаю div.progress-bar[role=progressbar]
источник

AS

Alexey Shvayka in Frontend UA
я предлагаю вообще все резетнуть, в том числе и псевдоэлементы
источник

AS

Alexey Shvayka in Frontend UA
progress { appearance: none; }
источник

AR

Alexey Raspopov in Frontend UA
да, я так и сделал
источник

AS

Alexey Shvayka in Frontend UA
тогда псевдоэлементы вообще не должны рендерится (вроде)
источник

AR

Alexey Raspopov in Frontend UA
нет, они рендерятся очень примитивными стилями
источник

AR

Alexey Raspopov in Frontend UA
но даже их именивание отличается для вебкит и мозиллы, например
источник

AR

Alexey Raspopov in Frontend UA
колбаска с прогрессом называется ::-webkit-progress-value, который лежит в ::-webkit-progress-bar. но в файрфоксе этот -value называется ::-moz-progress-bar
источник

AR

Alexey Raspopov in Frontend UA
indeterminate состояние в фф это полностью заполненный прогресс, в сафари/хроме полностью пустой (при appearance: none)
источник

AS

Alexey Shvayka in Frontend UA
да уж, за 7 лет ничего не поменялось
источник

SG

Stas G in Frontend UA
Все заняты спеками JS 😔
источник

AS

Alexey Shvayka in Frontend UA
либо all: unset для каждого псевдоэлемента, в отдельных селекторах для -moz-* и -webkit-*, либо <div> + aria-*
источник

AS

Alexey Shvayka in Frontend UA
с правильным ARIA разницы для скринридера с <progress> быть не должно
источник
2020 August 11

AN

Anton Nemtsev in Frontend UA
Привет, а подскажите, пожалуйста, есть ли в ramda flat для объекта?
Есть код который мапит массив объектов этой ф-ей:

const BuildServiceProList = ({
 node: {
   id,
   companyProfile: {
     companyLogo: {
       sizes: { small: avatar },
     },
     companyName: title,
     rating: score,
     isNew,
   },
   reviews: { totalCount: ratings },
 },
}) => ({
 id,
 avatar,
 title,
 score,
 ratings,
 isNew,
});


Хочется переписать её в стиле рамды, но пока не вижу способа сделать это без каких то R.paths([[node, id],[node, companyProfile, companyLogo, sizes, small], …] что менее читабельно.
источник