diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index bab33953a..1012903e4 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -502,7 +502,7 @@ class Status extends ImmutablePureComponent {
if (rebloggedByText && status.get('in_reply_to_id')) {
quote = ancestorsText ?
-
+
{ancestorsText}
diff --git a/app/javascript/mastodon/containers/status_container.js b/app/javascript/mastodon/containers/status_container.js
index 03bcc9d8a..f7808e247 100644
--- a/app/javascript/mastodon/containers/status_container.js
+++ b/app/javascript/mastodon/containers/status_container.js
@@ -77,7 +77,7 @@ const makeMapStateToProps = () => {
const getAncestorsText = createSelector([
(_, {ids}) => ids,
state => state.get('statuses'),
- ], (ids, statuses) => ids.map(i => {
+ ], (ids, statuses) => '>> '+ids.map(i => {
let text = statuses.get(i) ? statuses.get(i).get('search_index') : i;
if(text.length > 16)
text = text.slice(0,13) + "...";
diff --git a/app/javascript/styles/closed-social/global.scss b/app/javascript/styles/closed-social/global.scss
index 3f9d1096e..a9785928c 100644
--- a/app/javascript/styles/closed-social/global.scss
+++ b/app/javascript/styles/closed-social/global.scss
@@ -48,7 +48,6 @@ div {
}
.status__quote__wrapper {
- margin-top:16px;
border-left: 5px solid #dbdbdb80;
background: #dbdbdb40;
@@ -66,9 +65,9 @@ div {
}
.status__tree__quote__wrapper {
- margin-top:16px;
padding: 10px 5px;
background: #dbdbdb40;
+ cursor: pointer;
}
@keyframes like {
diff --git a/app/javascript/styles/closed-social/timeline_comments.scss b/app/javascript/styles/closed-social/timeline_comments.scss
index b220bf9a7..e82944f16 100644
--- a/app/javascript/styles/closed-social/timeline_comments.scss
+++ b/app/javascript/styles/closed-social/timeline_comments.scss
@@ -1,30 +1,33 @@
.comments-timeline {
- max-height: 160px;
+ max-height: 160px;
min-width: 60%;
- overflow: hidden;
- -webkit-mask-image: linear-gradient(#1a1a1a,transparent);
- mask-image: linear-gradient(#1a1a1a,transparent);
- transform: scale(0.85);
- transform-origin: 100% 0%;
- margin-bottom: -32px;
+ overflow: hidden;
+ -webkit-mask-image: linear-gradient(#1a1a1a,transparent);
+ mask-image: linear-gradient(#1a1a1a,transparent);
+ transform: scale(0.85);
+ transform-origin: 100% 0%;
+ margin-bottom: -32px;
margin-right:8px;
position: absolute;
z-index:9;
- &:hover {
- max-height: none;
- -webkit-mask-image: none;
- mask-image: none;
+ &:hover {
+ max-height: 60vh;
+ overflow-y: auto;
+ -webkit-mask-image: none;
+ mask-image: none;
z-index:99;
background: $tc-background;
box-shadow: $primary-text-color 3.2px 3.2px 8px;
- }
- &:active {
- max-height: none;
- -webkit-mask-image: none;
- mask-image: none;
+ }
+ &:active {
+ max-height: 60vh;
+ overflow-y: auto;
+ -webkit-mask-image: none;
+ mask-image: none;
+ z-index:99;
background: $tc-background;
box-shadow: $primary-text-color 3.2px 3.2px 8px;
- }
+ }
& .comments-timeline-2 {
margin-left:42px;
}