nav.cljs

(defn navitem [{:keys [text target]}]
  [:li {:class (styles/navitem)}
   [:a {:class (styles/navlink) :href (url-for target)} text]])

(defn navbar []
  [:nav {:class (styles/navbar)}
   [:ul {:class (styles/navlist)}
    [navitem {:text "Home" :target :home}]
    [navitem {:text "About" :target :about}]]])

styles.cljs

(ns piirtely.styles
  (:require-macros
   [garden.def :refer [defcssfn]])
  (:require
   [spade.core   :refer [defglobal defclass]]
   [garden.units :refer [deg px]]
   [garden.color :refer [rgba]]))

(defglobal defaults
  [:body
   {:color               :red
    :background-color    :#ddd}])

(defclass content
  []
  {:float :left})

(defclass level1
  []
  {:color :green})

;; nav
(defclass navbar
  []
  {})

;; ul
(defclass navlist
  []
  {:list-style-type :none
   :margin 0
   :padding 0
   :overflow :hidden
   :background-color :#333})

;; li
(defclass navitem
  []
  {:float :left})

;; a
(defclass navlink
  []
  {:display :block
   :color :white
   :text-align :center
   :text-decoration :none
   :padding "14px 16px"}
  [:hover {:color :blue}])