Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] Fix Content Overflow and Misalignment in Waste Management Section #241

Merged
merged 2 commits into from
Oct 9, 2024
Merged

[BUG] Fix Content Overflow and Misalignment in Waste Management Section #241

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7168d7b
fix Discover Our Features section styling
sahhoArjun097 Oct 9, 2024
1c33c93
fix Discover Our Features section styling
sahhoArjun097 Oct 9, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
259 changes: 154 additions & 105 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -148,41 +148,48 @@ <h3>Non-Biodegradable Waste</h3>
</section>

<section class="features" id="features">
<h2>Our Features</h2>
<div class="feature-card">
<h3>Real-time Monitoring</h3>
<p>Track your waste management activities in real-time.</p>
</div>
<div class="feature-card" id="eco-friendly">
<h3>Eco-Friendly Tips</h3>

<blockquote id="eco-fact">Did you know <span id="fact-highlight">only 9% of all plastic ever
produced has been recycled?</span></blockquote>
<p>Be <span class="highlight">eco-savvy</span> by embracing simple, comprehensive solutions from the
comfort of your home. Contribute to managing the overwhelming burden of waste generation. Get
personalized tips to manage waste sustainably and <strong>be the change you want to see in the
world!</strong></p>
<a href="ecotips.html" id="eco-tips" class="cta-button">Join Us!</a>

<blockquote id="eco-fact">Do you know <span id="fact-highlight">only 9% of plastic ever produced has
been recycled?</span></blockquote>
<p>
Be <span class="highlight">Eco-savvy</span> by embracing simple, comprehensive, and quick
solutions from the comfort of your home.
Contribute in managing the overwhelming burden of waste generation. Get personalized tips to
manage waste sustainably and
<strong>be the change you want to see in the world!</strong>.
</p>
<a href="ecotips.html" id="eco-tips" class="cta-button">I'm in!</a>
<h2>Discover Our Features</h2>
<div class="features-container">


<div class="feature-card" id="eco-friendly">
<div class="icon">
<i class="fas fa-leaf"></i>
</div>
<h3>Eco-Friendly Tips</h3>
<blockquote id="eco-fact">
Did you know <span id="fact-highlight">only 9% of all plastic ever produced has been
recycled?</span>
</blockquote>
<p>Make a difference by embracing eco-friendly practices from home. Learn tips to help manage
waste efficiently and reduce your environmental impact.</p>
<a href="ecotips.html" class="cta-button">Get Tips!</a>
</div>
</div>
<div class="feature-card">
<h3>Community Engagement</h3>
<p>Join community efforts to promote effective waste management.</p>
<div>
<div class="feature-card1">
<div class="icon">
<i class="fas fa-chart-line"></i>
</div>
<h3>Real-time Monitoring</h3>
<p>Keep track of your waste management activities instantly, with up-to-the-minute updates.</p>
</div>

<div class="feature-card1">
<div class="icon">
<i class="fas fa-users"></i>
</div>
<h3>Community Engagement</h3>
<p>Join our community and participate in group efforts for more effective waste management and
environmental care.</p>
</div>

</div>

</section>



<section class="faqs" id="faqs">

<section class="faqs" id="faqs">
Expand Down Expand Up @@ -234,88 +241,125 @@ <h3>Why is it important to sort waste?</h3>
</section>


<section class="feedback" id="feedback">
<h2>Your Feedback</h2>
<form id="feedback-form">
<input type="text" placeholder="Your Name" required>
<textarea placeholder="Your Feedback" required></textarea>
<button type="submit">Submit</button>
</form>
</section>
<section class="feedback" id="feedback">
<h2>Your Feedback</h2>
<form id="feedback-form">
<input type="text" placeholder="Your Name" required>
<textarea placeholder="Your Feedback" required></textarea>
<button type="submit">Submit</button>
</form>
</section>
<section id="about" class="about-us">
<div class="about-container">
<!-- About Us Heading -->
<div class="about-heading">
<h2>About Us</h2>
</div>

<section id="about" class="about-us">
<div class="about-container">
<div class="about-text">
<h2>About Us</h2>
<p><strong>At Waste Management</strong>, we are passionate about creating a sustainable future through effective waste disposal solutions. Our goal is to not only reduce environmental pollution but to also <strong>educate communities</strong> and empower individuals with sustainable waste practices.</p>
<p>By leveraging our <strong>state-of-the-art waste classification system</strong> and encouraging community engagement, we aim to inspire everyone to adopt eco-friendly habits. Together, we can make a significant impact in reducing waste, promoting recycling, and preserving the environment for future generations.</p>
<h3>Our Mission</h3>
<ul>
<li><strong>Reduce Waste:</strong> Minimize waste generation through innovative technologies and education.</li>
<li><strong>Promote Recycling:</strong> Encourage responsible disposal and recycling practices in every community.</li>
<li><strong>Empower Communities:</strong> Equip individuals with knowledge and tools for sustainable living.</li>
<li><strong>Build a Cleaner Future:</strong> Protect the environment for future generations.</li>
</ul>
</div>
<div class="about-image">
<img src="./assets/about-us.jpg" alt="Waste Management team working towards sustainability">
</div>
</div>

