Фоновое изображение Susy 2 Show-Grid не найдено

У меня возникли проблемы с попыткой показать сетку отладки из susy 2.

на основе этого образца:

http://sassmeister.com/gist/9533822

я использую

body
{
 @include container(show);

}

но что такое возврат инструмента разработчика:

https://www.dropbox.com/s/pskhjvwd631jux6/Screenshot%202014-08-24%2015.31.37.png?dl=0

SVG Grid не существует

Я начинаю думать о своей конфигурации gulp:

    // Include gulp
var gulp   = require('gulp'),

// Include Our Plugins
sass       = require('gulp-ruby-sass'),
compass    = require('gulp-compass'),
prefix     = require('gulp-autoprefixer'),
minifycss  = require('gulp-minify-css'),
jshint     = require('gulp-jshint'),
uglify     = require('gulp-uglify'),
imagemin   = require('gulp-imagemin'),
rename     = require('gulp-rename'),
rimraf     = require('gulp-rimraf'),
concat     = require('gulp-concat'),
notify     = require('gulp-notify'),
cache      = require('gulp-cache'),
plumber    = require('gulp-plumber');
livereload = require('gulp-livereload');

//Sass
gulp.task('styles', function() {
  return gulp.src('_scss/*.scss')
  .pipe(plumber())
  .pipe(compass({
        // Compass settings that would otherwise go in config.rb
        sass: '_scss',
        css: 'resources/css',
        image: 'resources/img',
        //environment: 'production',
        //environment: 'development',
        style: 'expanded',
        relative: true,
        //noLineComments: true
        require: ['susy', 'breakpoint']
      }))
  .pipe(prefix({ cascade: true }))
  .pipe(gulp.dest('resources/css'))
  .pipe(rename({suffix: '.min'}))
  .pipe(minifycss())
  .pipe(gulp.dest('resources/css'))
  .pipe(notify({ message: 'Styles task complete' }));
});

// Concatenate & Minify JS
gulp.task('pluginsjs', function() {
  return gulp.src(['_coffeescript/_plugins.js'])
  .pipe(plumber())
  .pipe(gulp.dest('resources/js'))
  .pipe(rename({basename:'plugins', suffix: '.min'}))
  .pipe(gulp.dest('resources/js'))
  .pipe(notify({ message: 'Plugins javascript task complete' }));
});

gulp.task('mainjs', function() {
  return gulp.src(['_coffeescript/_main.js'])
  .pipe(jshint())
  .pipe(jshint.reporter('default'))
  .pipe(plumber())
  .pipe(gulp.dest('resources/js'))
  .pipe(rename({basename:'main',suffix: '.min'}))
  .pipe(uglify())
  .pipe(gulp.dest('resources/js'))
  .pipe(notify({ message: 'Main javascript task complete' }));
});

// Optimize Images
gulp.task('images', function() {
  return gulp.src('_img/**')
  .pipe(plumber())
  .pipe(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))
  .pipe(gulp.dest('resources/img'))
  .pipe(notify({ message: 'Images task complete' }));
});

//Clean everything
gulp.task('rimraf', function() {
  return gulp.src(['resources/css', 'resources/js', 'resources/img'], {read: false})
  .pipe(rimraf());
});

gulp.task('watch', function() {

  // Watch .scss files
  gulp.watch('_scss/*.scss', ['styles']);

  // Watch .js files
  gulp.watch('_coffeescript/*.js', ['pluginsjs','mainjs']);

  // Watch image files
  gulp.watch('_img/**', ['images']);


  //Create LiveReload server
  var server = livereload();

  //Watch any files in dist/, reload on change
  gulp.watch(['dist + /**']).on('change', function(file) {
   server.changed(file.path);
 });

});

gulp.task('default', ['rimraf'], function() {
  gulp.start(['styles', 'pluginsjs', 'mainjs', 'images', 'watch']);
});

Но я деактивирую imagemin или что-то еще, что может повлиять, и всегда одно и то же... :(

Что бы это могло быть?

Благодарность


person Locke    schedule 24.08.2014    source источник


Ответы (1)


Похоже, у вас есть другое изображение, перекрывающее фон Susy. Попробуйте использовать опцию overlay:

body
{
  @include container(show overlay);
}
person Miriam Suzanne    schedule 30.08.2014