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.

190 lines
2.9 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: 36px;
  74. height: auto;
  75. padding: 3px 15px;
  76. border: 0;
  77. svg {
  78. width: 20px;
  79. height: auto;
  80. vertical-align: middle;
  81. margin-right: 5px;
  82. fill: $primary-text-color;
  83. }
  84. &:active,
  85. &:focus,
  86. &:hover {
  87. background: lighten($ui-highlight-color, 10%);
  88. }
  89. &:disabled,
  90. &.disabled {
  91. &:active,
  92. &:focus,
  93. &:hover {
  94. background: $ui-primary-color;
  95. }
  96. }
  97. &.button--destructive {
  98. &:active,
  99. &:focus,
  100. &:hover {
  101. background: $error-red;
  102. }
  103. }
  104. @media screen and (max-width: $no-gap-breakpoint) {
  105. svg {
  106. display: none;
  107. }
  108. }
  109. }
  110. .embed,
  111. .public-layout {
  112. .status__content[data-spoiler=folded] {
  113. .e-content {
  114. display: none;
  115. }
  116. p:first-child {
  117. margin-bottom: 0;
  118. }
  119. }
  120. .detailed-status {
  121. padding: 15px;
  122. .detailed-status__display-avatar .account__avatar {
  123. width: 48px;
  124. height: 48px;
  125. }
  126. }
  127. .status {
  128. padding: 15px 15px 15px (48px + 15px * 2);
  129. min-height: 48px + 2px;
  130. &__avatar {
  131. left: 15px;
  132. top: 17px;
  133. .account__avatar {
  134. width: 48px;
  135. height: 48px;
  136. }
  137. }
  138. &__content {
  139. padding-top: 5px;
  140. }
  141. &__prepend {
  142. margin-left: 48px + 15px * 2;
  143. padding-top: 15px;
  144. }
  145. &__prepend-icon-wrapper {
  146. left: -32px;
  147. }
  148. .media-gallery,
  149. &__action-bar,
  150. .video-player {
  151. margin-top: 10px;
  152. }
  153. &__action-bar-button {
  154. font-size: 18px;
  155. width: 23.1429px;
  156. height: 23.1429px;
  157. line-height: 23.15px;
  158. }
  159. }
  160. }