div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
  div.segment.full.sm-three-quarter.whitespace-normal
    solid-display.text-xlarge.text-letter-spacing-large(
      bind-resources
      fields='const-title1, number, customer.name, dash, name'

      class-const-title1='text-color-heading text-bold text-uppercase'
      class-number='text-color-heading text-bold text-uppercase word-spacing-right'
      class-customer.name='text-color-heading text-bold text-uppercase'
      class-dash='text-color-heading text-bold text-xlarge'
      class-name=''

      value-const-title1='N°'
      value-dash=' - '
    )
  div.segment.lg-hidden.sm-quarter.text-right
    div.jsMobileRightMenuButton.icon.icon-options-vertical.icon-heading

.chat-view.segment.full.whitespace-normal
  solid-xmpp-chat(
    data-authentication='login'
    data-auto-login='true'
    data-websocket-url=component.endpoints.xmpp
    bind-resources
    uniq=component.uniq
  )