<commit_before>(ns braid.client.gateway.styles
  (:require
    [braid.client.ui.styles.fontawesome :as fontawesome]
    [braid.client.ui.styles.animations :as animations]
    [braid.client.ui.styles.mixins :as mixins]
    [braid.client.gateway.styles-vars :as vars]))

(def anim-spin animations/anim-spin)

(defn app-styles []
  [:body
   {:min-height "100vh"
    :font-family vars/font-family
    :margin 0
    :line-height 1.5
    :background vars/page-background-color
    :color vars/primary-text-color}

    [:input
     :button
     {:font-family vars/font-family}]])

(defn form-styles []
  [:.gateway

   [:h1.header
    {:color vars/accent-color
     :font-weight "normal"
     :font-size "1.75em"
     :text-align "center"
     :margin "2rem 0"}

    [:&:before
     {:content "\"\""
      :display "inline-block"
      :margin-right "0.5em"
      :margin-bottom "-0.15em"
      :margin-left "-1.75em"
      :width "1.25em"
      :height "1.25em"
      :background-image "url(/images/braid-logo-color.svg)"
      :background-size "contain"}]]

   [:.section
    {:background vars/form-background-color
     :border [["1px" "solid" vars/field-border-color]]
     :max-width "32em"
     :padding "2rem"
     :margin "0 auto"
     :box-sizing "border-box"
     :margin-bottom "2rem"
     :border-radius vars/border-radius}

    [:h1
     {:margin [[0 0 "1.5rem"]]
      :color vars/accent-color
      :font-size "1.2em"}]]

   [:.option
    {:margin [[0 0 "2rem"]]
     :position "relative"}

    [:h2
     {:font-size "1em"
      :color vars/primary-text-color
      :margin [[0 0 vars/small-spacing 0]]}]

    [:.explanation
     (vars/small-text-mixin)]

    [:.error-message
     {:position "absolute"
      :top 0
      :right 0
      :text-align "right"
      :line-height "1.5rem"
      :font-size "0.75em"
      :color vars/invalid-color}]

    [:label
     {:display "block"}

     ["input[type=text]"
      "input[type=email]"
      "input[type=password]"
      (vars/input-field-mixin)

      [:&:focus
       {:border-color vars/accent-color
        :outline "none"}]]

     ["::-webkit-input-placeholder"
      {:color vars/placeholder-color}]

     ["&&::-moz-placeholder"
      {:color vars/placeholder-color}]]

    [:.field
     {:position "relative"}

     [:&::after
      (vars/input-field-mixin)
      ; cancel out some input-field-mixin styles
      {:width "inherit"
       :border "none"
       :margin "1px"}
      {:position "absolute"
       :top 0
       :right "0.25em"}]]

    [:&.invalid
     ["input[type=text]"
      "input[type=email]"
      {:border-color vars/invalid-color}]

     [:.field
      [:&::after
       (fontawesome/mixin :warning)
       {:color vars/invalid-color}]]]

    [:&.valid
     [:.field::after
      (fontawesome/mixin :check-circle)
      {:color vars/valid-color}]]

    [:&.loading
     [:.field::after
      (fontawesome/mixin :spinner)
      mixins/spin
      {:color vars/secondary-text-color}]]]

   [:button.submit
    {:font-size "1.25em"
     :width "100%"
     :padding "1rem"
     :background vars/accent-color
     :border "none"
     :color "white"
     :border-radius vars/border-radius
     :text-transform "uppercase"<commit_msg>Fix missing red border from password fields with errors<commit_after>(ns braid.client.gateway.styles
  (:require
    [braid.client.ui.styles.fontawesome :as fontawesome]
    [braid.client.ui.styles.animations :as animations]
    [braid.client.ui.styles.mixins :as mixins]
    [braid.client.gateway.styles-vars :as vars]))

(def anim-spin animations/anim-spin)

(defn app-styles []
  [:body
   {:min-height "100vh"
    :font-family vars/font-family
    :margin 0
    :line-height 1.5
    :background vars/page-background-color
    :color vars/primary-text-color}

    [:input
     :button
     {:font-family vars/font-family}]])

(defn form-styles []
  [:.gateway

   [:h1.header
    {:color vars/accent-color
     :font-weight "normal"
     :font-size "1.75em"
     :text-align "center"
     :margin "2rem 0"}

    [:&:before
     {:content "\"\""
      :display "inline-block"
      :margin-right "0.5em"
      :margin-bottom "-0.15em"
      :margin-left "-1.75em"
      :width "1.25em"
      :height "1.25em"
      :background-image "url(/images/braid-logo-color.svg)"
      :background-size "contain"}]]

   [:.section
    {:background vars/form-background-color
     :border [["1px" "solid" vars/field-border-color]]
     :max-width "32em"
     :padding "2rem"
     :margin "0 auto"
     :box-sizing "border-box"
     :margin-bottom "2rem"
     :border-radius vars/border-radius}

    [:h1
     {:margin [[0 0 "1.5rem"]]
      :color vars/accent-color
      :font-size "1.2em"}]]

   [:.option
    {:margin [[0 0 "2rem"]]
     :position "relative"}

    [:h2
     {:font-size "1em"
      :color vars/primary-text-color
      :margin [[0 0 vars/small-spacing 0]]}]

    [:.explanation
     (vars/small-text-mixin)]

    [:.error-message
     {:position "absolute"
      :top 0
      :right 0
      :text-align "right"
      :line-height "1.5rem"
      :font-size "0.75em"
      :color vars/invalid-color}]

    [:label
     {:display "block"}

     ["input[type=text]"
      "input[type=email]"
      "input[type=password]"
      (vars/input-field-mixin)

      [:&:focus
       {:border-color vars/accent-color
        :outline "none"}]]

     ["::-webkit-input-placeholder"
      {:color vars/placeholder-color}]

     ["&&::-moz-placeholder"
      {:color vars/placeholder-color}]]

    [:.field
     {:position "relative"}

     [:&::after
      (vars/input-field-mixin)
      ; cancel out some input-field-mixin styles
      {:width "inherit"
       :border "none"
       :margin "1px"}
      {:position "absolute"
       :top 0
       :right "0.25em"}]]

    [:&.invalid
     ["input[type=text]"
      "input[type=email]"
      "input[type=password]"
      {:border-color vars/invalid-color}]

     [:.field
      [:&::after
       (fontawesome/mixin :warning)
       {:color vars/invalid-color}]]]

    [:&.valid
     [:.field::after
      (fontawesome/mixin :check-circle)
      {:color vars/valid-color}]]

    [:&.loading
     [:.field::after
      (fontawesome/mixin :spinner)
      mixins/spin
      {:color vars/secondary-text-color}]]]

   [:button.submit
    {:font-size "1.25em"
     :width "100%"
     :padding "1rem"
     :background vars/accent-color
     :border "none"
     :color "white"
     :border-radius vars/border-radius
     :text-transform "uppercase"
{'fraction_non_alphanumeric': 0.1697706633830999, 'fraction_numerical': 0.02031706941665384, 'mean_word_length': 2.3254861821903785, 'pattern_counts': {'":': 2, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5984514', 'n_tokens_mistral': 2445, 'n_tokens_neox': 2281, 'n_words': 436}