(in-package :panettone.css)
(declaim (optimize (safety 3)))

(defun button (selector)
  `((,selector
     :background-color "var(--success)"
     :padding "0.5rem"
     :text-decoration "none"
     :transition "box-shadow" "0.15s" "ease-in-out")

    ((:and ,selector :hover)
     :box-shadow "0.25rem" "0.25rem" "0" "0" "rgba(0,0,0,0.08)")

    ((:and ,selector (:or :active :focus))
     :box-shadow "0.1rem" "0.1rem" "0" "0" "rgba(0,0,0,0.05)"
     :outline "none"
     :border "none")))

(defparameter markdown-styles
  `((blockquote
     :border-left "5px" "solid" "var(--light)"-gray
     :padding-left "1rem"
     :margin-left "0rem")
    (pre
     :overflow-x "auto")))

(defparameter issue-list-styles
  `((.issue-list
     :list-style-type "none"
     :padding-left 0

     (.issue-subject
      :font-weight "bold")

     (li
      :padding-bottom "1rem")

     ((li + li)
      :border-top "1px" "solid" "var(--gray)")

     (a
      :text-decoration "none"
      :display "block")

     ((:and a :hover)
      :outline "none"

      (.issue-subject
       :color "var(--primary)")))

    (.comment-count
     :color "var(--gray)")))

(defparameter issue-history-styles
  `((.issue-history
     :list-style "none"
     :border-top "1px" "solid" "var(--gray)"
     :padding-top "1rem"
     :padding-left "2rem"

     (.comment-info
      :color "var(--gray)"
      :margin 0
      :padding-top "1rem"

      (a :text-decoration "none")
      ((:and a :hover)
       :text-decoration "underline"))

     ((:or .comment .event)
      :padding-top "1rem"
      :padding-bottom "1rem"
      :border-bottom "1px" "solid" "var(--gray)"

      (p :margin 0))

     ((:and (:or .comment .event) :target)
      :border-color "var(--primary)"
      :border-bottom-width "3px")

     (.event
      :color "var(--gray)"))))

(defparameter form-styles
  `(((:or (:and input (:or (:= type "text")
                           (:= type "password")))
          textarea)
     :width "100%"
     :padding "0.5rem"
     :outline "none"
     :border-top "none"
     :border-left "none"
     :border-right "none"
     :border-bottom "1px" "solid" "var(--gray)"
     :margin-bottom "1rem")

    (textarea
     :resize "vertical")

    ((:and input (:= type "submit"))
     :-webkit-appearance "none"
     :border "none"
     :cursor "pointer"
     :font-size "1rem")

    ,@(button '(:and input (:= type "submit")))

    (.form-link
     ((:and input (:= type "submit"))
      :background-color "initial"
      :color "inherit"
      :padding 0
      :text-decoration "underline")

     ((:and input (:= type "submit")
            (:or :hover :active :focus))
      :box-shadow 0 0 0 0))

    (.form-group
     :margin-top "1rem")

    (label.checkbox
     :cursor "pointer")))

(defparameter issue-styles
  `((.issue-info
     :display "flex"
     :justify-content "space-between"
     :align-items "center"

     ,@(button '.edit-issue)

     (.created-by-at
      :flex 1)

     (.edit-issue
      :background-color "var(--light)"-gray
      :flex 0
      :margin-right "0.5rem")

     (.close-issue
      :background-color "var(--failure)"))))

(defparameter styles
  `(,@form-styles
    ,@issue-list-styles
    ,@issue-styles
    ,@issue-history-styles
    ,@markdown-styles

    (body
     :font-family "sans-serif"
     :color "var(--text)"
     :background "var(--bg)"
     :--text "rgb(24, 24, 24)"
     :--bg "white"
     :--gray "#8D8D8D"
     :--primary "rgb(106, 154, 255)"
     :--primary-light "rgb(150, 166, 200)"
     :--success "rgb(168, 249, 166)"
     :--failure "rgb(247, 167, 167)"
     :--light-gray "#EEE")

    (:media "(prefers-color-scheme: dark)"
      (body
        :--text "rgb(240, 240, 240)"
        :--bg "black"
        :--gray "#8D8D8D"
        :--primary "rgb(106, 154, 255)"
        :--primary-light "rgb(150, 166, 200)"
        :--success "rgb(14, 130, 11)"
        :--failure "rgb(124, 14, 14)"
        :--light-gray "#222"))

    (a :color "inherit")

    (.content
     :max-width "800px"
     :margin "0 auto")

    (header
     :display "flex"
     :align-items "center"
     :border-bottom "1px" "solid" "var(--text)"
     :margin-bottom "1rem"

     (h1
      :padding 0
      :flex 1)

     (.issue-number
      :color "var(--gray)"
      :font-size "1.5rem"))

    (nav
     :display "flex"
     :color "var(--gray)"
     :justify-content "space-between"

     (.nav-group
      :display "flex"
      (>*
       :margin-left "0.5rem")))

    (footer
     :border-top "1px" "solid" "var(--gray)"
     :padding-top "1rem"
     :margin-top "1rem"
     :color "var(--gray)")

    ,@(button '.new-issue)

    (.alert
     :padding "0.5rem"
     :margin-bottom "1rem"
     :background-color "var(--failure)")

    (.login-form
     :max-width "300px"
     :margin "0 auto")

    (.created-by-at
     :color "var(--gray)")))