Feature: Redesigned the way details are displayed in the details pane

[yaira2]

Resolved / Related Issues

• Were these changes approved in an issue or discussion with the project maintainers? In order to prevent extra work, feature requests and changes to the codebase must be approved before the pull request will be reviewed. This prevents extra work for the contributors and maintainers.
  Closes Issue: Preview Pane fields should be read-only #12781...

Validation
How did you test these changes?

• Did you build the app and test your changes?
• Did you check for accessibility? You can use Accessibility Insights for this.
• Did you remove any strings from the en-us resource file?
  • Did you search the solution to see if the string is still being used?
• Did you implement any design changes to an existing feature?
  • Was this change approved?
• Are there any other steps that were used to validate these changes?
  1. Open details pane
  2. Confirm everything is displayed properly

Screenshots (optional)