Register
Login
YOUR CART IS EMPTY

Issue with compiling &-class when in the created sass folder.

Boy does time fly!

This thread looks to be a little on the old side and therefore may no longer be relevant. Please see if there is a newer thread on the subject and ensure you're using the most recent build of any software if your question regards a particular product.

This thread has been locked

This thread has been locked and is no longer accepting new posts, if you have a question regarding this topic please email us at support@mindscape.co.nz

mark_thibault
1 post

Hi,

I am having an issue with compiling a nested &-className. The compiling works fine if scss files are outside of the created sass folder and just creates a nested child css file. I tried uninstalling and reinstalling both Web Essentials and WW, as well as deleting the Local\Temp\Mindscape folder. I am current running WW v3.3.1608.

The below error comes up with trying to compile as well as a "Web Workbench created output files in the following directories which are not part of the project: * Please include these folders to the project using Show Hidden Files and Include In Project;" which does not appear when I compile without the partial with the &-className.

Please let me know if there is a fix for this.

Thanks, Mark

.btn {
    border: none;
    border-radius: 4px;
    position: relative;
    letter-spacing: 0.1em;
    font-family: $font-family-accent;
    text-shadow: none;

    &-flat {
        background: $orange;
        box-shadow: 0 3px $cinnabar-orange;
        color: $white;
        font-size: 1.1em;
        padding: 8px 10px 8px 10px;

        &:hover {
            top: -1px;
            box-shadow: 0 4px $cinnabar-orange;
            color: $white;
            background: $orange;
        }

        &:active {
            box-shadow: 0 0 #e65725;
            top: 3px;
        }
    }

    &-ghost {
        background-color: transparent;
        box-shadow: none;
        border: 2px solid $orange;
        color: $orange;
        font-size: 1.2em;
        transition: all 0.2s ease-in-out;

        &:hover {
            background-color: $orange;
            color: $white;
        }

        &:active, &:focus {
            color: $white;
            outline: none;
        }

        &:visited, &:focus {
            color: $orange;
        }
    }

    &-xs {
        padding: 1px 5px;
    }

    &-sm {
        padding: 5px 10px;
    }
}

Syntax error: Invalid CSS after "&": expected "{", was "-flat {"

          "-flat" may only be used at the beginning of a compound selector.
    on line 9 of C:/Users/mathibault/Desktop/StyleGuide/StyleGuide/sass/components/_buttons.scss
    from line 3 of C:/Users/mathibault/Desktop/StyleGuide/StyleGuide/sass/components/_components.scss
    from line 40 of C:/Users/mathibault/Desktop/StyleGuide/StyleGuide/sass/gp-styles.scss

Backtrace:
C:/Users/mathibault/Desktop/StyleGuide/StyleGuide/sass/components/_buttons.scss:9
C:/Users/mathibault/Desktop/StyleGuide/StyleGuide/sass/components/_components.scss:3
C:/Users/mathibault/Desktop/StyleGuide/StyleGuide/sass/gp-styles.scss:40
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:1149:in `expected'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:1085:in `expected'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:692:in `block in simple_selector_sequence'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:1095:in `throw_error'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:692:in `simple_selector_sequence'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:640:in `_selector'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:619:in `selector'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:603:in `selector_sequence'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:528:in `ruleset'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:591:in `block in declaration_or_ruleset'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:1105:in `block in catch_error'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:1105:in `catch'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:1105:in `catch_error'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:591:in `declaration_or_ruleset'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:554:in `block_child'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:546:in `block_contents'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:535:in `block'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:529:in `ruleset'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:553:in `block_child'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:543:in `block_contents'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:82:in `stylesheet'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/scss/parser.rb:27:in `parse'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/engine.rb:342:in `_to_tree'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/engine.rb:274:in `to_tree'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:225:in `visit_import'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:37:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:100:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:227:in `block in visit_import'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:227:in `map'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:227:in `visit_import'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:37:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:100:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:53:in `map'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:53:in `visit_children'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:109:in `block in visit_children'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:121:in `with_environment'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:108:in `visit_children'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:37:in `block in visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:128:in `visit_root'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/base.rb:37:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:100:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/visitors/perform.rb:7:in `visit'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/tree/root_node.rb:20:in `render'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/engine.rb:315:in `_render'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/sass-3.2.19/lib/sass/engine.rb:262:in `render'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:139:in `block (2 levels) in compile'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:126:in `timed'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:138:in `block in compile'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/logger.rb:45:in `red'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:137:in `compile'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:118:in `compile_if_required'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:103:in `block (2 levels) in run'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:101:in `each'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:101:in `block in run'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:126:in `timed'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/compiler.rb:100:in `run'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/commands/update_project.rb:45:in `perform'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/commands/base.rb:18:in `execute'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/commands/project_base.rb:19:in `execute'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/exec/sub_command_ui.rb:43:in `perform!'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/lib/compass/exec/sub_command_ui.rb:15:in `run!'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/bin/compass:30:in `block in <top (required)>'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/bin/compass:44:in `call'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/lib/ruby/gems/1.9.1/gems/compass-0.12.6/bin/compass:44:in `<top (required)>'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/bin/compass:19:in `load'
C:/Users/mathibault/AppData/Local/Temp/Mindscape/WebWorkbench/Ruby193/Ruby193/bin/compass:19:in `<main>'

Posted on Sep 04 2014

jeremy 3,400 posts	You are using syntax from Sass 3.3 but the underlying Compass version that is installed (0.12) relies on Sass 3.2 so the syntax is not valid. We will be putting out a new release soon which updates Sass to 3.4.2 and Compass to 1.0.1 where this syntax will be supported. Jeremy Posted on Sep 05 2014

Issue with compiling &-class when in the created sass folder.

Data Products

DevOp Tools

Visual Controls

Popular Products

Quick Links