feat(grfn/bbbg): Add styling for flash messages

Change-Id: Ic8594217e6acceaad041dda8acf135bf7f3408e9
Reviewed-on: https://cl.tvl.fyi/c/depot/+/4585
Reviewed-by: grfn <grfn@gws.fyi>
Autosubmit: grfn <grfn@gws.fyi>
Tested-by: BuildkiteCI
This commit is contained in:
Griffin Smith 2021-12-24 14:26:26 -05:00 committed by clbot
parent 4c23a9c1d4
commit 15a9443e36
3 changed files with 29 additions and 4 deletions

View file

@ -57,6 +57,7 @@
[:body
[:div.content
(global-nav)
#_(flash/render-flash flash/test-flash)
(flash/render-flash)
body]
[:script {:src "https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/10.2.6/autoComplete.js"}]

View file

@ -1,9 +1,10 @@
;; -*- eval: (rainbow-mode) -*-
(ns bbbg.styles
(:require
[garden.color :as color]
[garden.compiler :refer [compile-css]]
[garden.def :refer [defstyles]]
[garden.selectors :refer [attr= visited hover active & descendant]]))
[garden.selectors :refer [& active attr= descendant hover visited]]))
(def black "#342e37")
@ -23,9 +24,9 @@
(def blue "#026fb1")
(def green "#BEEF9E")
(def green "#87E24B")
(def contextual
(def contextual-colors
{:success green
:info blue
:warning yellow
@ -73,9 +74,26 @@
:cursor :pointer}
link-conditional-styles]])
(defstyles flash
[:.flash-messages
{:width "800px"
:margin "1rem auto"}]
[:.flash-message
{:padding "1rem 1.5rem"
:border "1px solid"
:margin-bottom "1rem"}]
(for [[context color] contextual-colors]
[(& (keyword (str ".flash-" (name context))))
{:border-color color
:background-color (color/lighten color 30)
:border-radius "5px"}]))
(defstyles styles
global-nav
link-form
flash
[:body
{:color black}]

View file

@ -1,7 +1,7 @@
(ns bbbg.views.flash
(:require [clojure.spec.alpha :as s]))
(s/def :flash/type #{:success :error :warning})
(s/def :flash/type #{:success :error :warning :info})
(s/def :flash/message string?)
(s/def ::flash (s/keys :req [:flash/type :flash/message]))
(s/fdef add-flash :args (s/cat :resp map? :flash ::flash) :ret map?)
@ -31,3 +31,9 @@
[:li.flash-message
{:class (str "flash-" (-> message :flash/type name))}
(:flash/message message)])])))
(def test-flash
{:flash/messages
(for [type [:success :error :warning :info]]
{:flash/type type
:flash/message (str "Sample " type " message")})})