diff options
author | Griffin Smith <grfn@gws.fyi> | 2021-12-25T22·36-0500 |
---|---|---|
committer | clbot <clbot@tvl.fyi> | 2021-12-25T22·48+0000 |
commit | b12dbaa3b6973bdc752e7ce6fa6f1d359a938a96 (patch) | |
tree | 19e2fb7018fbf877b3b6cb052380db430fc5a100 /users/grfn/bbbg/src/bbbg/styles.clj | |
parent | f093aa5bce455510bf7e05185282ef4d78e9b251 (diff) |
refactor(grfn/bbbg): Live-filter for signup form r/3408
Rather than loading as the user types for the signup form, start the page with the full list of attendees already loaded and filter that list as the user types. There are never going to be more than 50 attendees, so there's no perf cost here, and it's nice to have the list to scroll through in the frontend. Change-Id: Iba69b101856756801183979b9384503520b6701f Reviewed-on: https://cl.tvl.fyi/c/depot/+/4624 Tested-by: BuildkiteCI Reviewed-by: grfn <grfn@gws.fyi> Autosubmit: grfn <grfn@gws.fyi>
Diffstat (limited to 'users/grfn/bbbg/src/bbbg/styles.clj')
-rw-r--r-- | users/grfn/bbbg/src/bbbg/styles.clj | 42 |
1 files changed, 37 insertions, 5 deletions
diff --git a/users/grfn/bbbg/src/bbbg/styles.clj b/users/grfn/bbbg/src/bbbg/styles.clj index 61e1132b4068..09f5eb31113a 100644 --- a/users/grfn/bbbg/src/bbbg/styles.clj +++ b/users/grfn/bbbg/src/bbbg/styles.clj @@ -145,17 +145,25 @@ {:outline "none" :border-color purple}])) - [(attr= "type" "submit") :button + [(attr= "type" "submit") :button :.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} + :cursor :pointer + :display :inline-block} [(& hover) - {:border-color blue}] + {:border-color blue + :text-decoration :none + :box-shadow [[0 "1px" "5px" "rgba(0,0,0,0.075)"]]} + [(& :a) + {:text-decoration :none}]] [(& active) {:background-color blue - :color :white}]]) + :color :white + :box-shadow :none} + [(& :a) + {:text-decoration :none}]]]) (defstyles tables [:table @@ -230,7 +238,28 @@ {:margin-left "1rem"}] [(attr= "type" "submit") - {:flex 0}]]) + {:flex 0}]] + + [:#attendees-list + {:list-style "none" + :overflow-y "auto" + :height "calc(100vh - 8.32425rem)"} + + [:li + {:padding "0.75rem 1rem" + :margin "0.35rem 0" + :border-radius "3px" + :background-color silver}]] + + [:.no-attendees + {:text-align "center" + :margin-top "6rem"} + + [:.button + {:margin-top "0.5rem"}]] + + [:.hidden + {:display :none}]) (defstyles styles forms @@ -259,6 +288,9 @@ :margin-left "auto" :margin-right "auto"})] + [(attr= "role" "button") + {:cursor :pointer}] + [:a {:color blue :text-decoration :none} link-conditional-styles]) |