Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 4ef4f49

Browse files
authored
Merge pull request #6392 from SimonBrandner/task/cleanup-replies
2 parents f7767bf + 21eb299 commit 4ef4f49

File tree

9 files changed

+178
-165
lines changed

9 files changed

+178
-165
lines changed

res/css/views/elements/_ReplyThread.scss

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,19 +16,16 @@ limitations under the License.
1616

1717
.mx_ReplyThread {
1818
margin-top: 0;
19-
}
20-
21-
.mx_ReplyThread_show {
22-
cursor: pointer;
23-
}
24-
25-
blockquote.mx_ReplyThread {
2619
margin-left: 0;
2720
margin-right: 0;
2821
margin-bottom: 8px;
2922
padding-left: 10px;
3023
border-left: 4px solid $button-bg-color;
3124

25+
.mx_ReplyThread_show {
26+
cursor: pointer;
27+
}
28+
3229
&.mx_ReplyThread_color1 {
3330
border-left-color: $username-variant1-color;
3431
}

res/css/views/rooms/_ReplyPreview.scss

Lines changed: 28 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -22,33 +22,34 @@ limitations under the License.
2222
max-height: 50vh;
2323
overflow: auto;
2424
box-shadow: 0px -16px 32px $composer-shadow-color;
25-
}
26-
27-
.mx_ReplyPreview_section {
28-
border-bottom: 1px solid $primary-hairline-color;
29-
}
30-
31-
.mx_ReplyPreview_header {
32-
margin: 8px;
33-
color: $primary-fg-color;
34-
font-weight: 400;
35-
opacity: 0.4;
36-
}
3725

38-
.mx_ReplyPreview_tile {
39-
margin: 0 8px;
26+
.mx_ReplyPreview_section {
27+
border-bottom: 1px solid $primary-hairline-color;
28+
29+
.mx_ReplyPreview_header {
30+
margin: 8px;
31+
color: $primary-fg-color;
32+
font-weight: 400;
33+
opacity: 0.4;
34+
}
35+
36+
.mx_ReplyPreview_tile {
37+
margin: 0 8px;
38+
}
39+
40+
.mx_ReplyPreview_title {
41+
float: left;
42+
}
43+
44+
.mx_ReplyPreview_cancel {
45+
float: right;
46+
cursor: pointer;
47+
display: flex;
48+
}
49+
50+
.mx_ReplyPreview_clear {
51+
clear: both;
52+
}
53+
}
4054
}
4155

42-
.mx_ReplyPreview_title {
43-
float: left;
44-
}
45-
46-
.mx_ReplyPreview_cancel {
47-
float: right;
48-
cursor: pointer;
49-
display: flex;
50-
}
51-
52-
.mx_ReplyPreview_clear {
53-
clear: both;
54-
}

res/css/views/rooms/_ReplyTile.scss

Lines changed: 65 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,9 @@ limitations under the License.
1515
*/
1616

1717
.mx_ReplyTile {
18-
padding-top: 2px;
19-
padding-bottom: 2px;
20-
font-size: $font-14px;
2118
position: relative;
19+
padding: 2px 0;
20+
font-size: $font-14px;
2221
line-height: $font-16px;
2322

2423
&.mx_ReplyTile_audio .mx_MFileBody_info_icon::before {
@@ -38,86 +37,83 @@ limitations under the License.
3837
display: none;
3938
}
4039
}
41-
}
42-
43-
.mx_ReplyTile > a {
44-
display: flex;
45-
flex-direction: column;
46-
text-decoration: none;
47-
color: $primary-fg-color;
48-
}
49-
50-
.mx_ReplyTile .mx_RedactedBody {
51-
padding: 4px 0 2px 20px;
5240

53-
&::before {
54-
height: 13px;
55-
width: 13px;
56-
top: 5px;
41+
> a {
42+
display: flex;
43+
flex-direction: column;
44+
text-decoration: none;
45+
color: $primary-fg-color;
5746
}
58-
}
59-
60-
// We do reply size limiting with CSS to avoid duplicating the TextualBody component.
61-
.mx_ReplyTile .mx_EventTile_content {
62-
$reply-lines: 2;
63-
$line-height: $font-22px;
6447

65-
pointer-events: none;
48+
.mx_RedactedBody {
49+
padding: 4px 0 2px 20px;
6650

67-
text-overflow: ellipsis;
68-
display: -webkit-box;
69-
-webkit-box-orient: vertical;
70-
-webkit-line-clamp: $reply-lines;
71-
line-height: $line-height;
72-
73-
.mx_EventTile_body.mx_EventTile_bigEmoji {
74-
line-height: $line-height !important;
75-
// Override the big emoji override
76-
font-size: $font-14px !important;
51+
&::before {
52+
height: 13px;
53+
width: 13px;
54+
top: 5px;
55+
}
7756
}
7857

79-
// Hide line numbers
80-
.mx_EventTile_lineNumbers {
81-
display: none;
82-
}
58+
// We do reply size limiting with CSS to avoid duplicating the TextualBody component.
59+
.mx_EventTile_content {
60+
$reply-lines: 2;
61+
$line-height: $font-22px;
62+
63+
pointer-events: none;
8364

84-
// Hack to cut content in <pre> tags too
85-
.mx_EventTile_pre_container > pre {
86-
overflow: hidden;
8765
text-overflow: ellipsis;
8866
display: -webkit-box;
8967
-webkit-box-orient: vertical;
9068
-webkit-line-clamp: $reply-lines;
91-
padding: 4px;
69+
line-height: $line-height;
70+
71+
.mx_EventTile_body.mx_EventTile_bigEmoji {
72+
line-height: $line-height !important;
73+
font-size: $font-14px !important; // Override the big emoji override
74+
}
75+
76+
// Hide line numbers
77+
.mx_EventTile_lineNumbers {
78+
display: none;
79+
}
80+
81+
// Hack to cut content in <pre> tags too
82+
.mx_EventTile_pre_container > pre {
83+
overflow: hidden;
84+
text-overflow: ellipsis;
85+
display: -webkit-box;
86+
-webkit-box-orient: vertical;
87+
-webkit-line-clamp: $reply-lines;
88+
padding: 4px;
89+
}
90+
91+
.markdown-body blockquote,
92+
.markdown-body dl,
93+
.markdown-body ol,
94+
.markdown-body p,
95+
.markdown-body pre,
96+
.markdown-body table,
97+
.markdown-body ul {
98+
margin-bottom: 4px;
99+
}
92100
}
93101

94-
.markdown-body blockquote,
95-
.markdown-body dl,
96-
.markdown-body ol,
97-
.markdown-body p,
98-
.markdown-body pre,
99-
.markdown-body table,
100-
.markdown-body ul {
101-
margin-bottom: 4px;
102+
&.mx_ReplyTile_info {
103+
padding-top: 0;
102104
}
103-
}
104105

105-
.mx_ReplyTile.mx_ReplyTile_info {
106-
padding-top: 0;
107-
}
106+
.mx_SenderProfile {
107+
font-size: $font-14px;
108+
line-height: $font-17px;
108109

109-
.mx_ReplyTile .mx_SenderProfile {
110-
color: $primary-fg-color;
111-
font-size: $font-14px;
112-
display: inline-block; /* anti-zalgo, with overflow hidden */
113-
overflow: hidden;
114-
cursor: pointer;
115-
padding-left: 0; /* left gutter */
116-
padding-bottom: 0;
117-
padding-top: 0;
118-
margin: 0;
119-
line-height: $font-17px;
120-
/* the next three lines, along with overflow hidden, truncate long display names */
121-
white-space: nowrap;
122-
text-overflow: ellipsis;
110+
display: inline-block; // anti-zalgo, with overflow hidden
111+
padding: 0;
112+
margin: 0;
113+
114+
// truncate long display names
115+
overflow: hidden;
116+
white-space: nowrap;
117+
text-overflow: ellipsis;
118+
}
123119
}

src/ActiveRoomObserver.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ limitations under the License.
1515
*/
1616

1717
import RoomViewStore from './stores/RoomViewStore';
18+
import { EventSubscription } from 'fbemitter';
1819

1920
type Listener = (isActive: boolean) => void;
2021

@@ -30,7 +31,7 @@ type Listener = (isActive: boolean) => void;
3031
export class ActiveRoomObserver {
3132
private listeners: {[key: string]: Listener[]} = {};
3233
private _activeRoomId = RoomViewStore.getRoomId();
33-
private readonly roomStoreToken: string;
34+
private readonly roomStoreToken: EventSubscription;
3435

3536
constructor() {
3637
// TODO: We could self-destruct when the last listener goes away, or at least stop listening.

0 commit comments

Comments
 (0)