All things Common Lisp

Semantic HTML theme for Coleslaw with LASS and CLASSIE

Written on

I've recently was facinated by Shinmera's LASS - a system to generate CSS in a way similar to SCSS / LESS but in a Common Lisp way. I've compiled a small utility CLASSIE which addresses some common pains of using LASS - arithmetic with unit values, including files and some color manipulation.

Lisp setup

ros install Shinmera/lass
ros install egao1980/classie

Emacs configuration

Edit and compile .lass file with bells and whistles:

(defun lass-compile-current ()
  (interactive)
  (or
   (when (and (sly-connected-p)
              (or (sly-eval '(cl:not (cl:null (cl:find-package :classie))))
                  (and (sly-eval '(cl:not (cl:null (cl:find-package :ql))))
                       (sly-eval '(ql:quickload :classie)))))
     (message "LASS compiled to %s" (sly-eval
                                     `(uiop:native-namestring
                                       (lass:generate
                                        (uiop:parse-native-namestring ,(buffer-file-name))
                                        :pretty t)))))
   (message "LASS compiled. %s" (shell-command-to-string (format "lass %s" (shell-quote-argument (buffer-file-name)))))))

(define-derived-mode lass-mode common-lisp-mode
  "LASS" "Mode with auto-compiling for LASS files."
  (add-hook 'after-save-hook 'lass-compile-current nil t))

(add-to-list 'auto-mode-alist '("\\.lass\\'" . lass-mode))

(provide 'lass)

Theme details

Modern HTML5 provides host of semantic tags enough to represent a blog without resorting to CSS classes and with minimal styling.

After discovering minimalist Marx CSS reset I've built a LASS code to replicate it - Engels.

This blog theme is loosely based on Coleslaw Hyde theme and Brutalist version of Engels. Please check coleslaw-theme-brutal for implementation details.