fix: confirmation screen with in expanded extension view

[jpuri]

Description

Fix width of confirmation pages in expanded view.

Related issues

Fixes: #26937

Manual testing steps

1. Go to test dapp
2. Submit signature
3. Open signature in expanded view - it should have small page width

Screenshots/Recordings

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[jpuri]

This value 360px is taken from figma designs https://www.figma.com/design/H52Ob2wDWsPY4g9DeYuCLk/Confirmation-redesign-V6?node-id=3433-27766&node-type=FRAME&t=N7Ij9OuBbvoIlqrJ-0

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 70.17%. Comparing base (8ffbb54) to head (e443374).
Report is 4 commits behind head on develop.

Additional details and impacted files

@@           Coverage Diff            @@
##           develop   #26965   +/-   ##
========================================
  Coverage    70.17%   70.17%           
========================================
  Files         1425     1425           
  Lines        49647    49647           
  Branches     13889    13889           
========================================
  Hits         34836    34836           
  Misses       14811    14811           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[metamaskbot]

Builds ready [e443374]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• builds (MMI): chrome, firefox
• builds (test): chrome, firefox
• builds (test-flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4, 5
  • common: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9
  • content-script: 0
  • offscreen: 0
  • ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (2028 ± 138 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	341	2602	1945	476	229
		domContentLoaded	1641	2486	2004	277	133
		load	1654	2606	2028	288	138
		domInteractive	13	150	45	34	16

Bundle size diffs

• background: 0 Bytes (0.00%)
• ui: 0 Bytes (0.00%)
• common: 0 Bytes (0.00%)

[digiwand]

Hello @jpuri! I'm unsure this is the final, intended design for our redesign confirmations. Can we confirm this with design?
cc: @SayaGT

A couple of concerns:

• Although 360px is used for the figma design, I wonder if it was designed to be the max-width of the UI. 360px is smaller than the original confirmation width 408px
• The height extends to the full height of the display. This can introduce more empty space (please see images below). The other

Current non-redesign transaction screen:

Current redesign confirmations, after this PR has been merged:

[digiwand]

another design inquiry is the padding on top and bottom. In full-screen mode, there is padding on top whereas below there is no padding. What would be the desired padding here?

[digiwand]

before screenshot: