@import "../../node_modules/tracim_lib/src/css/Variable.styl"

.wsContentThread
  width 550px
  flex-grow 1
  margin-bottom 0
  border-bottom 1px solid grey
  overflow-Y auto
  &__header
    color white
    background-color threadColor
    &__editionmode
      display none
    &__icon
      .fa-comments-o
        color white
  &__wrapper
    height calc(100% - 209px) /* height of chat__header + height of option + top of chat */
  &__messagelist
    padding 15px 35px
    list-style none
    &__item
      &__avatar
        position relative
        top 43px
        left -25px
        & > img
          width 45px
          height 45px
          border-radius 30px
      &__createhour
        margin-left 30px
        opacity 0.7
        font-size 14px
      &__content
        border 1px solid grey
        border-radius 5px
        padding 15px
        background-color off-white
        font-size 15px
        z-index -1
        color darkBlue

  &__texteditor
    &__simpletext
      &__input
        &:focus
          color darkBlue
          border-color darkBlue
    &__submit
      &__btn
        color darkBlue

.sended
  .wsFileGeneric__messagelist__item__content
    margin-right 25%

.received
  .wsFileGeneric__messagelist__item
    &__avatar
      left 93%
    &__createhour
      text-align right
      margin-right 50px
    &__content
      margin-left 25%
      background-color darkBlue
      color white

.activeEditionTitle
  .wsFileThread
    &__header
      &__editionmode
        display block
      &__title
        display none

@media (min-width: max-xs) and (max-width: max-lg)
  .wsContentThread
    &__texteditor
      padding 7px
      &__simpletext
        display inline-flex
      &__submit
        display inline-flex
        width 80px

@media (min-width: min-sm) and (max-width: max-sm)
  .wsContentThread
    top 69px

@media (max-width: max-xs)
  .wsContentThread
    top 69px
    width 100%
    box-shadow none
    z-index 1
    &__texteditor
      padding 7px
      &__simpletext
        display inline-flex
        margin-right 15px
        width 62%
      &__submit
        display inline-flex
        width 80px