diff options
| -rw-r--r-- | users/grfn/bbbg/src/bbbg/db/attendee.clj | 7 | ||||
| -rw-r--r-- | users/grfn/bbbg/src/bbbg/handlers/attendees.clj | 10 | ||||
| -rw-r--r-- | users/grfn/bbbg/src/bbbg/styles.clj | 100 |
3 files changed, 106 insertions, 11 deletions
diff --git a/users/grfn/bbbg/src/bbbg/db/attendee.clj b/users/grfn/bbbg/src/bbbg/db/attendee.clj index 089b92457dca..5bc5430a9473 100644 --- a/users/grfn/bbbg/src/bbbg/db/attendee.clj +++ b/users/grfn/bbbg/src/bbbg/db/attendee.clj @@ -15,9 +15,10 @@ (if (db/database? db-or-query) (db/list db-or-query (search q)) (cond-> db-or-query - q [:or - [:ilike :meetup_name (str "%" q "%")] - [:ilike :discord_name (str "%" q "%")]]))) + q (merge-where + [:or + [:ilike :meetup_name (str "%" q "%")] + [:ilike :discord_name (str "%" q "%")]])))) ([db query q] (db/list db (search query q)))) diff --git a/users/grfn/bbbg/src/bbbg/handlers/attendees.clj b/users/grfn/bbbg/src/bbbg/handlers/attendees.clj index 366f4b0973e3..f874273ee7e6 100644 --- a/users/grfn/bbbg/src/bbbg/handlers/attendees.clj +++ b/users/grfn/bbbg/src/bbbg/handlers/attendees.clj @@ -20,11 +20,13 @@ java.util.UUID)) (defn- attendees-page [{:keys [attendees q edit-notes]}] - [:div + [:div.page [:form.search-form {:method :get :action "/attendees"} - [:input {:type "search" - :name "q" - :value q}] + [:input.search-input + {:type "search" + :name "q" + :value q + :title "Search Attendees"}] [:input {:type "submit" :value "Search Attendees"}]] [:table.attendees diff --git a/users/grfn/bbbg/src/bbbg/styles.clj b/users/grfn/bbbg/src/bbbg/styles.clj index 37c1aa901c6b..fd341a62dd5b 100644 --- a/users/grfn/bbbg/src/bbbg/styles.clj +++ b/users/grfn/bbbg/src/bbbg/styles.clj @@ -4,7 +4,7 @@ [garden.color :as color] [garden.compiler :refer [compile-css]] [garden.def :refer [defstyles]] - [garden.selectors :refer [& active attr= descendant hover]] + [garden.selectors :refer [& active attr= descendant hover focus nth-child]] [garden.stylesheet :refer [at-media]] [garden.units :refer [px]])) @@ -36,7 +36,7 @@ ;;; -(def content-width (px 1600)) +(def content-width (px 1200)) (defn not-mobile [& rules] (at-media @@ -95,6 +95,87 @@ :cursor :pointer} link-conditional-styles]]) +(defstyles search-form + [:.search-form + {:display :flex + :flex-direction :row + :width "100%" + :padding "0 1rem"} + + [:>*+* + {:margin-left "0.75rem"}] + + [:input + {:flex 1}] + + [(attr= "type" "submit") + {:flex 0}]]) + +(defstyles forms + (let [text-input-types + #{"date" + "datetime-local" + "email" + "month" + "number" + "password" + "search" + "tel" + "text" + "time" + "url" + "week"} + each-text-type (fn [& rules] + (into + [] + (concat + (map (comp & (partial attr= "type")) + text-input-types) + rules)))] + (each-text-type + {:width "100%" + :display "block" + :padding "0.6rem 0.75rem" + :border [["1px" "solid" gray-light]] + :border-radius "3px" + :box-shadow [["inset" 0 "1px" "5px" "rgba(0,0,0,0.075)"]] + :transition "border-color 150ms" + :background "none"} + [(& focus) + {:outline "none" + :border-color purple}])) + + [(attr= "type" "submit") :button + {:background-color (color/lighten blue 30) + :padding "0.6rem 0.75rem" + :border-radius "3px" + :border [[(px 1) "solid" (color/lighten blue 30)]] + :cursor :pointer} + [(& hover) + {:border-color blue}] + [(& active) + {:background-color blue + :color :white}]]) + +(defstyles tables + [:table + {:width "100%" + :border-collapse "collapse"}] + + [:th + {:text-align "left"}] + + [:td :th + {:padding "0.75rem 1rem" + :border-spacing 0 + :border "none"}] + + [:tr + {:border-spacing 0 + :border "none"} + [(& (nth-child :even)) + {:background-color silver}]]) + (defstyles flash [:.flash-messages {:width "800px" @@ -109,7 +190,7 @@ [(& (keyword (str ".flash-" (name context)))) {:border-color color :background-color (color/lighten color 30) - :border-radius "5px"}])) + :border-radius "3px"}])) (defstyles home-page [:.home-page @@ -121,7 +202,7 @@ {:display :block :padding "5rem" :border [["1px" :solid blue]] - :border-radius "5px" + :border-radius "3px" :color black :font-size "2rem" :background-color (color/lighten blue 50)} @@ -131,8 +212,11 @@ {:background-color (color/lighten blue 30)}]]]) (defstyles styles + forms + tables global-nav link-form + search-form flash home-page @@ -145,6 +229,14 @@ :height "100%" :width "100%"}] + [:.page + {:margin-top "1rem"} + + (not-mobile + {:width content-width + :margin-left "auto" + :margin-right "auto"})] + [:a {:color blue :text-decoration :none} link-conditional-styles]) |