🐛 [BUG] - Added padding between header and main container between Light and Dark Mode

[corlard3y]

Pull Request Template

#1874

Description

• Problem/Feature:

Type of Change

• Bug fix
• New feature
• Code refactor
• Documentation update
• Other (please describe):

Checklist

• Quick PR: Is this a quick PR? Can be approved before finishing a coffee.
  • Quick PR label added
• Not Merge Ready: Is this PR dependent on some other PR/tasks and not ready to be merged right now.
  • DO NOT Merge PR label added

Frontend Guidelines

• Followed frontend guidelines as per the Guidelines Notion Doc

Build & Testing

• No errors in the build terminal
• Engineer has tested the changes on their local environment
• Engineer has tested the changes on deploy preview

Screenshots/Video with Explanation

• Before: Explain the previous behavior
  Scroll to the chat section in the dapp, and toggle btw the dark and light mode in any of the envs. The dark mode has a scrollbar, and slightly displaces to the bottom section while light mode does not have a scroll bar.

• After: What's changed now
  This issue is fixed now, if you toggle between light mode or dark mode. It retains same position across both mode without displacements

Additional Context

Review & Approvals

• Self-review completed
• Code review by at least one other engineer
• Documentation updates if applicable

Notes

[github-actions]

In the MasterInterfacePage.tsx file, I have found the following issues:

1. In the Container styled component:

   • The Interface styled component is not closed properly with a backtick (`). Please add a backtick at the end of the Interface styled component styling.
   • The PreviewOuter styled component is not closed properly with a backtick (`). Please add a backtick at the end of the PreviewOuter styled component styling.
   • The PreviewBG styled component is not closed properly with a backtick (`). Please add a backtick at the end of the PreviewBG styled component styling.
   • The PreviewContent styled component is missing the closing backtick (`). Please add a backtick at the end of the PreviewContent styled component styling.

2. It seems that the styling comments in the styled components are not properly formatted. The comments should be in a proper CSS comment format (/* comment */).

Please correct the styling issues mentioned above to ensure proper syntax in the styled components.

Other than these styling issues, the logic and structure of the code seem to be fine.

All looks good.

[github-actions]

PR Preview Action v1.4.7
Preview removed because the pull request was closed.
2024-10-28 10:54 UTC