From 7df13b70347404cea95433be3b796ec6a8b97ae9 Mon Sep 17 00:00:00 2001 From: tarunkumar2005 Date: Sun, 20 Oct 2024 00:57:43 +0530 Subject: [PATCH 1/2] Added the contributors page --- contributors.css | 310 ++++++++++++++++++++++++++++++++++++++++++++++ contributors.html | 274 ++++++++++++++++++++++++++++++++++++++++ contributors.js | 119 ++++++++++++++++++ 3 files changed, 703 insertions(+) create mode 100644 contributors.css create mode 100644 contributors.html create mode 100644 contributors.js diff --git a/contributors.css b/contributors.css new file mode 100644 index 0000000..7f573c9 --- /dev/null +++ b/contributors.css @@ -0,0 +1,310 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: Arial, sans-serif; + background-color: #fff; + color: #000; + line-height: 1.5; +} + +.hero { + margin-top: 20px; + height: 90vh; + display: flex; + align-items: center; + justify-content: center; + position: relative; + background-color: #fff; + color: #000; + text-align: center; +} + +.hero-overlay { + position: absolute; + inset: 0; + background-color: rgba(0, 0, 0, 0.1); +} + +.hero-content { + position: relative; + z-index: 10; + max-width: 64rem; + padding: 0 1rem; +} + +.hero h1 { + font-size: 3rem; + font-weight: bold; + margin-bottom: 1rem; + color: #000; +} + +.hero p { + font-size: 1.5rem; + color: #333; + margin-bottom: 2rem; +} + +.cta-button { + display: inline-block; + padding: 1rem 2rem; + background-color: #000; + color: #fff; + font-weight: bold; + text-decoration: none; + border-radius: 9999px; + transition: background-color 0.3s ease; +} + +.cta-button:hover { + background-color: #333; +} + +.stats, .contributors { + padding: 4rem 1rem; + background-color: #fff; + color: #000; +} + +.stats h2, .contributors h2 { + font-size: 2rem; + font-weight: bold; + text-align: center; + margin-bottom: 3rem; + color: #000; +} + +.stats-container, .contributors-container { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; + max-width: 80rem; + margin: 0 auto; +} + +.stat-card, .contributor-card { + background-color: #fff; + border: 1px solid #000; + border-radius: 0.5rem; + padding: 1.5rem; + color: #000; + box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.stat-card h3 { + font-size: 2rem; + font-weight: bold; +} + +.stat-card p { + color: #555; +} + +.contributor-card:hover { + transform: translateY(-5px); + box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.2), 0 4px 6px -2px rgba(0, 0, 0, 0.1); +} + +.contributor-card img { + width: 6rem; + height: 6rem; + border-radius: 50%; + margin: 0 auto 1rem; + border: 4px solid #000; +} + +.contributor-card h3 { + font-size: 1.25rem; + font-weight: bold; + margin-bottom: 0.5rem; +} + +.contributor-card p { + font-size: 0.875rem; + color: #000; + margin-bottom: 1rem; +} + +.contributor-card .contributions { + display: inline-block; + background-color: #000; + color: #fff; + font-weight: 600; + padding: 0.25rem 0.75rem; + border-radius: 9999px; + font-size: 0.875rem; +} + +.contributor-card a { + display: inline-flex; + align-items: center; + color: #000; + text-decoration: none; + font-weight: 500; + transition: color 0.3s ease; +} + +.contributor-card a:hover { + color: #333; +} + +.contributor-card svg { + margin-right: 0.5rem; + width: 15px; + height: 15px; +} + +.loading { + display: flex; + justify-content: center; + align-items: center; + height: 200px; +} + +.spinner { + border: 4px solid #f3f3f3; + border-top: 4px solid #000; + border-radius: 50%; + width: 40px; + height: 40px; + animation: spin 1s linear infinite; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + +.contribute { + background-color: #fff; + color: #000; + padding: 4rem 1rem; + text-align: center; +} + +.contribute h2 { + font-size: 2rem; + font-weight: bold; + margin-bottom: 1rem; +} + +.contribute p { + font-size: 1.25rem; + color: #333; + margin-bottom: 2rem; +} + +#emailForm { + display: flex; + flex-direction: column; + align-items: center; + gap: 1rem; +} + +#emailForm input { + padding: 0.75rem 1.5rem; + border-radius: 9999px; + background-color: #f9f9f9; + border: 1px solid #000; + color: #000; + width: 100%; + max-width: 20rem; +} + +#emailForm button { + padding: 0.75rem 2rem; + background-color: #000; + color: #fff; + font-weight: bold; + border: none; + border-radius: 9999px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +#emailForm button:hover { + background-color: #333; +} + +footer { + background-color: #fff; + color: #000; + padding: 3rem 1rem; +} + +.footer-content { + display: flex; + flex-direction: column; + align-items: center; + gap: 2rem; + max-width: 64rem; + margin: 0 auto; +} + +.footer-info { + text-align: center; +} + +.footer-info h3 { + font-size: 1.5rem; + font-weight: bold; + margin-bottom: 0.5rem; +} + +.footer-info p { + color: #555; +} + +.footer-nav { + display: flex; + gap: 1.5rem; +} + +.footer-nav a { + color: #000; + text-decoration: none; + transition: color 0.3s ease; +} + +.footer-nav a:hover { + color: #333; +} + +.footer-year { + text-align: center; + color: #666; + margin-top: 2rem; +} + +@media (min-width: 640px) { + .hero h1 { + font-size: 3.75rem; + } + + .hero p { + font-size: 1.875rem; + } + + #emailForm { + flex-direction: row; + justify-content: center; + } + + #emailForm input { + width: auto; + } + + .footer-content { + flex-direction: row; + justify-content: space-between; + } + + .footer-info { + text-align: left; + } +} \ No newline at end of file diff --git a/contributors.html b/contributors.html new file mode 100644 index 0000000..077e17b --- /dev/null +++ b/contributors.html @@ -0,0 +1,274 @@ + + + + + + + + Contributors Page + + + + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+ +
+ + + + + + + + + + + + +
+
+
+

