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.

166 lines
2.6 KiB

  1. .activity-stream {
  2. box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
  3. border-radius: 4px;
  4. overflow: hidden;
  5. margin-bottom: 10px;
  6. text-align: left;
  7. @media screen and (max-width: $no-gap-breakpoint) {
  8. margin-bottom: 0;
  9. border-radius: 0;
  10. box-shadow: none;
  11. }
  12. &--headless {
  13. border-radius: 0;
  14. margin: 0;
  15. box-shadow: none;
  16. .detailed-status,
  17. .status {
  18. border-radius: 0 !important;
  19. }
  20. }
  21. div[data-component] {
  22. width: 100%;
  23. }
  24. .entry {
  25. background: $ui-base-color;
  26. .detailed-status,
  27. .status,
  28. .load-more {
  29. animation: none;
  30. }
  31. &:last-child {
  32. .detailed-status,
  33. .status,
  34. .load-more {
  35. border-bottom: 0;
  36. border-radius: 0 0 4px 4px;
  37. }
  38. }
  39. &:first-child {
  40. .detailed-status,
  41. .status,
  42. .load-more {
  43. border-radius: 4px 4px 0 0;
  44. }
  45. &:last-child {
  46. .detailed-status,
  47. .status,
  48. .load-more {
  49. border-radius: 4px;
  50. }
  51. }
  52. }
  53. @media screen and (max-width: 740px) {
  54. .detailed-status,
  55. .status,
  56. .load-more {
  57. border-radius: 0 !important;
  58. }
  59. }
  60. }
  61. &--highlighted .entry {
  62. background: lighten($ui-base-color, 8%);
  63. }
  64. }
  65. .button.logo-button {
  66. flex: 0 auto;
  67. font-size: 14px;
  68. background: $ui-highlight-color;
  69. color: $primary-text-color;
  70. text-transform: none;
  71. line-height: 36px;
  72. height: auto;
  73. padding: 3px 15px;
  74. border: 0;
  75. svg {
  76. width: 20px;
  77. height: auto;
  78. vertical-align: middle;
  79. margin-right: 5px;
  80. path:first-child {
  81. fill: $primary-text-color;
  82. }
  83. path:last-child {
  84. fill: $ui-highlight-color;
  85. }
  86. }
  87. &:active,
  88. &:focus,
  89. &:hover {
  90. background: lighten($ui-highlight-color, 10%);
  91. svg path:last-child {
  92. fill: lighten($ui-highlight-color, 10%);
  93. }
  94. }
  95. &.button--destructive {
  96. &:active,
  97. &:focus,
  98. &:hover {
  99. background: $error-red;
  100. svg path:last-child {
  101. fill: $error-red;
  102. }
  103. }
  104. }
  105. @media screen and (max-width: $no-gap-breakpoint) {
  106. svg {
  107. display: none;
  108. }
  109. }
  110. }
  111. .embed,
  112. .public-layout {
  113. .detailed-status {
  114. padding: 15px;
  115. }
  116. .status {
  117. padding: 15px 15px 15px (48px + 15px * 2);
  118. min-height: 48px + 2px;
  119. &__avatar {
  120. left: 15px;
  121. top: 17px;
  122. }
  123. &__content {
  124. padding-top: 5px;
  125. }
  126. &__prepend {
  127. margin-left: 48px + 15px * 2;
  128. padding-top: 15px;
  129. }
  130. &__prepend-icon-wrapper {
  131. left: -32px;
  132. }
  133. .media-gallery,
  134. &__action-bar,
  135. .video-player {
  136. margin-top: 10px;
  137. }
  138. }
  139. }