[Feature]Revamp Homepage CSS & Add Relevant Images for Enhanced UI #352…

… (#375)

<!-- Thank you for sending a pull request ❤️ -->

## Issues Identification

Closes: #352

This pull request revamps the homepage CSS and adds relevant images to
enhance the overall user interface (UI) of the website. The changes aim
to create a more visually appealing and engaging experience for users,
addressing feedback received on the previous design.

-CSS Revamp: The entire homepage UI has been redesigned with improved
CSS styles, focusing on better alignment, spacing, and responsiveness to
different screen sizes.

-Image Integration: Added relevant images throughout the homepage to
provide visual context and break up text-heavy sections, making the
content more engaging and digestible.

-Consistency: Ensured that the design elements are consistent with the
overall theme of the website, maintaining brand identity while improving
aesthetics.

-Accessibility: Made improvements to ensure that the homepage is more
accessible, including better color contrast and text readability.
## Types of Changes

_Please check the boxes that apply_

- [x] Bugfix (non-breaking change that fixes an issue)
- [x] New feature (non-breaking change that adds functionality)
- [x] Breaking change (fix or feature that would cause existing
functionality to not work as expected)
- [x] Documentation update (Documentation content changed)
- [ ] Other (please describe):

## Checklist

_Please check the boxes that apply_

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] My changes do not break the current system and pass all existing
test cases
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [x] Any dependent changes have been merged and published in downstream
modules




https://github.com/user-attachments/assets/8e056d83-4b8a-4bb3-ad50-b3feaf966073


If applicable, please attach screenshots of the changes made to the user
interface.

## Additional Information

Please provide any other information that is relevant to this pull
request.

<!-- We're looking forward to merging your contribution!! -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## Release Notes

- **New Features**
	- Enhanced layout and content presentation in the main HTML files.
- Improved navigation structure and additional sections for feedback and
about us.
	- Added eco-tips slider functionality.

- **Bug Fixes**
- Adjusted validation logic in the registration form for consistency
with input fields.

- **Style**
	- Updated styles for better responsiveness and interactivity.
	- Removed feedback section styles to streamline the UI.

- **Documentation**
- Improved clarity and organization of various sections, including waste
management and FAQs.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

register.html

@@ -6,6 +6,7 @@
     <title>Waste Management</title>
     <link rel="icon" href="./assets/logo.png">
     <link rel="stylesheet" href="styles.css">
+
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400&display=swap" rel="stylesheet">
     <script src="https://unpkg.com/[email protected]/dist/boxicons.js"></script>
 
@@ -129,35 +130,31 @@
         </nav>
     </header>
     <main>
-        
+
       <div class="container">
-        <div class="form_area">
-            <p class="title">SIGN UP</p>
-            <form action="">
-                <div class="form_group">
-                    <label class="sub_title" for="name">Name</label>
-                    <input placeholder="Enter your full name" class="form_style" type="text">
-                </div>
-                <div class="form_group">
-                    <label class="sub_title" for="email">Email</label>
-                    <input placeholder="Enter your email" id="email" class="form_style" type="email">
-                </div>
-                <div class="form_group">
-                    <label class="sub_title" for="password">Password</label>
-                    <input placeholder="Enter your password" id="password" class="form_style"
-                        type="password">
-                </div>
-                <div>
-                    <button class="btn">SIGN UP</button>
-                    <p>Have an Account? <a class="link" href="">Login Here!</a></p><a class="link" href="">
-                    </a>
-                </div><a class="link" href="">
-
-                </a>
-            </form>
-        </div><a class="link" href="">
-        </a>
-    </div>
+          <div class="form_area">
+              <p class="title">SIGN UP</p>
+              <form action="">
+                  <div class="form_group">
+                      <label class="sub_title" for="name">Name</label>
+                      <input placeholder="Enter your full name" class="form_style" type="text">
+                  </div>
+                  <div class="form_group">
+                      <label class="sub_title" for="email">Email</label>
+                      <input placeholder="Enter your email" id="email" class="form_style" type="email">
+                  </div>
+                  <div class="form_group">
+                      <label class="sub_title" for="password">Password</label>
+                      <input placeholder="Enter your password" id="password" class="form_style" type="password">
+                  </div>
+                  <div>
+                      <button class="btn">SIGN UP</button>
+                      <p>Have an Account? <a class="link" href="">Login Here!</a></p><a class="link" href="">
+                  </a></div><a class="link" href="">
+
+          </a></form></div><a class="link" href="">
+      </a></div>
+
     </main>