Our Amazing Contributors

+

Shaping the future of StationGuide, one commit at a time

+ Become a Contributor +
+
+ + +
+

Project Statistics

+
+ +
+
+ + +
+

Meet Our Contributors

+
+
+ +
+
+
+ + +
+
+

Ready to Make an Impact?

+

Join our community and help shape the future of StationGuide.

+
+ + +
+
+
+ + + + + + + + \ No newline at end of file diff --git a/contributors.js b/contributors.js new file mode 100644 index 0000000..c3fd679 --- /dev/null +++ b/contributors.js @@ -0,0 +1,119 @@ +document.addEventListener("DOMContentLoaded", function () { + const contributorsContainer = document.getElementById('contributors'); + const statsContainer = document.getElementById('stats'); + const loadingIndicator = document.getElementById('loading'); + const emailForm = document.getElementById('emailForm'); + const emailInput = document.getElementById('email'); + const currentYear = document.getElementById('currentYear'); + const heroTitle = document.getElementById('heroTitle'); + const heroSubtitle = document.getElementById('heroSubtitle'); + + // Animate hero section + function animateHero() { + heroTitle.style.opacity = '0'; + heroTitle.style.transform = 'translateY(20px)'; + heroSubtitle.style.opacity = '0'; + heroSubtitle.style.transform = 'translateY(20px)'; + + setTimeout(() => { + heroTitle.style.transition = 'opacity 0.8s, transform 0.8s'; + heroTitle.style.opacity = '1'; + heroTitle.style.transform = 'translateY(0)'; + }, 100); + + setTimeout(() => { + heroSubtitle.style.transition = 'opacity 0.8s, transform 0.8s'; + heroSubtitle.style.opacity = '1'; + heroSubtitle.style.transform = 'translateY(0)'; + }, 300); + } + + // Fetch contributors and repo stats + async function fetchData() { + loadingIndicator.style.display = 'flex'; + + try { + const contributorsResponse = await axios.get('https://api.github.com/repos/Tejashri-Taral/TrendTrove-Ecommerce/contributors'); + const contributorsData = contributorsResponse.data; + + const repoResponse = await axios.get('https://api.github.com/repos/Tejashri-Taral/TrendTrove-Ecommerce'); + const repoData = repoResponse.data; + + populateStats(repoData, contributorsData); + populateContributors(contributorsData); + } catch (error) { + console.error('Error fetching data:', error); + } finally { + loadingIndicator.style.display = 'none'; + } + } + + function populateStats(repoData, contributors) { + const stats = [ + { label: "Contributors", value: contributors.length, icon: '' }, + { label: "Total Contributions", value: contributors.reduce((sum, contributor) => sum + contributor.contributions, 0), icon: '' }, + { label: "GitHub Stars", value: repoData.stargazers_count, icon: '' }, + { label: "Forks", value: repoData.forks_count, icon: '' }, + ]; + + statsContainer.innerHTML = ''; + stats.forEach((stat, index) => { + const statCard = document.createElement('div'); + statCard.className = "stat-card"; + statCard.innerHTML = ` +
${stat.icon}
+

${stat.value}

+

${stat.label}

+ `; + statCard.style.opacity = '0'; + statCard.style.transform = 'translateY(20px)'; + statsContainer.appendChild(statCard); + + setTimeout(() => { + statCard.style.transition = 'opacity 0.5s, transform 0.5s'; + statCard.style.opacity = '1'; + statCard.style.transform = 'translateY(0)'; + }, index * 100); + }); + } + + function populateContributors(contributors) { + contributorsContainer.innerHTML = ''; + contributors.forEach((contributor, index) => { + const contributorCard = document.createElement('div'); + contributorCard.className = "contributor-card"; + contributorCard.innerHTML = ` + ${contributor.login} +

${contributor.login}

+

${contributor.type}

+
${contributor.contributions} contributions
+ + + + + + View Profile + + `; + contributorCard.style.opacity = '0'; + contributorsContainer.appendChild(contributorCard); + + setTimeout(() => { + contributorCard.style.transition = 'opacity 0.5s'; + contributorCard.style.opacity = '1'; + }, index * 100); + }); + } + + // Handle email form submission + emailForm.addEventListener('submit', function (event) { + event.preventDefault(); + const emailValue = emailInput.value; + alert(`Thank you for signing up with ${emailValue}!`); + emailInput.value = ''; + }); + + // Initialize + animateHero(); + fetchData(); +}); \ No newline at end of file From 9dad133c3cb21c631dbf3da5e948e8eeaa02d04f Mon Sep 17 00:00:00 2001 From: tarunkumar2005 Date: Sun, 20 Oct 2024 01:14:10 +0530 Subject: [PATCH 2/2] Updated the readme file with the featured in, repo review table and our contributors --- README.md | 52 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) diff --git a/README.md b/README.md index 165b238..fa51c8f 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,53 @@ Welcome to **TrendTrove**, an e-commerce platform designed to offer the latest trends in fashion with a seamless shopping experience. + + + + + + + + + + + + + + + + + + + + + + + +
🌟 Stars🍴 Forks🐛 Issues🔔 Open PRs🔕 Close PRs🛠️ Languages👥 Contributors
StarsForksIssuesOpen Pull RequestsClose Pull RequestsGitHub language countGitHub Contributors count
+ +
+ +## Featured In + + + + + + + + + + + + + + + + + +
Event LogoEvent NameEvent Description
GSSoC Ext 24GirlScript Summer of Code Ext 2024GSSOC Ext is a one-month-long open-source program by the GirlScript Foundation that runs from October 1 to November 10, 2024
Hacktoberfest 24Hacktoberfest 2024Hacktober Fest is an annual celebration of open-source software development. It's a month-long event encouraging developers to contribute to open-source projects.
+ ## Features - **Responsive Design**: Built with mobile-first approach to ensure compatibility across all devices. @@ -27,6 +74,11 @@ Welcome to **TrendTrove**, an e-commerce platform designed to offer the latest t Feel free to fork the repository and make changes. You can also raise issues or suggest features to improve the platform. + ##

Our Contributors Red Heart

+

Thank you for contributing to our repository

+ + + ## Show Your Support If you like this project, please consider giving it a ⭐️ on [GitHub](https://github.com/Tejashri-Taral/TrendTrove-Ecommerce).