Плавающая точка нормально интерпретируется Less для процентных значений, для сдвига по шкале, видимо, дробить нет необходимости… что, в общем, очевидно.
Положил в issue подтверждение
Всех благ! С нетерпением ждем новой версии вашей замечательной утилиты!
Доброго дня, (garex, и Metaller) Низкий поклон от меня лично и от коллег! Сэкономили время многих и многих!
Однако хотелось бы обратить внимание всех заинтересованных Lessoводов на одну особенность — как оказалось в природе существуют цвето-зависимости, выходящие за рамки описания Less-переменными. Некие исключения, в рамках которых невозможно имея базовый цвет найти второй.
В качестве примера (чтобы было более понятно о чем речь) приведу 2 стандартных цвета bootstrap — brand-primary: #428bca; и brand-success: #5cb85c; Давайте возьмем первый за базовый, а второй попробуем описать при помощи Less.
Что получилось у меня в итоге (1) с использованием утилиты и (2) без нее:
Утилитой — @brand-success!: spin(desaturate(lighten @brand-primary 1%), 17%), -88); В итоге утилитой мы получаем цвет, сдвинутый на 1% по тоновой шкале и на 1% темнее, чем нужно.
Метод подбора с использованием фотошопа тоже не дал 100%-но нужно цвета, но уже лучше — удалось подобрать цвет ближе к оригинальному — 100% соответствие по тоновой шкале (на мой взгляд, самый критичный параметр), расхождение только в насыщенности — она больше на 1%.
Погрешность минимальна и вряд ли приведет к каким-то артефактам (разве что если вам необходимо будет прилепить картинку однотонную с цветом фона, например), но факт остается фактом — получаемый цвет не на 100% соответствует нужному. Подозреваю, что дело в большом Less-шаге (%) saturate/desaturate, darken/lighten. Тут, возможно, автор более подкован и прояснит ситуацию с математической точки зрения?
SerDIDG, премного благодарен! … интересует именно использование общенастроенного стиля форм, то о чем Вы говорили ранее! Решение пока не перекрывает минусы, но это еще один несомненный плюс в копилку достоинств LESS.
Надеюсь когда-нибудь по-настоящему оценю всю прелесть препроцессоров вообще и LESS в частности! Большое человеческое спасибо и Всех благ!
SerDIDG, конечно, речь не только о цвете. Согласен, что в случае «поменять всю схему» это удобно! Но как быть в случае, если нужны изменения одного элемента, которые не вписываются в рамки автоизменений? Ведь, наверняка, Вы согласитесь со мной, что мелкие изменения производятся уж никак не реже общего ребрендинга (пусть даже одной формы, пусть даже и с настроенными общими схемами отступов и высот инпутов), а уж особенно на стадии становления проекта.
SerDIDG, будьте любезны, код в студию! Буду признателен за возможность до конца открыть less для себя как полезный инструмент!
Есть такое дело! Но зачем менять всю цветовую схему, так ради баловства: сегодня хочется чтобы был красный, а завтра зеленый? Насколько часто Вам приходилось менять цветовые схемы одного проекта?
Да, dobriykot, вы все правильно поняли. Вы привели пример одной переменной, поэтому не так явно видны потери во времени. Часто для того чтобы получить всего лишь это:
а {
color: #66c2ff;
}
существуют конструкции вида:
/* стиль: */
а {
color: @baseLighterLink;
}
/* один файл: */
@baseLighterLink: lighten(@baseLighterColor, 15%);
/* второй файл: */
@baseLighterColor: lighten(@baseColor, 5%);
/* третий: */
@baseColor: #0099FF;
… и это не самая длинная цепочка!
Встречаются и подобные конструкции:
@baseColor: @baseGreenColor;
Возникнет вопрос: чем может быть оправдано столь серьезное затягивание такого примитивного действия, как замена единственного стиля единственного конкретного элемента?
Открываю описание в поисках скрытых возможностей и полезностей: "… позволяет сделать CSS более поддерживаемым, тематизируемым..." – хорошо, это беспорно полезно! Но тематизирование можно легко сделать и в самом CSS.
Имеет смысл движение в 2-х направлениях:
улучшения качества продукта: скорость загрузки / работы, удобство и дружественность по отношению к пользователю;
удобство для разработчика – ускоряет процесс разработки, а значит снижает себестоимость продукта.
Поскольку
То есть, в конечном итоге, less все-таки призван облегчить жизнь разработчика и ускорить процесс, не так ли?
Берем конкретный пример: сократить время на добавление все тех же вендорных свойств transition, box-shadow, border-radius и т.п.
Но ответьте, пожалуйста, мне на вопрос: для чего объявлять переменную (или класс) – создавать дополнительный элемент (а ведь на создание его тоже уходит время), чтобы потом добавить одну строку вместо огромных кусков, если набрав пару символов + Tab в Emmet мы делаем ту же операцию в реальном времени без всяких переменных, вложенностей и миксинов.
Согласен полностью! Но просто попробуйте в уже существующем проекте сравнить сколько у вас уйдет времени (в секундах) на изменение конечного отдельного элемента если переменных и подключаемых less-файлов несколько и подход: браузер -> номер строки CSS = всего лишь 2 действия («найти и изменить»)
Ни разу не видил человека, что бы взглянув на цвет он выдавал бы его точный хекс код
Ну, не знаю… в моей памяти около 15 цветов +-, вполне ими обхожусь! border-color: lighten(@base, 30%);
— когда уж совсем лень! Но лень, как известно, двигатель прогресса )))))))))))))))))
начинал с верстки… а между тем это одна из самых творческих профессий! Вот не писал я про «на помойку», это уже твои слова… говорил только о своей практике: а каждый увидел то что хотел видеть в этом!
Ожидал-ожидал! )) Ну, не леденец, ну не сахарный, чтоб всем нравиться! + как раз люблю всех людей (за редким исключением, за их, в первую очередь, непосредственность), даже тех, кто не разобрался в вопросе о том, что кто-то разобрался в вопросе или нет )) И мнение мое вовсе не безапелляционное, скорее наоборот – пытаюсь привести мир к равновесию, пониманию того, что все относительно и категоричным быть не стоит ))))))))))))))))))) расширить, так сказать, заорганизованные ряды и оградить ищущих…
неплохая и полезная примесь, сам подобное использую, но как все примеси LESS – это всего-навсего CSS… удобно добавлять в нужном месте – есть у LESS плюсы, иначе он бы не существовал вовсе, но есть и минусы – о которых в общем и пост )).
О! Спасибо, дорогой!
Не могу сказать обратного, что Google-инженеры доросли до свободного широкого взгляда дизайнеров, но достоинств не умоляю! )) «Отзывчивость LESS» само по себе странное заявление!
Реакция зала понятна и вполне ожидаема. )) Пользователи языка лягут грудью на амбразуру, а для НЕпользователей все в фиолетовом цвете.
Не буду скрывать, я люблю LESS за те возможности, которые он предлагает!
Прям люблю беззаветной любовью! Верите? )) Поверьте — это так!
+ Понимаю архитекторов проектов, которые, решая каждодневные задачи мирового масштаба (здесь я не шучу), как воздух хватают «вкусные печеньки», хоть как-то облегчающие процесс интеграции и взаимосвязи.
Но говоря откровенно, мотивацией к написанию сего чтива послужило именно то, что я очень неравнодушен к разного рода полезностям, шагам в сторону прогресса, стараюсь четко для себя определить применимость и вообще необходимость существования того или иного человеческого изобретения.
))))))))))))))))))))))))))))))))))))
Поэтому прошу каждого: взвесьте все за и против, 7 раз отмерьте — один раз отрежьте, не идите на поводу собственных предпочтений в крупных проектах, в которых участвует не один десяток разработчиков. А если Вы свободны верстальщик — то изучайте LESS, SASS, SCSS — лишним не будет…
Ибо эргономика — наше все! Не забывайте об этом, друзья!
Ну, и, конечно, НЕ ЗАБЫВАЕМ — молимся богу по имени LESS!
Плавающая точка нормально интерпретируется Less для процентных значений, для сдвига по шкале, видимо, дробить нет необходимости… что, в общем, очевидно.
Положил в issue подтверждение
Всех благ!
С нетерпением ждем новой версии вашей замечательной утилиты!
Должен получится такой цвет:
Получили и в первом и во втором случае самый близкий цвет, стремящийся к #5cb85c:
Низкий поклон от меня лично и от коллег! Сэкономили время многих и многих!
Однако хотелось бы обратить внимание всех заинтересованных Lessoводов на одну особенность — как оказалось в природе существуют цвето-зависимости, выходящие за рамки описания Less-переменными. Некие исключения, в рамках которых невозможно имея базовый цвет найти второй.
В качестве примера (чтобы было более понятно о чем речь) приведу 2 стандартных цвета bootstrap — brand-primary: #428bca; и brand-success: #5cb85c; Давайте возьмем первый за базовый, а второй попробуем описать при помощи Less.
Что получилось у меня в итоге (1) с использованием утилиты и (2) без нее:
Надеюсь когда-нибудь по-настоящему оценю всю прелесть препроцессоров вообще и LESS в частности!
Большое человеческое спасибо и Всех благ!
SerDIDG, будьте любезны, код в студию! Буду признателен за возможность до конца открыть less для себя как полезный инструмент!
существуют конструкции вида:
… и это не самая длинная цепочка!
Встречаются и подобные конструкции:
Возникнет вопрос: чем может быть оправдано столь серьезное затягивание такого примитивного действия, как замена единственного стиля единственного конкретного элемента?
Открываю описание в поисках скрытых возможностей и полезностей: "… позволяет сделать CSS более поддерживаемым, тематизируемым..." – хорошо, это беспорно полезно! Но тематизирование можно легко сделать и в самом CSS.
Имеет смысл движение в 2-х направлениях:
Поскольку
То есть, в конечном итоге, less все-таки призван облегчить жизнь разработчика и ускорить процесс, не так ли?
Берем конкретный пример: сократить время на добавление все тех же вендорных свойств transition, box-shadow, border-radius и т.п.
Но ответьте, пожалуйста, мне на вопрос: для чего объявлять переменную (или класс) – создавать дополнительный элемент (а ведь на создание его тоже уходит время), чтобы потом добавить одну строку вместо огромных кусков, если набрав пару символов + Tab в Emmet мы делаем ту же операцию в реальном времени без всяких переменных, вложенностей и миксинов.
кто говорил о проблеме компиляции? выход = сss, об этом речь…
Ну, не знаю… в моей памяти около 15 цветов +-, вполне ими обхожусь!
border-color: lighten(@base, 30%);— когда уж совсем лень! Но лень, как известно, двигатель прогресса )))))))))))))))))
Широкий взгляд на вещи, побольше бы таких! )))
Не могу сказать обратного, что Google-инженеры доросли до свободного широкого взгляда дизайнеров, но достоинств не умоляю! )) «Отзывчивость LESS» само по себе странное заявление!
© неизвестный
Реакция зала понятна и вполне ожидаема. )) Пользователи языка лягут грудью на амбразуру, а для НЕпользователей все в фиолетовом цвете.
Не буду скрывать, я люблю LESS за те возможности, которые он предлагает!
Прям люблю беззаветной любовью! Верите? )) Поверьте — это так!
+ Понимаю архитекторов проектов, которые, решая каждодневные задачи мирового масштаба (здесь я не шучу), как воздух хватают «вкусные печеньки», хоть как-то облегчающие процесс интеграции и взаимосвязи.
Но говоря откровенно, мотивацией к написанию сего чтива послужило именно то, что я очень неравнодушен к разного рода полезностям, шагам в сторону прогресса, стараюсь четко для себя определить применимость и вообще необходимость существования того или иного человеческого изобретения.
))))))))))))))))))))))))))))))))))))
Поэтому прошу каждого: взвесьте все за и против, 7 раз отмерьте — один раз отрежьте, не идите на поводу собственных предпочтений в крупных проектах, в которых участвует не один десяток разработчиков. А если Вы свободны верстальщик — то изучайте LESS, SASS, SCSS — лишним не будет…
Ибо эргономика — наше все! Не забывайте об этом, друзья!
Ну, и, конечно, НЕ ЗАБЫВАЕМ — молимся богу по имени LESS!