Добавляет новый baseline

[vitya-ne]

Удаляет пакет web-features, содержащего базу baseline и нуждающегося в переодическом обновлении.
Добавляет веб-компонент <doka-baseline>:

<doka-baseline groupid="light-dark"></doka-baseline>

Репозиторий веб-компонента: https://github.com/vitya-ne/doka-baseline

Особенности:

• перенос плашки в начало доки;
• русификация;
• показ версий браузеров при переходе к details;
• показ даты с которого фича находится в статусе newly или widly;

Превью контента из 50aaeb2 опубликовано.

[nasty23-star]

Большое спасибо! этого очень не хватало<3

[igsekor]

@vitya-ne очень круто ❤️

Но есть нюансы...

1. Мы с самого начала все скрипты хранили в scripts, именно поэтому их не надо было отдельно подключать. Почему было выбрано решение поместить doka-baseline.js в отдельную папочку libs? Отсюда появились проблема с тем, что нарушена консистентность, и необходимость добавлять в .eleventy.js и meta.njk новые строки, хотя необходимости в этом не было.
2. Кажется хорошо бы добавить отступ снизу, чтобы было совсем хорошо:

[furtivite]

@vitya-ne очень круто ❤️

2. Кажется хорошо бы добавить отступ снизу, чтобы было совсем хорошо:

А может попробовать две ссылки внизу в одну строку поместить, будет немного компактнее?

[vitya-ne]

@igsekor, привет

Почему было выбрано решение поместить `doka-baseline.js` в отдельную папочку `libs`? Отсюда появились проблема с тем, что нарушена консистентность, и необходимость добавлять в `.eleventy.js` и `meta.njk` новые строки, хотя необходимости в этом не было.

Я сомневался куда лучше положить веб-компонент. Нет проблем, перенесу в scripts

[vitya-ne]

@furtivite, привет

А может попробовать две ссылки внизу в одну строку поместить, будет немного компактнее?

Да, можно попробовать, перенесу.

[vitya-ne]

@igsekor

2. Кажется хорошо бы добавить отступ снизу, чтобы было совсем хорошо:

Спасибо, исправлю. Вроде я это фиксил. Проверю

[vitya-ne]

@igsekor

2. Кажется хорошо бы добавить отступ снизу, чтобы было совсем хорошо:

Спасибо, исправлю. Вроде я это фиксил. Проверю

Не могу поймать проблему нижнего отступа. У тебя точно обновлённая версия пиара ?
Странно, что на твоём скриншоте нет версий браузеров.
У меня вот так:

[igsekor]

@igsekor

2. Кажется хорошо бы добавить отступ снизу, чтобы было совсем хорошо:

Спасибо, исправлю. Вроде я это фиксил. Проверю

Не могу поймать проблему нижнего отступа. У тебя точно обновлённая версия пиара ? Странно, что на твоём скриншоте нет версий браузеров. У меня вот так:

Обновил ещё раз и проверил. Действительно всё ок. Ты молодец! Хорошо получилось! ❤️

[igsekor]

А чем «Подробнее» от «Спецификация» отличаются? Надо бы, наверное, более точно назвать, как думаешь? Нет ли тут неоднозначности? А может быть и нет.... Не знаю, но сомнения есть. Что скажете? @solarrust @skorobaeus @TatianaFokina @HellSquirrel

[vitya-ne]

А чем «Подробнее» от «Спецификация» отличаются? Надо бы, наверное, более точно назвать, как думаешь?

'Подробнее' - это ссылка на страницу Web platform features explorer. Тоесть там подробности как фича выглядет с точки зрения baseline
'Спецификация' - это ссылка на спеку.

[vitya-ne]

@igsekor Я перенёс веб-компонент в папку src/scripts/web-components

[vitya-ne]

Но мне кажется, что стрелочки не хватает, которая подскажет, что виджет можно развернуть

Привет,
ок добавлю, хотя мне эта стрелочка не нравится, потому что "обманывет" мои ожидания: надеешься увидеть что-то полезное, а там всего-то очевидный текст.

[vitya-ne]

