diff --git a/src/css/tailwind.css b/src/css/tailwind.css index 629ee4c..17404d2 100644 --- a/src/css/tailwind.css +++ b/src/css/tailwind.css @@ -6,3 +6,15 @@ /* Utilities */ @import 'tailwindcss/utilities'; + +.btn { + @apply font-bold py-2 px-4 rounded; +} + +.btn-blue { + @apply bg-blue-500 text-white; +} + +.btn-blue:hover { + @apply bg-blue-700; +} diff --git a/src/main/frontend/views.cljs b/src/main/frontend/views.cljs index 158b7e4..69f4836 100644 --- a/src/main/frontend/views.cljs +++ b/src/main/frontend/views.cljs @@ -2,14 +2,24 @@ (:require [reitit.frontend.easy :as rfe] [re-frame.core :refer [subscribe]])) +(defn button + [id] + [:div + [:button + {:type "button" + :on-click #(rfe/push-state id) + :class "btn btn-blue"} + "Item " id] + [:br]]) + (defn home-page [] [:div - :h2 "Home"] - [:button - {:type "button" - :on-click #(rfe/push-state :item {:id 431038004})} - "Item 431038004"]) + [:h2 "Try this!"] + (button 385214753) + (button 96817849) + (button 24425284) + ]) (defn about-page [] [:div