Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
38 changes: 15 additions & 23 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,34 +1,32 @@
# [Project Name] 🎯
# charity-hope 🎯


## Basic Details
### Team Name: [Name]
### Team Name: Tech Titans


### Team Members
- Member 1: [Name] - [College]
- Member 2: [Name] - [College]
- Member 3: [Name] - [College]
- Member 1: Gayathri Krishna - St.Joseph college (autonomous) irinjalakuda
- Member 2: Suhana Parvin T.S - St.Joseph college (autonomous) irinjalakuda


### Hosted Project Link
[mention your project hosted project link here]
https://charity-hope-uu3a.vercel.app/

### Project Description
[2-3 lines about what your project does]
The charity website is a platform connecting donors with verified organizations to support meaningful causes. It offers secure donations, real-time updates, and volunteer opportunities, promoting transparency and impactful giving.

### The Problem statement
[What ridiculous problem are you solving?]
The website solves the problem of mistrust and inefficiency in charitable giving by ensuring transparency, connecting donors directly with verified organizations, and providing clear impact updates on donations.


### The Solution
[How are you solving it? Keep it fun!]
We’re zapping away donation doubts with a transparency toolkit! From verified charities to real-time updates, we’re turning giving into a smooth, trust-filled ride. Think of us as the matchmakers for your generosity and a cause that truly needs it—swipe right for impact! 🚀❤️

## Technical Details
### Technologies/Components Used
For Software:
- [Languages used]
- [Frameworks used]
- [Libraries used]
- [Tools used]
- HTML,CSS,JAVASCRIT
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Fix typo in technology list.

There's a typo in "JAVASCRIT".

-- HTML,CSS,JAVASCRIT
+- HTML, CSS, JAVASCRIPT
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
- HTML,CSS,JAVASCRIT
- HTML, CSS, JAVASCRIPT


For Hardware:
- [List main components]
Expand All @@ -47,14 +45,9 @@ For Software:
For Software:

# Screenshots (Add at least 3)
![Screenshot1](Add screenshot 1 here with proper name)
*Add caption explaining what this shows*

![Screenshot2](Add screenshot 2 here with proper name)
*Add caption explaining what this shows*
!https://drive.google.com/drive/folders/1kM9N1F28uPKuliSv96bevTDpBeXYDy7l?usp=sharing
The screenshot and screen record of the website
Comment on lines +48 to +49
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Fix screenshot link formatting.

The screenshot link is using an incorrect format (starting with ! but not properly formatted as a markdown image).

