[UI] Fix white gap between body and footer

[Elaa257]

Description

Fixed white gap between body and footer on some pages. Also paid attention to dark mode.

Category

• [ ] Resource Addition
• [ ] Documentation
• [ ] Codebase
• [x] User Interface
• [ ] Feature Addition

Related Issue

Fixes #527

Checklist

• [x] I have followed the CONTRIBUTING guide
• [x] The name of the resource is spelled correctly (if applicable)
• [x] The link to the resource is working (if applicable)
• [x] The resource is added in the correct format (if applicable)
• [x] I have tested changes on my local computer (if applicable)

[netlify[bot]]

✅ Deploy Preview for openpedia ready!

Name	Link
🔨 Latest commit	9ef122374033d9ce8b0f7c016270a01b139139f8
🔍 Latest deploy log	https://app.netlify.com/sites/openpedia/deploys/670dff5031eaf30008f60613
😎 Deploy Preview	https://deploy-preview-542--openpedia.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 site configuration.

[Elaa257]

Hey @Sriparno08, I fixed the gap and also tried to tidy up the css mess a little bit, at least in the files I worked with. There were some conflicts in some classes, like duplicated width declarations.