Спасибо, но пока, по этой статье делаю, вроде все просто, но придется кучу переменных в css для разных элементов понадобовлять:
https://frontendtoday.ru/articles/dark-mode-best-practice/
Единственное, то ли глюк какой, то ли я чет тормазнул,
Да без разницы, какой атрибут: data или class. Главное, что через изменение этого атрибута можно изменить все соответствующие стили.
Тебе это уже несколько раз предложили.
Тогда, наверное, так и попробую.
Почему не сделать кучу переменных в css в root’е пример:
--ytd-searchbox-border-color: hsla(0,0%,53.3%,0.2);
--ytd-searchbox-legacy-border-color: #ccc;
--ytd-searchbox-legacy-border-shadow-color: #eee;
--ytd-searchbox-legacy-button-color: #f8f8f8;
--ytd-searchbox-legacy-button-border-color: #d3d3d3;
--ytd-searchbox-legacy-button-focus-color: #e9e9e9;
--ytd-searchbox-legacy-button-hover-color: #f0f0f0;
--ytd-searchbox-legacy-button-hover-border-color: #c6c6c6;
--ytd-searchbox-legacy-button-icon-color: #333;
--ytd-searchbox-background: hsl(0,0%,100%);
--ytd-searchbox-text-color: hsl(0,0%,6.7%);
Поменять стиль страницы – не проблема. Главная задача, как я понимаю – в том, чтобы запомнить, какую тему выбрал гость (ну или хотя бы если тем всего две и стартовая известна – то запомнить, что гость сменил стартовую тему на другую). Вот для этой задачи я выше решение и изложил. Не знаю, может, это и на основе JS можно решить, но я в этом не силён, но не стал бы на него полагаться, JS как-никак работает на стороне клиента, а не сервера. А вот если нужно сменить тему «на лету», не перезагружая страницу – тут JS, бесспорно, идеален (само собой, задача с запоминанием выбора гостя остаётся).
Откровенно признаюсь, что как именно будет реализовано описание тем – будь это Bootstrap, чистый CSS или вообще быстрый скачок из WordPress в Bitrix – в контексте вопроса ТС мне представляется несущественным.
https://dev.to/whitep4nth3r/the-best-lightdark-mode-theme-toggle-in-javascript-368f
ты про это пишешь? Если да, то это пользовательские стили и все равно нужен будет js с переключением не класса а data в теге html
Я тебе написал: через JS надо изменять общий класс. А уже в CSS прописываешь свои переменные для каждого класса. Так будет и проще, и правильнее.
Он не плохой, просто примитивный. Я бы заморочился и сделал бы автопереключение темы. Было бы круче, как можно посмотреть в бутстрапе и наваять что-то свое.
Да не мне бы что-то свое, не подключать никакие библиотеки и плагины, скрипты и т.п. Но так добавил пару строк в js файл и css поменять чуть-чуть и все, просто чтобы черное менялось на белое и наоборот хотя бы для текста и фона, что-то вот максимально простое, переменные в css как бы уже некоторые есть, можно ещё подбить под эту тему.