index.styl 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. @import "../../node_modules/tracim_lib/src/css/Variable.styl"
  2. .wsContentThread
  3. width 550px
  4. flex-grow 1
  5. margin-bottom 0
  6. border-bottom 1px solid grey
  7. overflow-Y auto
  8. &__header
  9. color white
  10. background-color threadColor
  11. &__editionmode
  12. display none
  13. &__icon
  14. .fa-comments-o
  15. color white
  16. &__wrapper
  17. height calc(100% - 209px) /* height of chat__header + height of option + top of chat */
  18. &__messagelist
  19. padding 15px 35px
  20. list-style none
  21. &__item
  22. &__avatar
  23. position relative
  24. top 43px
  25. left -25px
  26. & > img
  27. width 45px
  28. height 45px
  29. border-radius 30px
  30. &__createhour
  31. margin-left 30px
  32. opacity 0.7
  33. font-size 14px
  34. &__content
  35. border 1px solid grey
  36. border-radius 5px
  37. padding 15px
  38. background-color off-white
  39. font-size 15px
  40. z-index -1
  41. color darkBlue
  42. &__texteditor
  43. &__simpletext
  44. &__input
  45. &:focus
  46. color darkBlue
  47. border-color darkBlue
  48. &__submit
  49. &__btn
  50. color darkBlue
  51. .sended
  52. .wsFileGeneric__messagelist__item__content
  53. margin-right 25%
  54. .received
  55. .wsFileGeneric__messagelist__item
  56. &__avatar
  57. left 93%
  58. &__createhour
  59. text-align right
  60. margin-right 50px
  61. &__content
  62. margin-left 25%
  63. background-color darkBlue
  64. color white
  65. .activeEditionTitle
  66. .wsFileThread
  67. &__header
  68. &__editionmode
  69. display block
  70. &__title
  71. display none
  72. @media (min-width: max-xs) and (max-width: max-lg)
  73. .wsContentThread
  74. &__texteditor
  75. padding 7px
  76. &__simpletext
  77. display inline-flex
  78. &__submit
  79. display inline-flex
  80. width 80px
  81. @media (min-width: min-sm) and (max-width: max-sm)
  82. .wsContentThread
  83. top 69px
  84. @media (max-width: max-xs)
  85. .wsContentThread
  86. top 69px
  87. width 100%
  88. box-shadow none
  89. z-index 1
  90. &__texteditor
  91. padding 7px
  92. &__simpletext
  93. display inline-flex
  94. margin-right 15px
  95. width 62%
  96. &__submit
  97. display inline-flex
  98. width 80px