comments.css 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. .new-comment {
  2. position: relative;
  3. margin: 0 0 20px 38px;
  4. }
  5. .new-comment .member {
  6. opacity: 0.7;
  7. position: absolute;
  8. top: 1px;
  9. left: -38px;
  10. }
  11. .new-comment.is-open .member {
  12. opacity: 1;
  13. }
  14. .new-comment.is-open .helper {
  15. display: inline-block;
  16. }
  17. .new-comment.is-open textarea {
  18. min-height: 100px;
  19. color: #4d4d4d;
  20. cursor: auto;
  21. overflow: hidden;
  22. word-wrap: break-word;
  23. }
  24. .new-comment .too-long {
  25. margin-top: 8px;
  26. }
  27. .new-comment textarea {
  28. background-color: #fff;
  29. border: 0;
  30. box-shadow: 0 1px 2px rgba(0,0,0,0.23);
  31. height: 36px;
  32. margin: 4px 4px 6px 0;
  33. padding: 9px 11px;
  34. width: 100%;
  35. }
  36. .new-comment textarea:hover,
  37. .new-comment textarea:is-open {
  38. background-color: #fff;
  39. box-shadow: 0 1px 3px rgba(0,0,0,0.33);
  40. border: 0;
  41. cursor: pointer;
  42. }
  43. .new-comment textarea:is-open {
  44. cursor: auto;
  45. }
  46. .comment-item {
  47. background-color: #fff;
  48. border: 0;
  49. box-shadow: 0 1px 2px rgba(0,0,0,0.23);
  50. color: #8c8c8c;
  51. height: 36px;
  52. margin: 4px 4px 6px 0;
  53. width: 92%;
  54. }
  55. .comment-item:hover {
  56. background: #e0e0e0;
  57. }
  58. .comment-item.add-comment {
  59. display: flex;
  60. margin: 5px;
  61. }
  62. .comment-item.add-comment a {
  63. display: block;
  64. margin: auto;
  65. }