-!https://drive.google.com/drive/folders/1kM9N1F28uPKuliSv96bevTDpBeXYDy7l?usp=sharing
-The screenshot and screen record of the website
+[Screenshots and screen recordings](https://drive.google.com/drive/folders/1kM9N1F28uPKuliSv96bevTDpBeXYDy7l?usp=sharing)
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
!https://drive.google.com/drive/folders/1kM9N1F28uPKuliSv96bevTDpBeXYDy7l?usp=sharing
The screenshot and screen record of the website
[Screenshots and screen recordings](https://drive.google.com/drive/folders/1kM9N1F28uPKuliSv96bevTDpBeXYDy7l?usp=sharing)
🧰 Tools
🪛 markdownlint-cli2 (0.17.2)

48-48: Bare URL used
null

(MD034, no-bare-urls)


![Screenshot3](Add screenshot 3 here with proper name)
*Add caption explaining what this shows*

# Diagrams
![Workflow](Add your workflow/architecture diagram here)
Expand Down Expand Up @@ -91,9 +84,8 @@ For Hardware:
[Add any extra demo materials/links]

## Team Contributions
- [Name 1]: [Specific contributions]
- [Name 2]: [Specific contributions]
- [Name 3]: [Specific contributions]
- [Gayathri](https://github.com/Gayathri24-student) - project owner
- [Suhana](https://github.com/Suhana24-student) - frontend development,Design Improvements, Debugging

---
Made with ❤️ at TinkerHub
Binary file added disaster relief.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added education.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added healthcare.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
191 changes: 191 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,191 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Charity Donation</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>

<!-- Navigation Bar -->
<nav class="navbar">
<ul>
<li><a href="#hero">Home</a></li>
<li><a href="#donation-form">Donate</a></li>
<li><a href="#impact">Our Impact</a></li>
<li><a href="#causes">Our Causes</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav>
<header class="header">
<div class="container">
<h1 class="logo">Charity for Hope</h1>

Comment on lines +21 to +24
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Fix unclosed div tag in the header.

The opening div tag is missing its corresponding closing tag.

  <header class="header">
    <div class="container">
      <h1 class="logo">Charity for Hope</h1>
+   </div>
  </header>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<header class="header">
<div class="container">
<h1 class="logo">Charity for Hope</h1>
<header class="header">
<div class="container">
<h1 class="logo">Charity for Hope</h1>
</div>
</header>


<!-- Hero Section -->
<header id="hero" class="hero-section">
<div class="hero-content">
<h1>Make a Difference Today</h1>
<p>Join us in helping communities around the world.</p>
<a href="#donation-form" class="cta-button">Donate Now</a>
</div>
</header>
<!-- About Section -->
<section id="about" class="section">
<div class="container">
<h2>About Us</h2>
<p><i>At C, we believe in the power of kindness and community. Founded with the mission to create a meaningful impact in the lives of those in need, we strive to build a world where compassion knows no boundaries.

Our organization works tirelessly to provide support, resources, and opportunities to underserved communities. From delivering food and medical aid to empowering education and skill-building programs, every effort we make is dedicated to fostering hope and change.

Our Vision:
To create a sustainable and inclusive future where every individual can live with dignity and opportunity.

Our Mission:
To mobilize resources, inspire action, and bring communities together to transform lives through impactful programs and initiatives.</i></p>
Comment on lines +38 to +46
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Inconsistent organization name.

The about section starts with "At C," which is inconsistent with the organization name "Charity for Hope" used elsewhere.

-      <p><i>At C, we believe in the power of kindness and community. Founded with the mission to create a meaningful impact in the lives of those in need, we strive to build a world where compassion knows no boundaries.
+      <p><i>At Charity for Hope, we believe in the power of kindness and community. Founded with the mission to create a meaningful impact in the lives of those in need, we strive to build a world where compassion knows no boundaries.
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<p><i>At C, we believe in the power of kindness and community. Founded with the mission to create a meaningful impact in the lives of those in need, we strive to build a world where compassion knows no boundaries.
Our organization works tirelessly to provide support, resources, and opportunities to underserved communities. From delivering food and medical aid to empowering education and skill-building programs, every effort we make is dedicated to fostering hope and change.
Our Vision:
To create a sustainable and inclusive future where every individual can live with dignity and opportunity.
Our Mission:
To mobilize resources, inspire action, and bring communities together to transform lives through impactful programs and initiatives.</i></p>
<p><i>At Charity for Hope, we believe in the power of kindness and community. Founded with the mission to create a meaningful impact in the lives of those in need, we strive to build a world where compassion knows no boundaries.
Our organization works tirelessly to provide support, resources, and opportunities to underserved communities. From delivering food and medical aid to empowering education and skill-building programs, every effort we make is dedicated to fostering hope and change.
Our Vision:
To create a sustainable and inclusive future where every individual can live with dignity and opportunity.
Our Mission:
To mobilize resources, inspire action, and bring communities together to transform lives through impactful programs and initiatives.</i></p>

</div>
</section>

<!-- Causes Section -->
<section id="causes" class="section causes">
<div class="container">
<h2>Our Causes</h2>
<div class="causes-list">
<div class="cause">
<img src="education.jpeg" alt="Education">
<h3>Education</h3>
<p>Provide quality education for underprivileged children.</p>
</div>
<div class="cause">
<img src="healthcare.jpeg" alt="Healthcare">
<h3>Healthcare</h3>
<p>Deliver essential healthcare to vulnerable communities.</p>
</div>
<div class="cause">
<img src="disaster relief.jpeg" alt="Disaster Relief">
<h3>Disaster Relief</h3>
Comment on lines +66 to +67
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Image filename contains spaces.

Using spaces in image filenames can cause issues with URLs. Consider replacing spaces with hyphens or underscores.

-          <img src="disaster relief.jpeg" alt="Disaster Relief">
+          <img src="disaster-relief.jpeg" alt="Disaster Relief">
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<img src="disaster relief.jpeg" alt="Disaster Relief">
<h3>Disaster Relief</h3>
<img src="disaster-relief.jpeg" alt="Disaster Relief">
<h3>Disaster Relief</h3>

<p>Help families recover from natural disasters.</p>
</div>
</div>
</div>

</section>


<!-- Donation Section -->
<section id="donation-form" class="donation-section">
<h2>Make a Donation</h2>
<div class="donation-form">
<label for="donationAmount">Donation Amount ($):</label>
<input type="number" id="donationAmount" value="50" min="1">

<div class="frequency-options">
<label>
<input type="radio" name="frequency" value="one-time" checked> One-time
</label>
<label>
<input type="radio" name="frequency" value="monthly"> Monthly
</label>
</div>

<div>
<h3>Total Donation: $<span id="totalDonation">50</span></h3>
</div>

<button id="donateButton">Donate Now</button>
</div>
</section>

<!-- Impact Section -->
<section id="impact" class="impact-section">
<h2>Our Impact</h2>
<p>We’ve changed the lives of over 100,000 people globally.</p>
<div class="impact-stats">
<div class="stat">
<h3>50,000+</h3>
<p>People helped</p>
</div>
<div class="stat">
<h3>500+</h3>
<p>Projects funded</p>
</div>
<div class="stat">
<h3>10+</h3>
<p>Countries supported</p>
</div>
</div>
<section class="contact-section" id="contact">
<h2>Contact Us</h2>
<p>We'd love to hear from you! Fill out the form below or reach us on social media.</p>
<form class="contact-form">
<label for="name">Name:</label>
<input type="text" id="name" name="name" placeholder="Your Name" required>

<label for="email">Email:</label>
<input type="email" id="email" name="email" placeholder="Your Email" required>

<label for="message">Message:</label>
<textarea id="message" name="message" placeholder="Your Message" rows="5" required></textarea>

<button type="submit">Submit</button>
</form>

<div class="social-links">
<a href="#facebook" title="Facebook"><i class="fab fa-facebook"></i></a>
<a href="#twitter" title="Twitter"><i class="fab fa-twitter"></i></a>
<a href="#instagram" title="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#linkedin" title="LinkedIn"><i class="fab fa-linkedin"></i></a>

</div>
</section>

</section>



<div>
<a href=""><img src="logo.jpeg" alt="Charity Logo" class="footer-logo"></a>
<h3>More Information About Us</h3>re information about us</h3>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Duplicate text in heading.

There's duplicated text in this heading.

-      <h3>More Information About Us</h3>re information about us</h3>
+      <h3>More Information About Us</h3>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<h3>More Information About Us</h3>re information about us</h3>
<h3>More Information About Us</h3>

<p>4486 Richards Avenue, Modesto CA - 95354</p>
<p>Tel: 200-000-0000</p>
<p>Email: [email protected]</p>
</div>
<div class="social">
<h3>Support</h3>
<p>Help us shape a better future for children.</p>
<div class="side_btn">
<a href="donate.html">JOIN US TODAY</a>
</div>
</div>
<!-- Footer -->

<footer class="social-media-section">
<div class="container">
<h3>Connect with us</h3>
<div class="social-icons">
<a href="https://facebook.com" target="_blank" aria-label="Facebook">
<img src="https://cdn-icons-png.flaticon.com/512/733/733547.png" alt="Facebook" />
</a>
<a href="https://twitter.com" target="_blank" aria-label="Twitter">
<img src="https://cdn-icons-png.flaticon.com/512/733/733579.png" alt="Twitter" />
</a>
<a href="https://instagram.com" target="_blank" aria-label="Instagram">
<img src="https://cdn-icons-png.flaticon.com/512/733/733558.png" alt="Instagram" />
</a>
<a href="https://wa.me/?text=Hello" target="_blank" aria-label="WhatsApp">
<img src="https://cdn-icons-png.flaticon.com/512/733/733585.png" alt="WhatsApp" />
</a>
</div>

</div>
</footer>
<div class="footer-logo-container">

</div>
<footer>
<p>&copy; 2021 Charity Jet. All rights reserved.</p></footer>
</footer>
Comment on lines +187 to +188
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Extra closing footer tag.

There are two closing footer tags, but only one opening tag.

  <p>&copy; 2021 Charity Jet. All rights reserved.</p></footer>
- </footer>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<p>&copy; 2021 Charity Jet. All rights reserved.</p></footer>
</footer>
<p>&copy; 2021 Charity Jet. All rights reserved.</p></footer>

<script src="scripts.js"></script>
</body>
</html>
Binary file added logo.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
29 changes: 29 additions & 0 deletions scripts.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
// Donation Calculator Logic
const donationAmountInput = document.getElementById('donationAmount');
const totalDonationSpan = document.getElementById('totalDonation');
const donateButton = document.getElementById('donateButton');
const frequencyRadios = document.querySelectorAll('input[name="frequency"]');

// Function to calculate total donation based on frequency
function calculateDonation() {
const amount = parseFloat(donationAmountInput.value) || 0;
let total = amount;

// Check donation frequency (monthly or one-time)
const frequency = document.querySelector('input[name="frequency"]:checked').value;
if (frequency === 'monthly') {
total = amount * 12; // Calculate total for a year if monthly
}

// Update total donation display
totalDonationSpan.textContent = total.toFixed(2);
}

// Event listeners
donationAmountInput.addEventListener('input', calculateDonation);
frequencyRadios.forEach(radio => radio.addEventListener('change', calculateDonation));

// Handle donate button click (for demo purposes, simply alerting)
donateButton.addEventListener('click', () => {
alert(Thank you for your generous donation of $${totalDonationSpan.textContent}!);
});
Comment on lines +27 to +29
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Fix missing template string backticks in the alert message.

The alert message is attempting to use string interpolation but is missing the required backticks.

- alert(Thank you for your generous donation of $${totalDonationSpan.textContent}!);
+ alert(`Thank you for your generous donation of $${totalDonationSpan.textContent}!`);
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
donateButton.addEventListener('click', () => {
alert(Thank you for your generous donation of $${totalDonationSpan.textContent}!);
});
donateButton.addEventListener('click', () => {
alert(`Thank you for your generous donation of $${totalDonationSpan.textContent}!`);
});
🧰 Tools
🪛 Biome (1.9.4)

[error] 28-28: expected , but instead found you

Remove you

(parse)


[error] 28-28: expected , but instead found for

Remove for

(parse)

Loading