You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

126 lines
2.4 KiB

  1. /*
  2. * # Activity Feed View
  3. * http://github.com/quirkyinc/semantic
  4. *
  5. *
  6. * Copyright 2013 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. * Released: May 22, 2013
  11. */
  12. /*******************************
  13. Activity Feed
  14. *******************************/
  15. .ui.feed a {
  16. cursor: pointer;
  17. }
  18. .ui.feed,
  19. .ui.feed .event,
  20. .ui.feed .label,
  21. .ui.feed .content,
  22. .ui.feed .extra {
  23. -webkit-box-sizing: border-box;
  24. -moz-box-sizing: border-box;
  25. -ms-box-sizing: border-box;
  26. box-sizing: border-box;
  27. }
  28. /*******************************
  29. Content
  30. *******************************/
  31. /* Event */
  32. .ui.feed .event {
  33. width: 100%;
  34. display: table;
  35. padding: 1em;
  36. }
  37. .ui.feed .event:first-child {
  38. border-top: 0px;
  39. }
  40. .ui.feed .event:last-child {
  41. margin-bottom: 1em;
  42. }
  43. /* Event Label */
  44. .ui.feed .label {
  45. width: 3em;
  46. display: table-cell;
  47. vertical-align: top;
  48. text-align: left;
  49. }
  50. .ui.feed .label .icon {
  51. font-size: 1.5em;
  52. margin: 0em;
  53. }
  54. .ui.feed .label img {
  55. width: 3em;
  56. margin: 0em;
  57. border-radius: 50em;
  58. }
  59. .ui.feed .label + .content {
  60. padding: 0.75em 1em 0em;
  61. }
  62. /* Content */
  63. .ui.feed .content {
  64. display: table-cell;
  65. vertical-align: top;
  66. text-align: left;
  67. word-wrap: break-word;
  68. }
  69. /* Date */
  70. .ui.feed .content .date {
  71. float: right;
  72. padding-left: 1em;
  73. color: rgba(0, 0, 0, 0.4);
  74. }
  75. /* Summary */
  76. .ui.feed .content .summary {
  77. color: rgba(0, 0, 0, 0.75);
  78. }
  79. .ui.feed .content .summary img {
  80. display: inline-block;
  81. margin-right: 0.25em;
  82. width: 4em;
  83. border-radius: 500px;
  84. }
  85. /* Additional Information */
  86. .ui.feed .content .extra {
  87. margin: 1em 0em 0em;
  88. padding: 0.5em 0em 0em;
  89. color: rgba(0, 0, 0, 0.5);
  90. }
  91. .ui.feed .content .extra.images img {
  92. display: inline-block;
  93. margin-right: 0.25em;
  94. width: 6em;
  95. }
  96. .ui.feed .content .extra.text {
  97. padding: 0.5em 1em;
  98. border-left: 0.2em solid rgba(0, 0, 0, 0.1);
  99. }
  100. /*******************************
  101. Variations
  102. *******************************/
  103. .ui.small.feed {
  104. font-size: 0.875em;
  105. }
  106. .ui.small.feed .label img {
  107. width: 2.5em;
  108. }
  109. .ui.small.feed .label .icon {
  110. font-size: 1.25em;
  111. }
  112. .ui.feed .event {
  113. padding: 0.75em 0em;
  114. }
  115. .ui.small.feed .label + .content {
  116. padding: 0.5em 0.5em 0;
  117. }
  118. .ui.small.feed .content .extra.images img {
  119. width: 5em;
  120. }
  121. .ui.small.feed .content .extra {
  122. margin: 0.5em 0em 0em;
  123. }
  124. .ui.small.feed .content .extra.text {
  125. padding: 0.25em 0.5em;
  126. }