timfcsm

gulp-newer

если ты хочешь совсем от каскада избавиться, то надо каждому элементу модификатор добавлять... но это уже из области бреда. Если у тебя от модификатора блока зависят стили элементов, то сделать один уровень вложенности - нормальное решение.. класс блока, кстати, можно в переменную сохранить, чтоб в таком случае постоянно не копипастить

learn.javascript.ru/screencast/gulp

уберите хэш, и прикрутите пререндер

$('.foto .fancybox').each(function(){
  var newElem = $('<a>');
  
  newElem.html($(this).html());

  $.each($(this).prop('attributes'), function(){
     newElem.attr(this.name === 'data-link' ? 'href' : this.name, this.value); 
  });

  $(this).replaceWith(newElem);
});

вынести чекбокс наверх codepen.io/timfcsm/pen/qZbOoV

webpack, browserify+commonjs, requirejs... первое посложнее, 2 и 3 проще. но в js всё-таки более-менее разбираться надо, чтобы что-то нормальное получилось

а с чего бы ему срабатывать? оберните в функцию и вызывайте при переключении
как то так
а вообще с этим флексбоксы прекрасно справляются, без всяких говноскриптов