Bit side of life

Technical notes of digital heart

Helm for Stylesheets

| Comments

Emacs has incredible useful machineries for code navigation. ETags with projectile, Imenu mode, helm-git-grep to name a few. Doing some frontend work recently I missed same navigation for stylesheets (CSSes) working consistently across different extensions like Less/SCSS.

No surprise there was already package for this - helm-css-scss. Navigating through CSS selectors and media queries couldn’t be easier now. The only thing I had to adjust was to map helm-css-scss function to the same shortcut for both css- and less/scss-modes:

1
2
3
4
5
6
7
(add-hook 'less-css-mode-hook
          (lambda ()
            (define-key less-css-mode-map (kbd "C-o") 'helm-css-scss)))

(add-hook 'css-mode-hook
          (lambda ()
            (define-key css-mode-map (kbd "C-o") 'helm-css-scss)))

Having those key bindings with default global one:

1
(global-set-key [?\C-o] 'helm-imenu)

makes code navigation within a buffer much more comfortable.

Comments