• Добавил иконку экспандера; @StarHamster
• Добавил резервирование места; @StarHamster
• Изменил формат файла веб-компонента; @monochromer
  поглядите, плиз

[StarHamster]

А почему их два?

[vitya-ne]

А почему их два?

В этой доке такой конфиг:

две группы -> две плашки

[vitya-ne]

А почему их два?

Могу добавить показ имени группы в каждой плашке если их несколько

[StarHamster]

В MDN просто звёздочку лепят, мол, может не всё поддерживаться

Думаю, можно призвать @skorobaeus, чтобы обсудить, как оно лучше будет выглядеть

P.S. Кстати, скрин MDN с той же статьи align-self. У них и у Доки даты не совпадают. Я не понимаю, почему так(

[vitya-ne]

В MDN просто звёздочку лепят, мол, может не всё поддерживаться
P.S. Кстати, скрин MDN с той же статьи align-self. У них и у Доки даты не совпадают. Я не понимаю, почему так(

Данные которые отдаёт запрос, используемый в веб-компоненте - это только данные по группе, а не по фичи в группе.
MDN тянет какие-то доп. данные.

[skorobaeus]

А почему их два?

Могу добавить показ имени группы в каждой плашке если их несколько

Я думаю, стоит попробовать. Две одинаковые плашки кофузят :)

[vitya-ne]

А почему их два?

Могу добавить показ имени группы в каждой плашке если их несколько

Я думаю, стоит попробовать. Две одинаковые плашки кофузят :)

@skorobaeus @StarHamster
Добавил показ имён при условии что в конфиге несколько групп:

[vitya-ne]

@igsekor @StarHamster Я учёл все (надеюсь) пожелания. Было бы здорово если бы вы посмотрели, на то как это выглядит сейчас и дали свой вердикт

[igsekor]

Кажется, стало совсем здорово! Витя, ты молодец!

[vitya-ne]

@furtivite @igsekor @StarHamster @solarrust

Проблема

Основной недостаток нового подхода: <doka-baseline> использует только информацию о группе фичи (ID).

Например:

<doka-baseline groupid="light-dark"></doka-baseline>

На web-platform-dx/web-features для light-dark простой конфиг: CSS-свойство === group id.

Но для многих CSS-свойств, это совсем не так. Яркий пример Anchor positioning:
Полностью поддержки нет нигде, но очень многие отдельные свойства поддерживает Chrome и чуть меньшее кол-во Firefox: сложный конфиг

Тоесть для точности (см. MDN) нужно иметь возможность передать не только groupid но и список свойств описываемых в доке:
Пример доки: anchor-size()
Конфиг из статьи:

baseline:
  - group: anchor-positioning
    features:
      - css.properties.width.anchor-size
      - css.properties.height.anchor-size
      - css.properties.inline-size.anchor-size
      - css.properties.block-size.anchor-size

Предложение

1. можно доработать виджет, добавив запрос к файлу конфига: https://github.com/web-platform-dx/web-features/blob/main/features/ID.yml.dist и парсить в нём информацию о необходимых свойствах и поддержке.
2. оставить пакет web-features (MDN тоже его использует) и подтягивать данные о свойствах оттуда. Тогда можно передавать в виджет флаги поддержки требуемых свойств. Это потребует регулярного обновления пакета в платформе.

Вопрос: Как вы считаете, что лучше ?

[igsekor]

Вопрос: Как вы считаете, что лучше ?

Может быть сделать отдельный атрибут features для обозначения списка всех фич, которые нужно поддержать? Можно указывать, например, через ;, как это сделано для атрибута style.

[vitya-ne]

Может быть сделать отдельный атрибут features для обозначения списка всех фич, которые нужно поддержать? Можно указывать, например, через ;, как это сделано для атрибута style.

Вопрос не совсем в синтаксисе, а в том как именно проверять фичи: делать доп. запрос или использовать данные web-features.

[igsekor]

Вопрос не совсем в синтаксисе, а в том как именно проверять фичи: делать доп. запрос или использовать данные web-features.

Ну если вопрос в этом, то предлагаю всё таки подгружать данные дополнительным запросом на этапе сборки.