title: How to update css theme file in WordPress
body: <p>I am confused on where to edit WordPress themes. I am new to WordPress and have a custom theme which main <code>style.css</code> file just imports the style for this theme like this:</p>
  
  <pre><code>@import url('assets/stylesheets/app.css');
  </code></pre>
  
  <p>I read that it is recommended to make a new child theme, but I don't see the need for that in my case, since I would like to almost completely change the css of the theme, so there is no need to keep the original theme files. Since, I tried to modify the file <code>'assets/stylesheets/app.css'</code> I couldn't see any changes in the browser. Can I edit the styles there, or I need to do it in the <code>WP admin dashboard</code> somewhere?
  I would like to build my scripts with gulp, which I set up like this:</p>
  
  <pre><code>var gulp          = require('gulp');
  var sass          = require('gulp-sass');
  var include       = require('gulp-include');
  var watch         = require('gulp-watch');
  var batch         = require('gulp-batch');
  var sourcemaps    = require('gulp-sourcemaps');
  var prefix        = require('gulp-autoprefixer');
  var connect       = require('gulp-connect');
  var browserify    = require('gulp-browserify');
  var livereload    = require('gulp-livereload');
  var browsersync   = require('browser-sync');
  
  var config = {
    srcDir: './assets',
    styles: {
      src: '/scss/app.scss',
      dest: '/stylesheets',
      includePaths: [
        'node_modules/foundation-sites/scss'
      ],
      prefix: ["last 2 versions", "&gt; 1%", "ie 9"]
    },
    scripts: {
      src: '/js/app.js',
      dest: '/js'
    },
    img: {
      src: '/images/**/*',
      dest: '/images'
    }
  };
  
  var srcDir = './src',
      destDir = './build';
  
  gulp.task('styles', function() {
    return gulp.src(config.srcDir + config.styles.src)
      .pipe(sourcemaps.init())
      .pipe(sass({
        includePaths: config.styles.includePaths,
        sourceMap: true,
        outFile: config.srcDir + config.styles.dest + '/app.css',
        outputStyle: 'compressed'
      }))
      .pipe(prefix(config.styles.prefix))
      .pipe(sourcemaps.write())
      .on('error', sass.logError)
      .pipe(gulp.dest(config.srcDir + config.styles.dest))
      .pipe(browsersync.reload({ stream: true }));
  });
  
  gulp.task('scripts', function() {
    gulp.src(config.srcDir + config.scripts.src)
        .pipe(browserify({
          insertGlobals : true,
          debug : !gulp.env.production
        }))
        .pipe(gulp.dest(config.srcDir + config.scripts.dest))
  });
  
  gulp.task('include', function() {
    return gulp.src(config.srcDir + config.img.src)
      .pipe(gulp.dest(config.srcDir + config.img.dest));
  });
  
  gulp.task('watch', function () {
      // Watch .scss files
      gulp.watch(config.srcDir + config.styles.src, ['styles']);
  
      // Watch .js files
      gulp.watch(config.srcDir + config.scripts.src, ['scripts']);
  });
  
  gulp.task('default', ['styles', 'scripts', 'watch']);
  </code></pre>
  
  <p>So, not sure how can I do it utilizing gulp. Where can I change the theme without creating the child theme?</p>