diff options
author | Griffin Smith <grfn@gws.fyi> | 2021-12-24T18·24-0500 |
---|---|---|
committer | clbot <clbot@tvl.fyi> | 2021-12-24T18·27+0000 |
commit | 4ad4e7346b53209979244dbd558ca08ab2bb50ce (patch) | |
tree | 14ab79512395f54d0f514b5de9525de37edf93d4 /users/grfn/bbbg/src/bbbg/styles.clj | |
parent | ad57a833c8e53f8699a7e1196b0f25175ed8c599 (diff) |
feat(grfn/bbbg): Begin styles r/3361
Start working on styles for the app, beginning with a global stylesheet/reset and styles for the nav. Change-Id: Ie15e549d7bb4e0116582f4099752aa2503eb9ce7 Reviewed-on: https://cl.tvl.fyi/c/depot/+/4583 Reviewed-by: grfn <grfn@gws.fyi> Autosubmit: grfn <grfn@gws.fyi> Tested-by: BuildkiteCI
Diffstat (limited to 'users/grfn/bbbg/src/bbbg/styles.clj')
-rw-r--r-- | users/grfn/bbbg/src/bbbg/styles.clj | 85 |
1 files changed, 82 insertions, 3 deletions
diff --git a/users/grfn/bbbg/src/bbbg/styles.clj b/users/grfn/bbbg/src/bbbg/styles.clj index 07ed87ba1a40..8e39f5c0e628 100644 --- a/users/grfn/bbbg/src/bbbg/styles.clj +++ b/users/grfn/bbbg/src/bbbg/styles.clj @@ -1,9 +1,88 @@ +;; -*- eval: (rainbow-mode) -*- (ns bbbg.styles - (:require [garden.def :refer [defstyles]] - [garden.compiler :refer [compile-css]])) + (:require + [garden.compiler :refer [compile-css]] + [garden.def :refer [defstyles]] + [garden.selectors :refer [attr= visited hover active & descendant]])) + +(def black "#342e37") + +(def silver "#f9fafb") + +(def gray "#aaa") + +(def gray-light "#ddd") + +(def purple "#837aff") + +(def red "#c42348") + +(def orange "#fa824c") + +(def yellow "#FACB0F") + +(def blue "#026fb1") + +(def green "#BEEF9E") + +(def contextual + {:success green + :info blue + :warning yellow + :error red}) + +;;; + +(defstyles global-nav + [:.global-nav + {:background-color silver} + + [:>ul + {:display :flex + :flex-direction :row + :list-style :none}] + + [:a (descendant :.link-form (attr= "type" "submit")) + {:padding "1rem 1.5rem" + :display :block + :color black + :text-decoration :none} + + [(& hover) + {:color blue}]] + + [:.spacer + {:flex 1}]]) + +(def link-conditional-styles + (list + [(& hover) (& active) + {:text-decoration :underline}] + [(& active) + {:color purple}])) + +(defstyles link-form + [:form.link-form + {:margin 0} + [(attr= "type" "submit") + {:background "none" + :border "none" + :padding 0 + :color blue + :text-decoration :none + :cursor :pointer} + link-conditional-styles]]) (defstyles styles - ) + global-nav + link-form + + [:body + {:color black}] + + [:a {:color blue + :text-decoration :none} + link-conditional-styles]) (def stylesheet (compile-css styles)) |