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

Question

[Николай]

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

Answer 1

[Сергей delphinpro]

Бредятина.
Непонятно, как это упростит интеграцию в 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));
  }
}

ну и остальные миксины аналогично. Пересобираем и пользуемся.

Answer 2

[Андрей Хохлов]

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

Comments

[Николай]

Но все равно хочется разметку отделить от стилей элементов. Уменьшить кол-во классов в тегах.

[Serj-One]

Николай: Ну так используй миксины.