diff --git a/contributors.html b/contributors.html
new file mode 100644
index 0000000..535c437
--- /dev/null
+++ b/contributors.html
@@ -0,0 +1,173 @@
+
+
+
+
+
+ Contributors
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Our Contributors
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/index.html b/index.html
index 56ff0cf..8fd5365 100644
--- a/index.html
+++ b/index.html
@@ -941,6 +941,8 @@
Buy
Sell
Contact
+ Our Contributors
+
diff --git a/pqr.css b/pqr.css
new file mode 100644
index 0000000..51db4ae
--- /dev/null
+++ b/pqr.css
@@ -0,0 +1,123 @@
+body {
+ font-family: "Poppins";
+ color: #333;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 100vh;
+ margin: 0;
+ }
+
+ .container {
+ text-align: center;
+ }
+
+ .title {
+ font-size: 3em;
+ margin-bottom: 20px;
+ padding: 10px;
+ color: #00d4ff; /* Match with the website’s teal/blue colors */
+ text-shadow: 1px 1px 2px rgba(0, 213, 255, 0.7), 0 0 1em rgba(0, 128, 255, 0.6);
+ }
+
+ .contributors-grid {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 20px;
+ justify-content: center;
+ padding: 10px;
+ gap: 40px;
+ }
+
+ .contributor-card {
+ width: 220px;
+ position: relative;
+ max-width: calc(25% - 16px);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background-color: #1e293b; /* Dark background to fit theme */
+ border-radius: 8px;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+ padding: 16px;
+ transition: transform 0.5s ease, box-shadow 0.3s ease;
+ color: #fff; /* White text for dark theme */
+ border: none;
+ }
+
+ .contributor-card:hover {
+ transform: scale(1.05);
+ box-shadow: 0 6px 15px rgba(0, 217, 255, 0.8); /* Light blue glow on hover */
+ }
+
+ .contributor-card::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: linear-gradient(135deg, #00b4d8 50%, #0077b6 51%);
+ transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
+ transform: translate(-100%, -100%);
+ opacity: 0;
+ z-index: -1;
+ }
+
+ .contributor-card:hover::before {
+ transform: translate(0, 0);
+ opacity: 1;
+ }
+
+ .contributor-card img {
+ border-radius: 50%;
+ width: 100px;
+ height: 100px;
+ object-fit: cover;
+ margin-bottom: 10px;
+ border: 2px solid #00d4ff; /* Match with website theme colors */
+ transition: box-shadow 0.3s ease-in-out;
+ }
+
+ .contributor-card:hover img {
+ box-shadow: 0 0 15px rgba(0, 217, 255, 0.8); /* Light blue border glow */
+ }
+
+ .contributor-card h2 {
+ font-size: 1.3em;
+ color: #00d4ff; /* Bright teal/blue text */
+ transition: color 0.3s ease, text-shadow 0.3s ease;
+ }
+
+ .contributor-card p {
+ font-size: 1.1em;
+ color: #a0aec0; /* Soft grey for descriptions */
+ transition: color 0.3s ease, text-shadow 0.3s ease;
+ }
+
+ .contributor-card:hover h2 {
+ color: #ffffff;
+ text-shadow: 1px 1px 2px rgba(0, 255, 255, 0.7), 0 0 10px rgba(0, 217, 255, 0.8);
+ }
+
+ .contributor-card:hover p {
+ color: #ffffff;
+ text-shadow: 0 0 5px rgba(0, 255, 255, 0.7);
+ }
+
+ /* Dark mode */
+ body.dark-mode .contributor-card {
+ background-color: #121f3d; /* Darker background for dark mode */
+ }
+
+ body.dark-mode .contributor-card p,
+ body.dark-mode .contributor-card h2 {
+ color: #b0c4de;
+ }
+
+ body.dark-mode .contributor-card:hover h2,
+ body.dark-mode .contributor-card:hover p {
+ color: #ffffff;
+ text-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
+ }
+
\ No newline at end of file
diff --git a/script1.js b/script1.js
new file mode 100644
index 0000000..5e21c65
--- /dev/null
+++ b/script1.js
@@ -0,0 +1,76 @@
+let pageNo = 1;
+
+document.addEventListener("DOMContentLoaded", () => {
+ const contributorsContainer = document.getElementById("contributors");
+ const nextBtn = document.getElementById("nextBtn");
+ const prevBtn = document.getElementById("prevBtn");
+ const pageNoBox = document.getElementById("pageNoBox");
+
+ async function fetchContributors(page) {
+ pageNo += page;
+ try {
+ const response = await fetch(
+ `https://api.github.com/repos/ankit071105/Ticket-Booking/contributors?page=${pageNo}`
+ );
+ const contributors = await response.json();
+ console.log(contributors.length);
+ if (contributors.length == 0 || pageNo < 1) {
+ return;
+ }
+
+ contributorsContainer.innerHTML = "";
+ pageNoBox.innerText = pageNo;
+ contributors.forEach((contributor) => {
+ const contributorCard = document.createElement("div");
+ contributorCard.className = "contributor-card";
+
+ contributorCard.innerHTML = `
+
+
+
+ ${contributor.login}
+ Contributions: ${contributor.contributions}
+ `;
+
+ contributorsContainer.appendChild(contributorCard);
+ });
+ } catch (error) {
+ console.error("Error fetching contributors:", error);
+ }
+ }
+
+ fetchContributors(0);
+
+ prevBtn.addEventListener("click", (e) => {
+ e.preventDefault();
+ fetchContributors(-1);
+ });
+ nextBtn.addEventListener("click", (e) => {
+ e.preventDefault();
+ fetchContributors(1);
+ });
+});
+
+// dark mode
+document.addEventListener("DOMContentLoaded", () => {
+ const toggleCheckbox = document.getElementById("themeToggle");
+ const body = document.body;
+
+ // Load saved dark mode preference from localStorage
+ if (localStorage.getItem("dark-mode") === "enabled") {
+ body.classList.add("dark-mode");
+ toggleCheckbox.checked = true;
+ } else {
+ toggleCheckbox.checked = false;
+ }
+
+ toggleCheckbox.addEventListener("change", () => {
+ if (toggleCheckbox.checked) {
+ body.classList.add("dark-mode");
+ localStorage.setItem("dark-mode", "enabled");
+ } else {
+ body.classList.remove("dark-mode");
+ localStorage.setItem("dark-mode", "disabled");
+ }
+ });
+});