Перевод статьи Лии Веру про автоматическую темную тему на css-переменных

[ariarzer]

[pepelsbey]

Спасибо! Сделал первый подход по демкам и стилю кода :)

[ariarzer]

@pepelsbey а зачем выносить демки локально? Смотрела как в других статьях, так снипеты кодпена.

[pepelsbey]

К сожалению, код-пены удаляются, блокируются и просто замедляют загрузку статьи. Локальные демки почти ничем не отличаются. У нас был план отрефакторить код-пены в локальные демки и в остальных статьях. Твоя — первая попытка :)

[pepelsbey]

Ну и знаешь, первая статья у нас была опубликована 10 лет назад, по-другому начинаешь смотреть на целостность сайта, его ресурсов и зависимостей :) Хочется сохранять всё для истории, не только для сегодняшних читателей.

[pepelsbey]

Применил все правки Никиты и встроил ещё одну демку. Но там беда: у демки очень красивый декларативный код и 385 КБ скриптов, чтобы один слайдер передал одно кастомное свойство.

Демку надо бы переписать на ванильку, должно быть очень просто. Если никто не возьмётся, дожму попозже :)

Недавно писал похожий код:

const range = document.querySelector('input')
const frame = document.querySelector('iframe')

range.addEventListener('input', () => {
  frame.style.width = range.value + 'px'
})

[MeFoDy]

Демку надо бы переписать на ванильку, должно быть очень просто. Если никто не возьмётся, дожму попозже :)

Я бы не переписывал код в переводах. Можно либо ссылку давать в статье, чтобы не сразу грузилось, либо loading=lazy ставить. Но это всё же авторский код, а мы про перевод статьи, не кода.