AN
дизайн-токены 🙂
что это значит?)
Size: a a a
2020 April 14
EW
ну, если сильно просто - css-переменны
EW
хранишь в них значения для десктопа и для тачей
EW
и используешь один и то же модификатор
EW
условно:
AN
Да и так
EW
/* desktop.css */
:root {
--button-size-m: 30px
}
/* touch.css */
:root {
--button-size-m: 40px
}
.Button_size_m {
height: var(--button-size-m);
}
EW
Если у тебя одна верстка, то через media-query переключаешь
2020 April 15
AN
а то есть это на уровне дизайна нужно договариваться?
EW
ну… не обязательно)
MK
.theme_size_default-adaptive {
/* Размер текста */
--size-typo-xs: 11px;
--size-typo-s: 13px;
--size-typo-m: 15px;
--size-typo-l: 18px;
--size-typo-xl: 20px;
--size-typo-xxl: 24px;
--size-typo-xxxl: 32px;
--size-typo-xxxxl: 40px;
/* Межстрочный интервал */
--line-height-typo-xs: 15px;
--line-height-typo-s: 18px;
--line-height-typo-m: 21px;
--line-height-typo-l: 25px;
--line-height-typo-xl: 28px;
--line-height-typo-xxl: 34px;
--line-height-typo-xxxl: 38px;
--line-height-typo-xxxxl: 48px;
@media all and (max-width: $screen-m) {
/* Размер текста */
--size-typo-xs: 11px;
--size-typo-s: 13px;
--size-typo-m: 15px;
--size-typo-l: 16px;
--size-typo-xl: 18px;
--size-typo-xxl: 20px;
--size-typo-xxxl: 24px;
--size-typo-xxxxl: 32px;
/* Межстрочный интервал */
--line-height-typo-xs: 15px;
--line-height-typo-s: 18px;
--line-height-typo-m: 21px;
--line-height-typo-l: 22px;
--line-height-typo-xl: 25px;
--line-height-typo-xxl: 28px;
--line-height-typo-xxxl: 34px;
--line-height-typo-xxxxl: 38px;
}
}Пример изменения значения размера типографики в зависимости от медиа-запроса (используем такую практику в интерфейсах сервисов Яндекс.Денег)
AN
спасибо
ЕН
кто-нибудь может помочь с .net+bem?, попробовал подключить сборку System.Web.Bem - подсмотрел пример на Я.Субботник, вылетает с ошибкой "выход из команды "powershell node_modules\.bin\enb make --dir Bem" с кодом 1."
Может кто-нибудь подружил эти 2 технологии? подскажите как ?
Может кто-нибудь подружил эти 2 технологии? подскажите как ?
DA
я пробовал, напиши подробности мне в личку, пожалуйста
2020 April 16
S
Привет ребята.
Имеется блоки с изображениями, вот их структура.
Пожалуйста, подскажите как сделать hover как на скрине, у меня имеется иконка, как мне сделать, чтобы при наводе было затемнее и выводилась иконка. ПОжалуйста помогите.
Имеется блоки с изображениями, вот их структура.
Пожалуйста, подскажите как сделать hover как на скрине, у меня имеется иконка, как мне сделать, чтобы при наводе было затемнее и выводилась иконка. ПОжалуйста помогите.
<div class="row show-filepond-files">
<div class="col-lg-2 col-md-4 col-4 filepond-files show">
<div class="filepond images">
<a target="_blank">
<img src="">
</a>
</div>
<span class="file-name">Screens...png</span>
</div>
</div>
EW
На каком скрине?)
S
S
вот
ЕМ
Я обычно использую ещё один блок, при наведение опасити в 1