diff --git a/packages/dashboard/app/components/TaskCard.css b/packages/dashboard/app/components/TaskCard.css
index 5afe995f06..6060fb964e 100644
--- a/packages/dashboard/app/components/TaskCard.css
+++ b/packages/dashboard/app/components/TaskCard.css
@@ -1299,6 +1299,7 @@
.card-promote-action.card-send-back-btn {
gap: var(--space-xs);
padding: var(--space-xs) var(--space-sm);
+ margin-left: auto;
border: var(--btn-border-width) solid color-mix(in srgb, var(--text-muted) 30%, transparent);
background: color-mix(in srgb, var(--text-muted) 12%, transparent);
color: var(--text);
@@ -1435,6 +1436,10 @@
opacity: 1;
}
+ .card-promote-action.card-send-back-btn {
+ margin-left: auto;
+ }
+
/* Card: compact progress bar on narrow cards */
.card-progress {
gap: var(--space-xs);
diff --git a/packages/dashboard/app/components/__tests__/TaskCard.test.tsx b/packages/dashboard/app/components/__tests__/TaskCard.test.tsx
index 5ed7e9a56d..2922370fb5 100644
--- a/packages/dashboard/app/components/__tests__/TaskCard.test.tsx
+++ b/packages/dashboard/app/components/__tests__/TaskCard.test.tsx
@@ -4385,6 +4385,46 @@ describe("TaskCard mission badge", () => {
expect(actionRow).not.toBeNull();
expect(actionRow?.contains(promoteButton)).toBe(true);
expect(css).toMatch(/\.card-promote-action\s*\{[^}]*margin-left:\s*auto;[^}]*\}/);
+ expect(css).toMatch(/\.card-promote-action\.card-send-back-btn\s*\{[^}]*margin-left:\s*auto;[^}]*\}/);
+ });
+
+ it("keeps the promote action right-aligned in the mobile card action row", () => {
+ const css = loadAllAppCss();
+ const onPromote = vi.fn().mockResolvedValue(undefined);
+
+ const soloRender = render(
+ ,
+ );
+
+ const soloPromoteButton = screen.getByTestId("card-promote-FN-782");
+ expect(soloPromoteButton.closest(".card-action-row")?.children).toHaveLength(1);
+ expect(soloPromoteButton).toHaveClass("card-promote-action", "card-send-back-btn");
+ soloRender.unmount();
+
+ render(
+ ,
+ );
+
+ const createPrButton = screen.getByRole("button", { name: "Create pull request" });
+ const promoteButton = screen.getByTestId("card-promote-FN-783");
+ const actionRow = promoteButton.closest(".card-action-row");
+
+ expect(actionRow).not.toBeNull();
+ expect(actionRow?.contains(createPrButton)).toBe(true);
+ expect(createPrButton.compareDocumentPosition(promoteButton) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+ expect(css).toMatch(/@media[^{}]*\(max-width:\s*768px\)[^{]*\{[\s\S]*?\.card-promote-action\.card-send-back-btn\s*\{[^}]*margin-left:\s*auto;[^}]*\}/);
});
it("calls onPromote without opening the card when promote is clicked", () => {