diff --git a/oni-css.el b/oni-css.el new file mode 100644 index 0000000..2008558 --- /dev/null +++ b/oni-css.el @@ -0,0 +1,139 @@ +;;; oni-css.el --- CSS configuration -*- lexical-binding: t; -*- + +;; Copyright (C) 2019 Tom Willemse + +;; Author: Tom Willemse +;; Keywords: local +;; Version: 20190218233500 +;; Package-Requires: (oni-company hydra fill-column-indicator) + +;; This program is free software; you can redistribute it and/or modify +;; it under the terms of the GNU General Public License as published by +;; the Free Software Foundation, either version 3 of the License, or +;; (at your option) any later version. + +;; This program is distributed in the hope that it will be useful, +;; but WITHOUT ANY WARRANTY; without even the implied warranty of +;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +;; GNU General Public License for more details. + +;; You should have received a copy of the GNU General Public License +;; along with this program. If not, see . + +;;; Commentary: + +;; Configuration for `css-mode' and `scss-mode'. + +;;; Code: + +(require 'align) +(require 'css-mode) +(require 'hydra) + +(eval-when-compile + (require 'compile)) + +(defun oni-css-property-important-p () + "Return whether or not the current property is important." + (save-excursion + (beginning-of-line) + (re-search-forward "!important" (line-end-position) :noerror))) + +(defun oni-css-add-important () + "Add an important flag to the property on the current line." + (interactive) + (unless (oni-css-property-important-p) + (save-excursion + (end-of-line) + (when (re-search-backward ";" (line-beginning-position) :noerror) + (insert " !important"))))) + +(defun oni-css-remove-important () + "Remove the important flag from the property on the current line." + (interactive) + (when (oni-css-property-important-p) + (save-excursion + (end-of-line) + (when (re-search-backward " !important" (line-beginning-position) :noerror) + (replace-match ""))))) + +(defun oni-css-mode-init--toggle-important () + "Toggle the important flag on the property on the current line." + (interactive) + (if (oni-css-property-important-p) + (oni-css-remove-important) + (oni-css-add-important))) + +(defhydra css-mode-hydra (:color blue) + ("!" oni-css-mode-init--toggle-important)) + +(setq css-indent-offset 2) + +(add-hook 'css-mode-hook 'electric-pair-local-mode) +(add-hook 'css-mode-hook 'electric-indent-local-mode) +(add-hook 'css-mode-hook 'company-mode) +(add-hook 'css-mode-hook 'fci-mode) + +(with-eval-after-load 'compile + (let ((scss-error-regexp + (rx (and bol + (zero-or-more space) "on line " + (group (one-or-more digit)) " of " + (group (one-or-more (or word punct (syntax symbol)))) + eol)))) + + (add-to-list 'compilation-error-regexp-alist + (list scss-error-regexp 2 1 nil 2 2)))) + +(define-key css-mode-map (kbd "C-c m") #'css-mode-hydra/body) + +;; Align CSS files like so: + +;; body { color: #ffffff; } +;; .some-class { background-color: #ffffff; } +;; #some-id { width: 200px; } + +;; .some-more-class { +;; color: #ffffff; +;; background-color: #ffffff; +;; width: 200px; +;; } + +;; Keep these in order. They are each added to the _front_ of the +;; list and are applied in order. Changing their order will change +;; the results. +(add-to-list 'align-rules-list + `(css-closing-brace + (regexp . ,(rx (group (0+ whitespace)) "}" eol)) + (group . (1)) + (modes . '(scss-mode css-mode)))) + +(add-to-list 'align-rules-list + `(css-colons + (regexp . ,(rx bol + (0+ whitespace) + (1+ (any (?a . ?z) ?- ?$)) + ":" + (group (0+ whitespace)) + (0+ nonl) + ";" + eol)) + (group . (1)) + (modes . '(scss-mode css-mode)) + (repeat . t))) + +(add-to-list 'align-rules-list + `(css-opening-brace + (regexp . ,(rx bol + (0+ whitespace) + (0+ (any ?# ?. ?, ?\s ?& ?: ?- + (?a . ?z) (?A . ?Z) (?0 . ?9))) + (any (?a . ?z) (?A . ?Z) (?0 . ?9)) + (group (0+ whitespace)) + "{" + (0+ nonl))) + (group . (1)) + (modes . '(scss-mode css-mode)))) + +(provide 'oni-css) +;;; oni-css.el ends here