_comment.scss 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. .main-container {
  2. .page-comment-main {
  3. // delete button
  4. .page-comment-control {
  5. position: absolute;
  6. display: none; // default hidden
  7. top: 0;
  8. right: 0;
  9. }
  10. }
  11. // modal
  12. .page-comment-delete-modal .modal-content {
  13. .modal-body {
  14. .comment-body {
  15. // scrollable
  16. overflow-y: auto;
  17. max-height: 13em;
  18. }
  19. }
  20. }
  21. }
  22. .main-container .crowi-sidebar .side-content { // styles only for original crowi
  23. .page-comments {
  24. margin: 8px 0 0 0;
  25. .page-comment-form {
  26. margin-top: 16px;
  27. .comment-form {
  28. }
  29. .comment-form-main {
  30. .comment-form-comment {
  31. height: 60px;
  32. }
  33. .comment-submit {
  34. margin-top: 8px;
  35. text-align: right;
  36. }
  37. }
  38. }
  39. .page-comments-list {
  40. .page-comment {
  41. margin-top: 8px;
  42. padding-top: 8px;
  43. border-top: solid 1px #ccc;
  44. .picture {
  45. float: left;
  46. width: 24px;
  47. height: 24px;
  48. }
  49. .page-comment-creator {
  50. font-weight: bold;
  51. }
  52. .page-comment-main {
  53. position: relative;
  54. margin-left: 40px;
  55. .page-comment-meta {
  56. color: #aaa;
  57. font-size: .9em;
  58. }
  59. .page-comment-body {
  60. padding: 8px 0;
  61. word-wrap: break-word;
  62. }
  63. .page-comment-control {
  64. position: absolute;
  65. display: none; // default hidden
  66. top: 0;
  67. right: 0;
  68. }
  69. }
  70. // show controls when hover
  71. .page-comment-main:hover > .page-comment-control {
  72. display: block;
  73. }
  74. }
  75. }
  76. }
  77. } // .main-container aside.sidebar .side-content
  78. .main-container {
  79. .page-comments {
  80. .page-comments-list-toggle-newer,
  81. .page-comments-list-toggle-older {
  82. text-align: center;
  83. display: block;
  84. margin: 8px;
  85. font-size: .9em;
  86. color: #999;
  87. }
  88. // older comments
  89. .page-comments-list-older .page-comment {
  90. }
  91. // newer comments
  92. .page-comments-list-newer .page-comment {
  93. opacity: .7;
  94. &:hover {
  95. opacity: 1;
  96. }
  97. }
  98. }
  99. }