Feature/project cleanup

Gruntfile.js

@@ -4,57 +4,79 @@ module.exports = function(grunt) {
 
     sass: {
       options: {
-        includePaths: ['bower_components/foundation/scss']
+        // If you can't get source maps to work, run the following command in your terminal:
+        // $ sass scss/foundation.scss:css/foundation.css --sourcemap
+        // (see this link for details: http://thesassway.com/intermediate/using-source-maps-with-sass )
+        sourceMap: true
       },
+
       dist: {
         options: {
           outputStyle: 'compressed'
         },
         files: {
-          'css/app.css': 'scss/app.scss'
-        }        
+          'css/foundation.css': 'scss/foundation.scss'
+        }
       }
     },
 
     copy: {
       scripts: {
         expand: true,
-        cwd: 'bower_components/',
-        src: '**/*.js',
-        dest: 'js'
+        cwd: 'bower_components/foundation/js/vendor/',
+        src: '**',
+        flatten: 'true',
+        dest: 'js/vendor/'
       },
 
-      maps: {
-        expand: true,
-        cwd: 'bower_components/',
-        src: '**/*.map',
-        dest: 'js'
-      }
     },
 
+    concat: {
+        options: {
+          separator: ';',
+        },
+        dist: {
+          src: [
+
+          // Foundation core
+          'bower_components/foundation/js/foundation/foundation.js',
+
+          // Pick the componenets you need in your project
+          'bower_components/foundation/js/foundation/foundation.abide.js',
+          'bower_components/foundation/js/foundation/foundation.accordion.js',
+          'bower_components/foundation/js/foundation/foundation.alert.js',
+          'bower_components/foundation/js/foundation/foundation.clearing.js',
+          'bower_components/foundation/js/foundation/foundation.dropdown.js',
+          'bower_components/foundation/js/foundation/foundation.equalizer.js',
+          'bower_components/foundation/js/foundation/foundation.interchange.js',
+          'bower_components/foundation/js/foundation/foundation.joyride.js',
+          'bower_components/foundation/js/foundation/foundation.magellan.js',
+          'bower_components/foundation/js/foundation/foundation.offcanvas.js',
+          'bower_components/foundation/js/foundation/foundation.orbit.js',
+          'bower_components/foundation/js/foundation/foundation.reveal.js',
+          'bower_components/foundation/js/foundation/foundation.slider.js',
+          'bower_components/foundation/js/foundation/foundation.tab.js',
+          'bower_components/foundation/js/foundation/foundation.tooltip.js',
+          'bower_components/foundation/js/foundation/foundation.topbar.js',
+
+          // Using all of your custom js files
+          'js/custom/*.js'
+
+          ],
+          // Concat all the files above into one single file
+          dest: 'js/foundation.js',
+        },
+      },
+
     uglify: {
       dist: {
         files: {
-          'js/modernizr/modernizr.min.js': ['js/modernizr/modernizr.js']
+          // Shrink the file size by removing spaces
+          'js/foundation.js': ['js/foundation.js']
         }
       }
     },
 
-    concat: {
-      options: {
-        separator: ';'
-      },
-      dist: {
-        src: [
-          'js/foundation/js/foundation.min.js',
-          'js/custom/*.js'
-        ],
-
-        dest: 'js/app.js'
-      }
-
-    },
-
     watch: {
       grunt: { files: ['Gruntfile.js'] },
 
@@ -71,6 +93,6 @@ module.exports = function(grunt) {
   grunt.loadNpmTasks('grunt-contrib-copy');
   grunt.loadNpmTasks('grunt-contrib-uglify');
 
-  grunt.registerTask('build', ['sass', 'copy', 'uglify', 'concat']);
+  grunt.registerTask('build', ['sass', 'copy', 'concat', 'uglify']);
   grunt.registerTask('default', ['watch']);
-}
+};

README.md

@@ -38,7 +38,7 @@ Tip: If you get an error saying Permission denied (publickey) when cloning the r
 
 While you're working on your project, run:
 
-`grunt`
+`grunt watch`
 
 And you're set!
 
@@ -50,22 +50,23 @@ Check for Foundation Updates? Run:
 
   * `style.css`: Do not worry about this file. (For some reason) it's required by WordPress. All styling are handled in the Sass files described below
 
-  * `scss/app.scss`: Sass imports for global config, foundation and site structure
-
-  * `scss/config/_variables.scss`: Your custom variables
-  * `scss/config/_colors.scss`: Your custom color scheme
+  * `scss/foundation.scss`: Imports for Foundation components and your custom styles.
   * `scss/config/_settings.scss`: Original Foundation 5 base settings
+  * `scss/assets/_icons.scss`: Foundation Icons
+  * `scss/site/_base.scss`: Basic styles for FoundationPress. These can be replaced by your needs.
 
-  * `scss/site/_structure`: Your custom site structure
-
-  * `css/app.css`: All Sass files are minified and compiled to this file
+  * `css/foundation.css`: All Sass files are minified and compiled to this file
+  * `css/foundation.css.map`: CSS source maps
 
 ### Script Folder Strucutre
 
-  * `bower_components/`: This is the source folder where all Foundation scripts are located. `foundation update` will check and update scripts in this folder
-  * `js/custom`: This is where you put all your custom scripts. Every .js file you put in this directory will be minified and concatinated to [app.js](https://github.com/olefredrik/FoundationPress/blob/master/js/app.js)
-  * `js/`: jQuery, Modernizr and Foundation scripts are copied from `bower_components/` to this directory, where they are minified and concatinated and enqueued in WordPress
-  * Please note that you must run `grunt` in your terminal for the scripts to be copied. See [Gruntfile.js](https://github.com/olefredrik/FoundationPress/blob/master/Gruntfile.js) for details
+  * `bower_components/`: This is the source folder where all Foundation components are located. `foundation update` will check and update scripts in this folder.
+
+  * `js/custom`: This is where you put all your custom scripts. Every .js file you put in this directory will be minified and concatinated to [foundation.js](https://github.com/olefredrik/FoundationPress/blob/master/js/foundation.js)
+
+  * `js/vendor`: Vendor scripts are copied from `bower_components/` to this directory. We use this path for enqueing the vendor scripts in WordPress.
+
+  * Please note that you must run `grunt build` in your terminal for the script to be copied and concatinated. See [Gruntfile.js](https://github.com/olefredrik/FoundationPress/blob/master/Gruntfile.js) for details
 
 ## Demo
 

header.php

@@ -21,7 +21,7 @@
 			echo wp_title( ' | ', 'false', 'right' ); bloginfo( 'name' );
 		} ?></title>
 
-		<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri() ; ?>/css/app.css" />
+		<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri() ; ?>/css/foundation.css" />
 
 		<link rel="icon" href="<?php echo get_stylesheet_directory_uri() ; ?>/assets/img/icons/favicon.ico" type="image/x-icon">
 		<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<?php echo get_stylesheet_directory_uri() ; ?>/assets/img/icons/apple-touch-icon-144x144-precomposed.png">