Skip to content

FOUR-30502: Align Prospect Process Screens with Mockups#8770

Closed
eiresendez wants to merge 1 commit intodevelopfrom
task/FOUR-30502
Closed

FOUR-30502: Align Prospect Process Screens with Mockups#8770
eiresendez wants to merge 1 commit intodevelopfrom
task/FOUR-30502

Conversation

@eiresendez
Copy link
Copy Markdown
Contributor

Issue & Reproduction Steps

FOUR-30502: Align Prospect Process Screens with Mockups
Ticket: https://processmaker.atlassian.net/browse/FOUR-30502

Prospect process screens used inconsistent wrapper styling and some read-only/mobile renderers were not applying the screen custom CSS, causing visible drift from the intended mockup styling.

  1. Open a Prospect process from the Processes Catalogue and compare the launchpad screen header/body styling against the expected mockup shell.
  2. Open a Prospect task, the request summary, and the printable form preview on desktop and mobile paths; note inconsistent spacing, framing, and missing custom screen styling in read-only views.

Solution

  • Added a shared Prospect-specific shell stylesheet and applied it to process launchpad, task edit/preview, request detail/preview, and mobile request/task views so Prospect screens render inside a consistent framed layout.
  • Updated the Prospect launchpad Vue components to detect Prospect processes and wrap the screen/header with the new shell classes without changing screen submission behavior.
  • Wrapped request summary and printable/read-only screen renderers in the same Prospect shell and passed through screen custom CSS/computed/watchers where those read-only renderers were previously missing them.
  • Extended the same Prospect shell treatment to mobile task and mobile request summary screens for consistent layout, spacing, and visual polish across the full Prospect flow.

How to Test

  1. Open the Prospect process in Processes Catalogue on desktop and mobile; confirm the header and screen body render inside the new bordered/rounded shell and still load normally.
  2. Open an active Prospect task on desktop and mobile; confirm the task form renders inside the new shell, buttons still work, and no submission behavior changed.
  3. Open a Prospect request with summary/request-detail screens and verify those screens keep their custom CSS while matching the new spacing/frame treatment.
  4. Open the request form print preview and the Forms tab screen previews; confirm the printable/read-only screens now honor custom styling and render consistently with the Prospect shell.

Related Tickets & Packages

@processmaker-sonarqube
Copy link
Copy Markdown

Quality Gate passed Quality Gate passed

Issues
0 New issues
0 Fixed issues
0 Accepted issues

Measures
0 Security Hotspots
No data about Coverage
No data about Duplication

See analysis details on SonarQube

@eiresendez eiresendez closed this Apr 8, 2026
@eiresendez eiresendez deleted the task/FOUR-30502 branch April 8, 2026 20:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant