fix: removing opacity from deprecated popover overlay

[georgewrmarshall]

Description

This PR updates the deprecated popover(modal) overlay by removing the CSS opacity property and relying solely on the CSS design token variable to handle the overlay opacity. This change aims to enhance the visual hierarchy of modals across both light and dark modes by making the overlay darker, thus improving focus on the modal content.

• Removed the CSS opacity property from the modal overlay styling.
• Adjusted the modal overlay to utilize the opacity defined in the CSS design token variable, ensuring consistency and improved visual hierarchy.

Related issues

Fixes: N/A https://consensys.slack.com/archives/C0354T27M5M/p1708550530267829?thread_ts=1708546286.489159&cid=C0354T27M5M

Manual testing steps

1. Open the application and trigger a modal to appear.
2. Observe the modal overlay in both light and dark modes.
3. Verify that the overlay is appropriately darker, enhancing the focus on the modal content.

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I’ve followed MetaMask Coding Standards.
• I've clearly explained what problem this PR is solving and how it is solved.
• I've linked related issues.
• I've included manual testing steps.
• I've included screenshots/recordings if applicable.
• 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.
• I’ve properly set the pull request status to "ready for review".

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.

[georgewrmarshall]

CSS variable already has opacity so opacity is not needed here

[metamaskbot]

Builds ready [901c8c5]

• 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
  • common: 0, 1, 2, 3, 4, 5, 6, 7
  • content-script: 0
  • contentscript: contentscript
  • disable-console: disable-console
  • policy-load: policy-load
  • sentry-install: sentry-install
  • ui: 0, 1, 10, 11, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (2127 ± 166 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	84	703	229	140	67
		domContentLoaded	10	101	39	22	11
		load	1583	2721	2127	346	166
		domInteractive	10	101	38	22	11

Bundle size diffs

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