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

Render timeline separator for late event groups #11739

Merged
merged 20 commits into from
Oct 16, 2023
Merged

Render timeline separator for late event groups #11739

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
0b3482b
Use Compound tooltips on MessageTimestamp to improve UX of date time …
t3chguy Oct 11, 2023
42867a8
Show io.element.late_event in MessageTimestamp when known
t3chguy Oct 11, 2023
84ed907
Update snapshot
t3chguy Oct 11, 2023
251de35
Merge branch 't3chguy/fix/25913' into t3chguy/fix/25913.1
t3chguy Oct 11, 2023
5e6d845
Avoid needing new Compound changes
t3chguy Oct 11, 2023
7f1d947
Move groupers into their own directory
t3chguy Oct 12, 2023
8fb26e9
Refactor date separator code to be more generic
t3chguy Oct 12, 2023
c502d68
Render timeline separator for late event groups
t3chguy Oct 12, 2023
bdba475
Fix date used in copy
t3chguy Oct 12, 2023
b0bd25c
Update snapshot
t3chguy Oct 12, 2023
63984f4
Move groupers into their own directory
t3chguy Oct 12, 2023
afb3e0d
Merge branch 't3chguy/fix/25913.2' of github.com:matrix-org/matrix-re…
t3chguy Oct 16, 2023
58836c4
Update copy
t3chguy Oct 16, 2023
2444620
Update copy
t3chguy Oct 16, 2023
1c76cf0
Update snapshot
t3chguy Oct 16, 2023
f0d81b6
Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into…
t3chguy Oct 16, 2023
3eef51d
Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into…
t3chguy Oct 16, 2023
640c528
i18n
t3chguy Oct 16, 2023
7a9d81a
Add comments
t3chguy Oct 16, 2023
e3bee32
Add comments
t3chguy Oct 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions cypress/e2e/editing/editing.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@ describe("Editing", () => {
cy.get(".mx_EventTile").should("have.css", "padding-block-start", "0px");

// Assert that the date separator is rendered at the top
cy.get("li:nth-child(1) .mx_DateSeparator").within(() => {
cy.get("li:nth-child(1) .mx_TimelineSeparator").within(() => {
cy.get("h2").within(() => {
cy.findByText("today").should("have.css", "text-transform", "capitalize");
});
Expand Down Expand Up @@ -182,7 +182,7 @@ describe("Editing", () => {
// Assert that the message edit history dialog is rendered again
cy.get(".mx_MessageEditHistoryDialog").within(() => {
// Assert that the date is rendered
cy.get("li:nth-child(1) .mx_DateSeparator").within(() => {
cy.get("li:nth-child(1) .mx_TimelineSeparator").within(() => {
cy.get("h2").within(() => {
cy.findByText("today").should("have.css", "text-transform", "capitalize");
});
Expand Down
1 change: 1 addition & 0 deletions res/css/_components.pcss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -250,6 +250,7 @@
@import "./views/messages/_RedactedBody.pcss";
@import "./views/messages/_RoomAvatarEvent.pcss";
@import "./views/messages/_TextualEvent.pcss";
@import "./views/messages/_TimelineSeparator.pcss";
@import "./views/messages/_UnknownBody.pcss";
@import "./views/messages/_ViewSourceEvent.pcss";
@import "./views/messages/_common_CryptoEvent.pcss";
Expand Down
16 changes: 0 additions & 16 deletions res/css/views/messages/_DateSeparator.pcss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,22 +14,6 @@ See the License for the specific language governing permissions and
limitations under the License.
*/

.mx_DateSeparator {
clear: both;
margin: 4px 0;
display: flex;
align-items: center;
font: var(--cpd-font-body-md-regular);
color: $roomtopic-color;
}

.mx_DateSeparator > hr {
flex: 1 1 0;
height: 0;
border: none;
border-bottom: 1px solid $menu-selected-color;
}

.mx_DateSeparator_dateContent {
padding: 0 25px;
}
Expand Down
31 changes: 31 additions & 0 deletions res/css/views/messages/_TimelineSeparator.pcss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
/*
Copyright 2017 Vector Creations Ltd
t3chguy marked this conversation as resolved.
Show resolved Hide resolved

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

.mx_TimelineSeparator {
clear: both;
margin: 4px 0;
display: flex;
align-items: center;
font: var(--cpd-font-body-md-regular);
color: $roomtopic-color;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like a misuse of $roomtopic-color. Should probably be text secondary or something along those lines

Copy link
Member Author

@t3chguy t3chguy Oct 16, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These styles are not new, they're just broken out of 1 file into 2 files

}

.mx_TimelineSeparator > hr {
flex: 1 1 0;
height: 0;
border: none;
border-bottom: 1px solid $menu-selected-color;
}
2 changes: 1 addition & 1 deletion res/css/views/right_panel/_ThreadPanel.pcss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -112,7 +112,7 @@ limitations under the License.
/* Account for scrollbar when hovering */
padding-top: 0;

.mx_DateSeparator {
.mx_TimelineSeparator {
display: none;
}

Expand Down
Loading