OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Improve clickability of "collapse" link button on bubble layout (#9037)

pull/28788/head^2
Suguru Hirahara 2022-07-16 09:31:29 +00:00 committed by GitHub
parent 48552c2342
commit 161a333a51
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
cypress/e2e/14-timeline/timeline.spec.ts
View File

@ -23,6 +23,7 @@ import type { EventType } from "matrix-js-sdk/src/@types/event";
import type { MatrixClient } from "matrix-js-sdk/src/client";
import { SynapseInstance } from "../../plugins/synapsedocker";
import { SettingLevel } from "../../../src/settings/SettingLevel";
import { Layout } from "../../../src/settings/enums/Layout";
import Chainable = Cypress.Chainable;
// The avatar size used in the timeline
@ -141,5 +142,22 @@ describe("Timeline", () => {
expectAvatar(e, newAvatarUrl);
});
});
it("should click 'collapse' link button on the first hovered info event line on bubble layout", () => {
cy.visit("/#/room/" + roomId);
cy.setSettingValue("layout", null, SettingLevel.DEVICE, Layout.Bubble);
cy.contains(".mx_RoomView_body .mx_GenericEventListSummary[data-layout=bubble] " +
".mx_GenericEventListSummary_summary", "created and configured the room.");
// Click "expand" link button
cy.get(".mx_GenericEventListSummary_toggle[aria-expanded=false]").click();
// Click "collapse" link button on the first hovered info event line
cy.get(".mx_GenericEventListSummary_unstyledList .mx_EventTile_info:first-of-type").realHover()
.get(".mx_GenericEventListSummary_toggle[aria-expanded=true]").click({ force: false });
// Make sure "collapse" link button worked
cy.get(".mx_GenericEventListSummary_toggle[aria-expanded=false]");
});
});
});

12
res/css/views/messages/_MessageActionBar.pcss
View File

@ -54,6 +54,18 @@ limitations under the License.
left: -58px;
z-index: -1;
cursor: initial;
/* stylelint-disable-next-line max-line-length */
.mx_GenericEventListSummary[data-layout="bubble"] .mx_GenericEventListSummary_toggle ~ .mx_GenericEventListSummary_unstyledList .mx_EventTile_info:first-of-type & {
// improve clickability of "collapse" link button on bubble layout by reducing width and height values
// mx_GenericEventListSummary_toggle ~: to apply rules to action bar when "collapse" button is available
// mx_EventTile_info:first-of-type: to apply rules to the info event tile just under "collapse" button
// TODO: use a new class name instead
width: 100%;
height: 100%;
top: 0;
left: 0;
}
}
>* {