<div class="values-container">
<h3>Our Core Values</h3>
<div class="values-cards">
<div class="value-card">
<h4>Innovation</h4>
<p>We believe in continually evolving our waste management practices with cutting-edge technologies to improve efficiency and reduce our environmental footprint.</p>
</div>
<div class="value-card">
<h4>Sustainability</h4>
<p>Environmental sustainability is at the heart of everything we do. We prioritize reducing waste, reusing materials, and promoting recycling initiatives globally.</p>
</div>
<div class="value-card">
<h4>Community</h4>
<p>Collaboration is key. By working together with communities, we aim to foster eco-consciousness and sustainable living across the globe.</p>
<!-- About Content -->
<div class="about-text">
<p><strong>At Waste Management</strong>, we are passionate about creating a sustainable
future through effective waste disposal solutions. Our goal is to not only reduce
environmental pollution but also <strong>educate communities</strong> and empower
individuals with sustainable waste practices.</p>
<p>By leveraging our <strong>state-of-the-art waste classification system</strong> and
encouraging community engagement, we aim to inspire everyone to adopt eco-friendly
habits. Together, we can make a significant impact in reducing waste, promoting
recycling, and preserving the environment for future generations.</p>
</div>

<!-- About Image -->
<div class="about-image">
<img src="./assets/about-us.jpg" alt="Waste Management team working towards sustainability">
</div>

<!-- Mission Section -->
<div class="mission-container">
<h3>Our Mission</h3>
<div class="mission-box">
<div class="mission-item">
<h4>Reduce Waste</h4>
<p>Minimize waste generation through innovative technologies and education.</p>
</div>
<div class="mission-item">
<h4>Promote Recycling</h4>
<p>Encourage responsible disposal and recycling practices in every community.</p>
</div>
<div class="mission-item">
<h4>Empower Communities</h4>
<p>Equip individuals with knowledge and tools for sustainable living.</p>
</div>
<div class="mission-item">
<h4>Build a Cleaner Future</h4>
<p>Protect the environment for future generations.</p>
</div>
</div>
</div>
</div>
<div class="value-card">
<h4>Responsibility</h4>
<p>We are committed to acting with integrity and accountability, ensuring that our practices positively impact both the environment and society.</p>
</section>


<section>
<div class="values-container">
<h3>Our Core Values</h3>
<div class="values-cards">
<div class="value-card">
<h4>Innovation</h4>
<p>We believe in continually evolving our waste management practices with cutting-edge
technologies to improve efficiency and reduce our environmental footprint.</p>
</div>
<div class="value-card">
<h4>Sustainability</h4>
<p>Environmental sustainability is at the heart of everything we do. We prioritize
reducing waste, reusing materials, and promoting recycling initiatives globally.</p>
</div>
<div class="value-card">
<h4>Community</h4>
<p>Collaboration is key. By working together with communities, we aim to foster
eco-consciousness and sustainable living across the globe.</p>
</div>
<div class="value-card">
<h4>Responsibility</h4>
<p>We are committed to acting with integrity and accountability, ensuring that our
practices positively impact both the environment and society.</p>
</div>
</div>
</div>
</div>
</div>
</section>

</section>



<section class="signup" id="signup">
<h2>Sign Up</h2>
<form id="signup-form">
<input type="text" placeholder="Full Name" required aria-label="Full Name">
<input type="email" placeholder="Email Address" required aria-label="Email Address">
<input type="password" placeholder="Password" required aria-label="Password">
<input type="password" placeholder="Confirm Password" required aria-label="Confirm Password">
<button type="submit">Create Account</button>
<section class="signup" id="signup">
<h2>Sign Up</h2>
<form id="signup-form">
<input type="text" placeholder="Full Name" required aria-label="Full Name">
<input type="email" placeholder="Email Address" required aria-label="Email Address">
<input type="password" placeholder="Password" required aria-label="Password">
<input type="password" placeholder="Confirm Password" required aria-label="Confirm Password">
<button type="submit">Create Account</button>
</form>
</section>

</main>

<footer id="footer">
<h2>Stay Connected</h2>
<form id="newsletter-form">
<input type="email" placeholder="Your Email" required>
<button type="submit">Subscribe</button>
</form>
</section>
<div class="social-media">

</main>

<footer id="footer">
<h2>Stay Connected</h2>
<form id="newsletter-form">
<input type="email" placeholder="Your Email" required>
<button type="submit">Subscribe</button>
</form>
<div class="social-media">

<a href="#">Facebook</a>
<a href="#">Twitter</a>
<a href="#">Instagram</a>
</div>

<div class="community-message">
<h3>Our Commitment to Sustainability</h3>
<p>At Waste Management, we are dedicated to building a greener future. Through our community recycling programs and sustainability initiatives, we strive to reduce waste and protect the environment for generations to come. Join us in our mission to create a cleaner, healthier planet.</p>
<a href="#">Facebook</a>
<a href="#">Twitter</a>
<a href="#">Instagram</a>
</div>

<div class="community-message">
<h3>Our Commitment to Sustainability</h3>
<p>At Waste Management, we are dedicated to building a greener future. Through our community recycling
programs and sustainability initiatives, we strive to reduce waste and protect the environment for
generations to come. Join us in our mission to create a cleaner, healthier planet.</p>

<a href="#">
<box-icon type="logo" name="facebook"></box-icon>
Expand All @@ -328,7 +372,6 @@ <h3>Our Commitment to Sustainability</h3>
</a>

</div>

<div class="community-message">
<h3>Our Commitment to Sustainability</h3>
<p>At Waste Management, we are dedicated to building a greener future. Through our community recycling
Expand All @@ -340,6 +383,12 @@ <h3>Our Commitment to Sustainability</h3>
</footer>

<script src="script.js"></script>
</section>
</main>


<script src="script.js"></script>


</body>

Expand Down
Loading