nickolyashka
@nickolyashka

Bootstrap classы сетки убрать в data-attribute, нужно ли?

Недавно смотрел семинар на тему использования angular фреймворка у одной хостинговой компании. Они используют подход не писать классы сетки и поведения блоков, а убирать разметку в data-attribute. Хочется что-то подобное сделать для себя, чтобы к примеру убирать классы сетки bootstrap в data-attribute, да и сетку проще будет интегрировать в cms. Может есть у кого какие мысли по этому поводу, или лишняя трата времени? Может кто подскажет насчет вариантов реализации. Хочется привести все это к следующему виду <div data-grid="col-md-3"></div>. Буду благодарен за ваши ответы.
  • Вопрос задан
  • 170 просмотров
Решения вопроса 1
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Бредятина.
Непонятно, как это упростит интеграцию в CMS
Непонятен получаемый профит, кроме удовлетворения своего "хочу"
Зато есть мнение, что селектор атрибута медленнее селектора класса.

А, ну да. Как же всё-таки это сделать? Просто переписать селекторы в сетке:

@mixin make-grid-columns($i: 1, $list: "[data-grid=col-xs-#{$i}], [data-grid=col-sm-#{$i}], [data-grid=col-md-#{$i}], [data-grid=col-lg-#{$i}]") {
  @for $i from (1 + 1) through $grid-columns {
    $list: "#{$list}, [data-grid=col-xs-#{$i}], [data-grid=col-sm-#{$i}], [data-grid=col-md-#{$i}], [data-grid=col-lg-#{$i}]";
  }
  #{$list} {
    position: relative;
    min-height: 1px;
    padding-left:  ceil(($grid-gutter-width / 2));
    padding-right: floor(($grid-gutter-width / 2));
  }
}


ну и остальные миксины аналогично. Пересобираем и пользуемся.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Классы для стилизации, дата-атрибуты для произвольных данных. Не надо мешать одно с другим.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы