Menu icon Foundation
F5 and alternate directory organization ?

Because we are modx fans, and we love the Foundation framework, we have decided a year ago to base our new developpments on these two bricks

We are running sass and compass to manage our CSS customizations, and because we want a smooth workflow, we customized the path to output directories with SASS to be consistent with our server organization. Our config.rb looks like :

require 'zurb-foundation'
# Require any additional compass plugins here.

http_path = "/"
css_dir = "assets/templates/css"
sass_dir = "scss"
images_dir = "assets/templates/images"
javascripts_dir = "assets/templates/js"

# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed

relative_assets = true

# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false

We now want to move using grunt, but we have a clue on how to to similar modification.

We feel we are not the only one to seek for such information, also a little more documentation would be helpfull for all .

Thanks.

F5PathDirectoryCustomizationModxGruntcompass

Because we are modx fans, and we love the Foundation framework, we have decided a year ago to base our new developpments on these two bricks

We are running sass and compass to manage our CSS customizations, and because we want a smooth workflow, we customized the path to output directories with SASS to be consistent with our server organization. Our config.rb looks like :

require 'zurb-foundation'
# Require any additional compass plugins here.

http_path = "/"
css_dir = "assets/templates/css"
sass_dir = "scss"
images_dir = "assets/templates/images"
javascripts_dir = "assets/templates/js"

# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed

relative_assets = true

# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false

We now want to move using grunt, but we have a clue on how to to similar modification.

We feel we are not the only one to seek for such information, also a little more documentation would be helpfull for all .

Thanks.

Philippe Delberghe / AmaZili over 5 years ago

Because we are modx fans, and we love the Foundation framework, we have decided a year ago to base our new developpments on these two bricks We are running sass and compass to manage our CSS customizations, and because we want a smooth workflow, we customized the path to output directories with SASS to be consistent with our server organization. Our config.rb looks like :

require 'zurb-foundation' 
# Require any additional compass plugins here. 
http_path = "/" 
css_dir = "assets/templates/css" 
sass_dir = "scss" 
images_dir = "assets/templates/images" 
javascripts_dir = "assets/templates/js" 
# You can select your preferred output style here (can be overridden via the command line): 
# output_style = :expanded or :nested or :compact or :compressed 
relative_assets = true 
# To disable debugging comments that display the original location of your selectors. Uncomment: 
# line_comments = false 

We now want to move using grunt, but we have a clue on how to to similar modification. We feel we are not the only one to seek for such information, also a little more documentation would be helpfull for all .
Thanks.

Philippe Delberghe / AmaZili almost 5 years ago

We finally finished our project using compass.

As we are starting new projects based on foundation with rev 5, we started to look again in the grunt files, and found that in order to get our css files to the right path for our modx projects, we should amend Gruntfile.js from :

pkg: grunt.file.readJSON('package.json'),

sass: {
  options: {
    includePaths: ['bower_components/foundation/scss']
  },
  dist: {
    options: {
      outputStyle: 'expanded'

    },
    files: {
      'css/app.css': 'scss/app.scss'
    }        
  }
},

to :

pkg: grunt.file.readJSON('package.json'),

sass: {
  options: {
    includePaths: ['bower_components/foundation/scss']
  },
  dist: {
    options: {
      outputStyle: 'expanded'

    },
    files: {
      'assets/templates/css/app.css': 'scss/app.scss'
    }        
  }
},

We still have questions pending like how to we enable the debug information we used to have from compass sass compilation with our :

comment = true config.rb directive ?

Hope some help from the team, should I ?

Thanks