ewilliams28/openclaw
1
0
Fork 0
mirror of https://github.com/openclaw/openclaw.git synced 2026-08-27 04:47:03 -06:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): compact touch tool rows (#128839)

Browse Source 
Co-authored-by: roboclaw-bot <309084314+roboclaw-bot@users.noreply.github.com>
Co-authored-by: Tak Hoffman <781889+Takhoffman@users.noreply.github.com>
This commit is contained in:
RoboClaw
2026-08-24 12:43:53 -07:00
committed by GitHub
parent 636b00cb04
commit b4c620b157
2 changed files with 26 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/pages/chat/chat-responsive.browser.test.ts
+26 -7
View File
@@ -1299,10 +1299,11 @@ describeBrowserLayout.concurrent("chat responsive browser layout", () => {
});
it.each([
[430, 720],
[1366, 900],
] as const)("keeps activity disclosures compact at %sx%s", async (width, height) => {
const page = await openBrowserPage(width, height);
{ label: "narrow desktop", width: 430, height: 720, hasTouch: false },
{ label: "desktop", width: 1366, height: 900, hasTouch: false },
{ label: "mobile touch", width: 430, height: 720, hasTouch: true },
])("keeps activity disclosures compact on $label", async ({ width, height, hasTouch }) => {
const page = await openBrowserPage(width, height, { hasTouch, isolated: true });
try {
await page.setContent(
`<!doctype html><html><head><style>${readUiCss()}</style></head><body>${activityAlignmentHtml()}</body></html>`,
@@ -1320,21 +1321,39 @@ describeBrowserLayout.concurrent("chat responsive browser layout", () => {
const activity = document.querySelector<HTMLElement>(".chat-activity-group__summary")!;
const label = activity.querySelector<HTMLElement>(".chat-activity-group__label")!;
const chevron = activity.querySelector<HTMLElement>(".chat-tool-row__chevron")!;
const toolRows = [
...document.querySelectorAll<HTMLElement>(
".chat-activity-group__body .chat-tool-msg-summary",
),
];
const firstToolStyle = getComputedStyle(toolRows[0]!);
const firstToolRect = toolRows[0]!.getBoundingClientRect();
const secondToolRect = toolRows[1]!.getBoundingClientRect();
return {
activity: getComputedStyle(activity).userSelect,
activityBackground: getComputedStyle(activity).backgroundColor,
activityPaddingBlock: [
getComputedStyle(activity).paddingTop,
getComputedStyle(activity).paddingBottom,
],
chevronGap: chevron.getBoundingClientRect().left - label.getBoundingClientRect().right,
tool: getComputedStyle(document.querySelector<HTMLElement>(".chat-tool-msg-summary")!)
.userSelect,
tool: firstToolStyle.userSelect,
toolPaddingBlock: [firstToolStyle.paddingTop, firstToolStyle.paddingBottom],
toolRowGap: secondToolRect.top - firstToolRect.bottom,
};
});
expect(styles).toEqual({
const { toolRowGap, ...disclosureStyles } = styles;
expect(disclosureStyles).toEqual({
activity: "text",
activityBackground: "rgba(0, 0, 0, 0)",
activityPaddingBlock: hasTouch ? ["8px", "8px"] : ["5px", "5px"],
// Summary gap (8px) less the chevron's own -3px inset.
chevronGap: 5,
tool: "text",
toolPaddingBlock: ["3px", "3px"],
});
expect(toolRowGap).toBeGreaterThanOrEqual(0);
expect(toolRowGap).toBeLessThanOrEqual(2);
} finally {
await closeBrowserPage(page);
}
ui/src/styles/chat/tool-cards.css
-1
View File
@@ -2254,7 +2254,6 @@ openclaw-tooltip.chat-tasks-status__preview {
}
@media (pointer: coarse) {
.chat-tool-msg-summary,
.chat-activity-group__summary {
padding-top: 8px;
padding-bottom: 8px;