marvinlabs / notepad-plus-plus-scss-syntax-highlighting

Add some syntax highlighting with the default CSS settings provided by Notepad++

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

We recently started to use SASS / SCSS to code our stylesheets. We were missing some proper syntax highlighting with the default CSS settings provided by Notepad++. After some research, we found a good base on Wouter Beugelsdijk's techblog but we were still not quite happy with it.

How to use

To enable SCSS syntax highlighting:

  • In Notepad++, Go to the Language menu and select User Defined Dialog...
  • On the window that opens click on the Import button and select the XML file from this repository
  • Restart Notepad++, select CSS sintax for your .scss files.
  • That's it, all your files with the .scss extension should now be highlighted

To enable autocomplete:

  • go to your Notepad++ folder then to /plugins/APIs/
  • duplicate the css.xml and rename this file to SCSS-Light.xml or SCSS-Dark.xml

#Our modifications

version 1.0

  • Highlighting for HTML tags
  • Changed some colors
  • Added syntax coloring for important comments starting with /*! instead of just /*
  • Added syntax coloring for partial css keywords used while using nested properties

About

Add some syntax highlighting with the default CSS settings provided by Notepad++