Цвета указываются от тёмного 0 к светлому 3
учите матчасть css переменных
Я о переменных знаю с момента их появления, и это не гениальная идея, для этого они и разработаны, но практически не используются должным образом.
Это вы о себе по ходу :)
Итак, вот что я надумал.
Определяются основные переменные палитры, цвета фона, текста и ссылок соответственно
:root { --canvas0: #цвет; --canvas1: #цвет; --canvas2: #цвет; --canvas3: #цвет; --paint0: #цвет; --paint1: #цвет; --paint2: #цвет; --paint3: #цвет; --link0: #цвет; --link1: #цвет; --link2: #цвет; --link3: #цвет;}
Разработчик при создании компонента не думает о дизайне и цветах, просто указывает переменные, например для основного фона --canvas2 для тёмного блока --canvas0 для светлого блока --canvas3 для текста тёмного блока --paint0 ну и так далее
А когда нужен блок с другими цветами, то подключаем класс с другой палитрой, в которой те же переменные, но с другими значениями цвета. Указываем этот класс в блоке и блок будет выводится в других цветах.
.color1 { --canvas0: #цвет;... --canvas3: #цвет; --paint0: #цвет;... --paint3: #цвет; --link0: #цвет;... --link3: #цвет;}<div class=color1>содержание блока</div>
А может однобуквенные с числом всё таки лучше?
В данном случае, разрабатывается иной подход для движка в котором sass, less применятся не будут.
Это скорее не вопрос наверно, да ответ на самом деле уже озвучен мной. Я при создании темы на 99% был уверен, что никто не сможет ничего толкового ответить.
ЗЫ. Не доросли вы(не вы лично, а все) ещё до моего уровня :)
Вопрос нормальный, ответов не вижу. Если бы у вас соображалка работала, вы подумали и ответили что-то по существу, а не опорожнялись своей мерзостью..
background - длинное слово, я стараюсь делать константы короткими и в то же время понятными по смыслу, иногда сокращаю, иногда ищу слова синонимы по короче.
Иногда достаточно и одной буквы, тут же не будет много разных названий, просто группировка по смыслу назначения для чего будет применятся.
canvas - переводится как полотно, его использую как фон
paint - переводится как краска, его использую для текст, тут можно использовать и "t" от слова text
link - ссылка, а "a" - это тег html для ссылок
Чем короче название(переменной/константы) тем проще её запомнить, и не перепутать с другой, и не делать ошибок при написании, а по одной букве элементарно догадаться/понять её назначение.
так как для фона использовал "c", то для кнопок можно использовать "b"
Никакого выдуманного мира. Оставлять в покое не надо, я за этим тему и создал, может промелькнёт у кого здравая мысль как систематизировать css переменные. Вы вот с открытыми глазами в упор ничего не видите, хотя всё же видно и понятно, удивительно как вы до своих лет дожили с таким рассудком.. А обо мне не беспокойтесь ;)
Цель как раз есть. Я её уже озвучил. Для тех кто в панцире повторю:
Нужно систематизировать или стандартизировать переменные css для цвета, которые разработчики компонентов будут указывать с стилях вместо конкретного цвета.
Думаю можно разделить гамму на цвета фона, текста, ссылок, кнопок так же от тёмного к светлому
от слова canvas - с0, c1, c2, c3 - для фона
от слова paint - p0, p1, p2, p3 - для текста
от слова link - l0, l1, l2, l3 - для ссылок
от слова button - b0, b1, b2, b3 - для кнопок
Есть ещё варианты, буду этот и другие проверять на практике как с разными настройками будет выглядеть страница.
Бред у вас в голове, а я констатирую факты.
Спасибо, насмешили :)
Именно создаются автоматически. Выбирается один цвет и на его основе цветовым кругом подбираются подходящие для гаммы цветов
Вот сервис для получения палитры цветов из картинки https://palettegenerator.com
Это вам насрать, а мне на ваше мнение :)
Моя технология проверена и работает, осталось немного продумать систему для разработчиков как использовать переменные в стилях, давать им названия, или по числу в гамме цвета ориентироваться, и ещё делать ли для фона и текста отдельные переменные. Пока я ещё эти вопросы продумываю.
Поймите, способы вёрстки и стилизацию я не придумываю, препроцессоры мне не нужны так как у меня компонентный подход разработки, это небольшая разметка с небольшой стилизацией. Переменные в css есть и используются. Количество цвета на сайте не должно быть много и эти цвета должны сочетаться между собой, поэтому лучше использовать цветовые гаммы автоматически генерируемые, поэтому достаточно настроить значения переменных в css и указывать их в стилях, это же элементарно.
Препроцессоры css сделали для верстальщиков которые плохо знают css работают в крупных компаниях чтобы быстро наделать всякого г. Согласитесь можно же без препроцессорах делать, МОЖНО. Так зачем они нужны тем кто и без них отлично сделает, к тому же переменные css это тот же препроцессор получается.
ivan-lev, большинство не хотят думать, вернее не умеют, а точнее не привыкли, это для них самый тяжёлый труд. Им проще погуглить, о вон sass, less есть, человек не может разобраться в азах, придумывает велосипед :) а я то умный, я sass использую :) бем применяю когда верстаю блоки, и пофиг что будет куча стилей, с одинаковыми правилами, но разными цветами и тд. и тп. файл стилей в несколько килобайт, это бем :) кто их сейчас считает..
