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.

201 lines
3.1 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. &--under-tabs {
  7. border-radius: 0 0 4px 4px;
  8. }
  9. @media screen and (max-width: $no-gap-breakpoint) {
  10. margin-bottom: 0;
  11. border-radius: 0;
  12. box-shadow: none;
  13. }
  14. &--headless {
  15. border-radius: 0;
  16. margin: 0;
  17. box-shadow: none;
  18. .detailed-status,
  19. .status {
  20. border-radius: 0 !important;
  21. }
  22. }
  23. div[data-component] {
  24. width: 100%;
  25. }
  26. .entry {
  27. background: $ui-base-color;
  28. .detailed-status,
  29. .status,
  30. .load-more {
  31. animation: none;
  32. }
  33. &:last-child {
  34. .detailed-status,
  35. .status,
  36. .load-more {
  37. border-bottom: 0;
  38. border-radius: 0 0 4px 4px;
  39. }
  40. }
  41. &:first-child {
  42. .detailed-status,
  43. .status,
  44. .load-more {
  45. border-radius: 4px 4px 0 0;
  46. }
  47. &:last-child {
  48. .detailed-status,
  49. .status,
  50. .load-more {
  51. border-radius: 4px;
  52. }
  53. }
  54. }
  55. @media screen and (max-width: 740px) {
  56. .detailed-status,
  57. .status,
  58. .load-more {
  59. border-radius: 0 !important;
  60. }
  61. }
  62. }
  63. &--highlighted .entry {
  64. background: lighten($ui-base-color, 8%);
  65. }
  66. }
  67. .button.logo-button {
  68. flex: 0 auto;
  69. font-size: 14px;
  70. background: $ui-highlight-color;
  71. color: $primary-text-color;
  72. text-transform: none;
  73. line-height: 1.2;
  74. height: auto;
  75. min-height: 36px;
  76. min-width: 88px;
  77. white-space: normal;
  78. overflow-wrap: break-word;
  79. hyphens: auto;
  80. padding: 0 15px;
  81. border: 0;
  82. svg {
  83. width: 20px;
  84. height: auto;
  85. vertical-align: middle;
  86. margin-right: 5px;
  87. fill: $primary-text-color;
  88. }
  89. &:active,
  90. &:focus,
  91. &:hover {
  92. background: lighten($ui-highlight-color, 10%);
  93. }
  94. &:disabled,
  95. &.disabled {
  96. &:active,
  97. &:focus,
  98. &:hover {
  99. background: $ui-primary-color;
  100. }
  101. }
  102. &.button--destructive {
  103. &:active,
  104. &:focus,
  105. &:hover {
  106. background: $error-red;
  107. }
  108. }
  109. @media screen and (max-width: $no-gap-breakpoint) {
  110. svg {
  111. display: none;
  112. }
  113. }
  114. }
  115. a.button.logo-button {
  116. display: inline-flex;
  117. align-items: center;
  118. justify-content: center;
  119. }
  120. .embed,
  121. .public-layout {
  122. .status__content[data-spoiler=folded] {
  123. .e-content {
  124. display: none;
  125. }
  126. p:first-child {
  127. margin-bottom: 0;
  128. }
  129. }
  130. .detailed-status {
  131. padding: 15px;
  132. .detailed-status__display-avatar .account__avatar {
  133. width: 48px;
  134. height: 48px;
  135. }
  136. }
  137. .status {
  138. padding: 15px 15px 15px (48px + 15px * 2);
  139. min-height: 48px + 2px;
  140. &__avatar {
  141. left: 15px;
  142. top: 17px;
  143. .account__avatar {
  144. width: 48px;
  145. height: 48px;
  146. }
  147. }
  148. &__content {
  149. padding-top: 5px;
  150. }
  151. &__prepend {
  152. margin-left: 48px + 15px * 2;
  153. padding-top: 15px;
  154. }
  155. &__prepend-icon-wrapper {
  156. left: -32px;
  157. }
  158. .media-gallery,
  159. &__action-bar,
  160. .video-player {
  161. margin-top: 10px;
  162. }
  163. &__action-bar-button {
  164. font-size: 18px;
  165. width: 23.1429px;
  166. height: 23.1429px;
  167. line-height: 23.15px;
  168. }
  169. }
  170. }