6 Replies Latest reply on Aug 30, 2015 12:30 AM by adamk49749205

    sass code hinting

    adamk49749205

      Hello Web community,

       

      I am using .SASS files and I would like to know if there is any way for Dreamweaver cc 2014 to "code hint" whilst using these files like it does when you type standard css?

       

      Example of this is:

       

      In css: as you type height it will come up with the code hinter

      .div{

           Height: auto

      }

       

      In sass: its does not when you type height

       

      .div

           height: auto

       

      _____________

      I am using indented sass so the files are .sass not .scss

       

      sass.jpg

        • 1. Re: sass code hinting
          BenPleysier Adobe Community Professional & MVP

          Not sure why you are using the indented code, but I am sure that you are of luck with the current versions of Dreamweaver as far as code hinting is concerned. Code hinting comes into effect after having entered a curly bracket.

           

          If you want to have code hinting for Sass incorporated into Dreamweaver, you could post a suggestion. If there are enough replies, which I doubt, you may have a chance. I use SCSS which gives me the added advantage that I can rename any .css file to .scss.

          • 2. Re: sass code hinting
            adamk49749205 Level 1

            Thanks for the info,

            I use the indented version as it saves having to add curly brackets, and semicolons after each attribute. Just my personal preference. I will have to continue using Sublime text 2 for my .sass files.

            • 3. Re: sass code hinting
              osgood_ Level 8

              adamk49749205 wrote:

               

              Hello Web community,

               

              I am using .SASS files and I would like to know if there is any way for Dreamweaver cc 2014 to "code hint" whilst using these files like it does when you type standard css?

               

              Example of this is:

               

              In css: as you type height it will come up with the code hinter

              .div{

                   Height: auto

              }

               

              In sass: its does not when you type height

               

              .div

                   height: auto

               

              _____________

              I am using indented sass so the files are .sass not .scss

               

              sass.jpg

               

              I don't know why DW engineers are lagging behind in this area - Brackets the FREE FREE FREE Adobe web editor has code hinting for less files (no curly bracket required) so I'm sure it must have for sass.

              • 4. Re: sass code hinting
                BenPleysier Adobe Community Professional & MVP

                osgood_ wrote:

                 

                I don't know why DW engineers are lagging behind in this area - Brackets the FREE FREE FREE Adobe web editor has code hinting for less files (no curly bracket required) so I'm sure it must have for sass.

                 

                FACT:

                In it's native version, Brackets has code hinting for .css and hence also for .less and .scss. However, SASS has two versions, namely

                • .scss which has curly brackets and a semi-colon similar to .css
                • .sass which is indented and has no curly bracket and semi-colon

                 

                Because code hinting is activated (for both Dreamweaver and Brackets) after the insertion of the opening curly bracket, the indented version misses out on code hinting.

                mine.png

                1 person found this helpful
                • 5. Re: sass code hinting
                  osgood_ Level 8

                  Ben Pleysier wrote:

                   

                  osgood_ wrote:

                   

                  I don't know why DW engineers are lagging behind in this area - Brackets the FREE FREE FREE Adobe web editor has code hinting for less files (no curly bracket required) so I'm sure it must have for sass.

                   

                  FACT:

                  In it's native version, Brackets has code hinting for .css and hence also for .less and .scss. However, SASS has two versions, namely

                  • .scss which has curly brackets and a semi-colon similar to .css
                  • .sass which is indented and has no curly bracket and semi-colon

                   

                  Because code hinting is activated (for both Dreamweaver and Brackets) after the insertion of the opening curly bracket, the indented version misses out on code hinting.

                  mine.png

                   

                  You're right. I'm not sure what I was doing yesterday - obviously not focusing hard enough - I'm sure at one stage the code hinting popped up without typing an opening bracket but it sure doesnt when I revisit the issue today.

                  • 6. Re: sass code hinting
                    adamk49749205 Level 1

                    I have found that the best way to do this and use Dreamweaver for all my other coding, is to use Sublime text 2 for the .sass files and then have Dreamweaver auto update the .css document whenever I hit save and koala compiles the .sass to .css.

                     

                    Sublime text 2 has several plugins to support .sass files and to integrate .sass code hinting that you have to install to get it all up and running.

                     

                    This way I can save time and still use dreaweaver for the code hingitn etc in javascript, php .....

                     

                    Thanks for all the info regarding how the code hinting works.

                     

                    If anyone ever gets stuck with this issue feel free to ask for help. took me a few weeks to find the solution.