post.less 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. //
  2. // Posts List Post
  3. // --------------------------------------------------
  4. // Post unread border
  5. .post-new .panel-default {
  6. border-color: @brand-warning;
  7. }
  8. // Post header
  9. .post-heading {
  10. overflow: visible;
  11. height: 42px;
  12. &>* {
  13. float: left;
  14. margin-left: 0px;
  15. margin-right: 8px;
  16. &.pull-right {
  17. float: right;
  18. margin-left: 8px;
  19. margin-right: 0px;
  20. }
  21. }
  22. }
  23. .post-heading .btn-icon {
  24. margin: -6px 0px;
  25. margin-left: 8px;
  26. padding: 0px 3px;
  27. .material-icon {
  28. position: static;
  29. width: 28px;
  30. height: 28px;
  31. font-size: 28px;
  32. line-height: 28px;
  33. }
  34. }
  35. // Post status flags
  36. .post-status-message {
  37. padding: @padding-base-vertical @padding-base-horizontal;
  38. overflow: auto;
  39. .material-icon {
  40. float: left;
  41. font-size: 28px;
  42. }
  43. p {
  44. margin: 0px;
  45. margin-top: (28px - @line-height-computed) / 2;
  46. margin-left: 36px;
  47. }
  48. }
  49. .post-status-hidden {
  50. background-color: @brand-danger;
  51. color: #fff;
  52. }
  53. .post-status-unapproved {
  54. background-color: @brand-primary;
  55. color: #fff;
  56. }
  57. // Hidden post message
  58. .posts-list .panel-body-hidden {
  59. .lead, .text-muted {
  60. margin: 0px;
  61. }
  62. }
  63. // Invalid post message
  64. .posts-list .panel-body-invalid {
  65. .lead, .text-muted {
  66. margin: 0px;
  67. }
  68. }
  69. // Post attachments
  70. .post-attachments {
  71. @post-preview-width: 40px;
  72. td {
  73. position: @padding-base-vertical @padding-base-horizontal;
  74. }
  75. .post-attachment-preview {
  76. float: left;
  77. height: @post-preview-width;
  78. width: @post-preview-width;
  79. text-align: center;
  80. }
  81. .post-attachment {
  82. margin-left: @post-preview-width + 12px;
  83. }
  84. .post-thumbnail {
  85. display: block;
  86. background-size: cover;
  87. background-position: center;
  88. border-radius: @border-radius-small;
  89. width: @post-preview-width;
  90. height: @post-preview-width;
  91. }
  92. .material-icon {
  93. width: 28px;
  94. height: 28px;
  95. position: relative;
  96. top: 5px;
  97. font-size: 28px;
  98. line-height: 28px;
  99. &:link, &:active, &:visited, &:hover, &:focus {
  100. color: @gray-darker;
  101. text-decoration: none;
  102. }
  103. }
  104. .post-attachment-description {
  105. margin: 0px;
  106. padding: 0px;
  107. color: @text-muted;
  108. font-size: @font-size-small;
  109. }
  110. }
  111. // Post footer
  112. .post-footer {
  113. overflow: auto;
  114. .btn.pull-right {
  115. margin-left: @line-height-computed / 2;
  116. }
  117. }
  118. // UI Preview
  119. .posts-list.ui-preview {
  120. .post-heading .ui-preview-text {
  121. position: relative;
  122. top: 0px;
  123. }
  124. }