<commit_before>(ns braid.client.ui.styles.message
  (:require [braid.client.ui.styles.vars :refer [avatar-size pad card-width]]
            [braid.client.ui.styles.mixins :as mixins]
            [garden.arithmetic :as m]
            [garden.units :refer [rem px]]))

(def message
  [:.message
   {:position "relative"
    :margin [[0 0 pad]]}

   [:&.failed-to-send
    {:background-color "rgba(239, 72, 72, 0.53)"}]

   [:&.collapse
    {:margin-top (m/- pad)}
     [:.avatar :.info
      {:display "none"}]]

    [:&.seen
     {:transition [["opacity" "0.5s" "linear"]]}
     ; cannot apply opacity to .message or .content or .dummy
     ; b/c it creates a new stacking context
     ; causing hover-cards to display under subsequent messages
     ["> .info"
      "> .avatar img"
      "> .embed"
      "> .content > img"
      "> .content > .dummy > .user > .pill"
      "> .content > .dummy > .tag > .pill"
      "> .content > .dummy > .external"
      {:opacity 0.6}]
     ["> .content"
      {:color "rgba(0,0,0,0.6)"}]]

    [:&.unseen {}]

   ["> .avatar img"
    {:cursor "pointer"
     :width avatar-size
     :height avatar-size
     :display "inline-block"
     :position "absolute"
     :border-radius "20%"}]

   ["> .info"
    {:height "1rem"
     :margin-left (m/+ avatar-size (rem 0.5))
     :overflow "hidden"
     :white-space "nowrap"}

    [:.bot-notice
     {:background-color "#c0afc0"
      :border-radius (px 5)
      :padding (rem 0.25)
      :font-weight "bold"
      :color "#413f42"}]

    [:.nickname
     {:display "inline"
      :font-weight "bold"
      :text-decoration "none"
      :color "#000"}]

    [:.time
     {:display "inline"
      :margin-left "0.25rem"
      :color "#ccc"}]]

   ["> .content"
    {:white-space "pre-wrap"
     :word-break "break-word"
     :display "inline-block"
     :padding-left (m/+ avatar-size (rem 0.5))
     :width "100%"
     :box-sizing "border-box"
     :line-height "1.25em"
     :margin-top (rem 0.20)}

    [:a.external
     mixins/pill-box
     {:background "#000000"}

     [:&:before
      (mixins/fontawesome \uf0c1)
      {:display "inline"
       :margin-right "0.25em"
       :vertical-align "middle"<commit_msg>Allow url pills to be full-width<commit_after>(ns braid.client.ui.styles.message
  (:require [braid.client.ui.styles.vars :refer [avatar-size pad card-width]]
            [braid.client.ui.styles.mixins :as mixins]
            [garden.arithmetic :as m]
            [garden.units :refer [rem px]]))

(def message
  [:.message
   {:position "relative"
    :margin [[0 0 pad]]}

   [:&.failed-to-send
    {:background-color "rgba(239, 72, 72, 0.53)"}]

   [:&.collapse
    {:margin-top (m/- pad)}
     [:.avatar :.info
      {:display "none"}]]

    [:&.seen
     {:transition [["opacity" "0.5s" "linear"]]}
     ; cannot apply opacity to .message or .content or .dummy
     ; b/c it creates a new stacking context
     ; causing hover-cards to display under subsequent messages
     ["> .info"
      "> .avatar img"
      "> .embed"
      "> .content > img"
      "> .content > .dummy > .user > .pill"
      "> .content > .dummy > .tag > .pill"
      "> .content > .dummy > .external"
      {:opacity 0.6}]
     ["> .content"
      {:color "rgba(0,0,0,0.6)"}]]

    [:&.unseen {}]

   ["> .avatar img"
    {:cursor "pointer"
     :width avatar-size
     :height avatar-size
     :display "inline-block"
     :position "absolute"
     :border-radius "20%"}]

   ["> .info"
    {:height "1rem"
     :margin-left (m/+ avatar-size (rem 0.5))
     :overflow "hidden"
     :white-space "nowrap"}

    [:.bot-notice
     {:background-color "#c0afc0"
      :border-radius (px 5)
      :padding (rem 0.25)
      :font-weight "bold"
      :color "#413f42"}]

    [:.nickname
     {:display "inline"
      :font-weight "bold"
      :text-decoration "none"
      :color "#000"}]

    [:.time
     {:display "inline"
      :margin-left "0.25rem"
      :color "#ccc"}]]

   ["> .content"
    {:white-space "pre-wrap"
     :word-break "break-word"
     :display "inline-block"
     :padding-left (m/+ avatar-size (rem 0.5))
     :width "100%"
     :box-sizing "border-box"
     :line-height "1.25em"
     :margin-top (rem 0.20)}

    [:a.external
     mixins/pill-box
     {:background "#000000"
      :max-width "inherit !important"}

     [:&:before
      (mixins/fontawesome \uf0c1)
      {:display "inline"
       :margin-right "0.25em"
       :vertical-align "middle"
{'fraction_non_alphanumeric': 0.18243091440125814, 'fraction_numerical': 0.029206919793304875, 'mean_word_length': 2.150743099787686, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 43, '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': '809220', 'n_tokens_mistral': 1737, 'n_tokens_neox': 1596, 'n_words': 371}