Fix timeline search bar being overlapped by the right panel (#10809)

* Set zero min-width to prevent input area blowout

* Set min-width values to mx_SearchBar_input and mx_SearchBar_button

* Prevent the input area and cancel button from being overlapped by BaseCard

* Use custom properties: --size-button-search

* Take Percy snapshot of mx_SearchBar

* Apply suggestions from code review

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Edit a comment

* Feedback

* Edit a comment

* Update cypress/e2e/timeline/timeline.spec.ts

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
This commit is contained in:
Suguru Hirahara 2023-05-15 11:58:59 +00:00 committed by GitHub
parent d213dff4c6
commit 4d59a6ff1f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 4 deletions

View file

@ -714,6 +714,12 @@ describe("Timeline", () => {
cy.visit("/#/room/" + roomId);
cy.get(".mx_RoomHeader").findByRole("button", { name: "Search" }).click();
cy.get(".mx_SearchBar").percySnapshotElement("Search bar on the timeline", {
// Emulate narrow timeline
widths: [320, 640],
});
cy.get(".mx_SearchBar_input input").type("Message{enter}");
cy.get(".mx_EventTile:not(.mx_EventTile_contextual) .mx_EventTile_searchHighlight").should("exist");