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.

163 lines
2.5 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. .detailed-status {
  113. padding: 15px;
  114. }
  115. .status {
  116. padding: 15px 15px 15px (48px + 15px * 2);
  117. min-height: 48px + 2px;
  118. &__avatar {
  119. left: 15px;
  120. top: 17px;
  121. }
  122. &__content {
  123. padding-top: 5px;
  124. }
  125. &__prepend {
  126. margin-left: 48px + 15px * 2;
  127. padding-top: 15px;
  128. }
  129. &__prepend-icon-wrapper {
  130. left: -32px;
  131. }
  132. .media-gallery,
  133. &__action-bar,
  134. .video-player {
  135. margin-top: 10px;
  136. }
  137. }
  138. }