Swathi- Fixed the CSS changes for the Messaging UI in LBDasboard

[SwathiAngadi]

LB Dashboard messaging UI was rendering the blank page due to CSS issues.

Related PRS (if any):

NA

Main changes explained:

• Fixed the CSS changes for the whole page.
• Applied Dark Mode theme for the UI.
• Made sure page is responsive too and adopted for dark mode theme.
• Applied standard color code present in Figma for cleaner and presentable UI.
• Removed redundant css changes from the modular.css file.
• Removed multiple declaration of routes for this page.

How to test:

1. check into current branch
2. do npm install and ... to run this PR locally
3. Clear site data/cache
4. Login as Admin user.
5. Navigate to /lbdashboard/messaging
6. Check for Visual Appearance.
7. Check for Dark mode compatibility.
8. Check for responsiveness.

Screenshots or videos of changes:

Note:

LBDasboard components misses the header section. This issue is taken as part of other PR.
This PR concentrates on the visual appearance of the page.
Raised issue for " When user sends message, in the body multiple messages are triggered."

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	dd22275
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/69e3422587f160000898a8a2
😎 Deploy Preview	https://deploy-preview-4652--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[sonarqubecloud]

Quality Gate failed

Failed conditions
14.3% Duplication on New Code (required ≤ 3%)

See analysis details on SonarQube Cloud

[Anusha-Gali]

Hi Swathi,

I tried to review your PR locally and but the page is still blank at my end. This is what i can see in the backend. Do note that when i go back to dashboard my user profile is visible.

[HemanthNidamanuru]

Hi Swathi,

I tested this PR locally and the messaging page at /lbdashboard/messaging is rendering as a blank page with no content visible.

[SwathiAngadi]

Hi Swathi,

I tested this PR locally and the messaging page at /lbdashboard/messaging is rendering as a blank page with no content visible.

Hi,

Kindly test the PR now. Added the lost changes.

Thanks,
Swathi

[SwathiAngadi]

Hi Swathi,

I tried to review your PR locally and but the page is still blank at my end. This is what i can see in the backend. Do note that when i go back to dashboard my user profile is visible.

Hi,

Kindly test the PR now. Added the lost changes.

Thanks,
Swathi

[sonarqubecloud]

Quality Gate passed

Issues
12 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 SonarQube Cloud

[HemanthNidamanuru]

Hi Swathi,

I tested this locally and overall it looks great. Dark mode, responsiveness, and the visual appearance all look good!

I did notice a couple of things that seem to be pre-existing bugs (not related to this PR):

1. Messages are showing up twice after sending.
2. The contact isn't rendering in the chat page after a message is sent.

One thing that does seem related to this PR:
3. The X button on the search input looks a bit off. It's not aligned properly with the input field.

Could you take a look at issue 3 before we merge? The other two can be tracked separately. Thanks!