Skip to content

Commit f1d20b4

Browse files
authored
Merge branch 'main' into contact-form-dark
2 parents 7bcf144 + a906006 commit f1d20b4

10 files changed

Lines changed: 192 additions & 159 deletions

File tree

Official_Website/about.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -126,7 +126,8 @@ <h1 class="abeezee-regular">Benefits of HelpOps-Hub
126126
</div>
127127
</div>
128128
</div>
129-
<button id="scrollToTopBtn" class="scrollToTopBtn"></button>
129+
<div id="scrollToTopBtn" class="scrollToTopBtn" onclick="scrollToTop() "><img src="scrollToTop.png"></div>
130+
<script src="app.js"></script>
130131

131132

132133
</body>

Official_Website/app.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -176,9 +176,9 @@ function scrollToTop() {
176176
}
177177
function handleScroll() {
178178
if (window.pageYOffset > 100) {
179-
scrollToTopBtn.classList.add("show");
179+
scrollToTopBtn.classList.add("showBtn");
180180
} else {
181-
scrollToTopBtn.classList.remove("show");
181+
scrollToTopBtn.classList.remove("showBtn");
182182
}
183183
}
184184
// Add scroll event listener

Official_Website/contributor-index.html

Lines changed: 30 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,7 @@
2020
<header class="header">
2121

2222
<div class="logo">
23-
<a href="./index.html"
24-
><img src="logo.png" alt="HelpOps-Hub Logo"
25-
/></a>
23+
<img src="logo.png" alt="HelpOps-Hub Logo">
2624
</div>
2725
<div>
2826

@@ -48,6 +46,25 @@ <h1>HelpOps-Hub</h1>
4846
</a>
4947
</button>
5048
</div> -->
49+
<style>
50+
#load-more {
51+
display: block;
52+
margin: 20px auto;
53+
padding: 10px 20px;
54+
font-size: 16px;
55+
background-color: #007bff;
56+
color: white;
57+
border: none;
58+
border-radius: 4px;
59+
cursor: pointer;
60+
transition: background-color 0.2s;
61+
}
62+
63+
#load-more:hover {
64+
background-color: #0056b3;
65+
}
66+
67+
</style>
5168

5269
</header>
5370

@@ -65,10 +82,10 @@ <h1>HelpOps-Hub</h1>
6582
<a href="https://github.com/mdazfar2/HelpOps-Hub" target="_blank" class="fab fa-github"></a>
6683
</li>
6784
<li class="nav__item">
68-
<a href="https://www.linkedin.com/company/helpops-hub/" target="_blank" class="fab fa-linkedin"></a>
85+
<a href="https://linkedin.com" target="_blank" class="fab fa-linkedin"></a>
6986
</li>
7087
<li class="nav__item">
71-
<a href="https://discord.com/invite/UWTrRhqywt" target="_blank" class="fab fa-discord"></a>
88+
<a href="https://discord.com" target="_blank" class="fab fa-discord"></a>
7289
</li>
7390

7491
<li class="nav__item">
@@ -110,41 +127,39 @@ <h1>Our Team</h1>
110127
</div>
111128
<div id="team-grid">
112129
<div class="team-member">
113-
<div class="card">
130+
<div class="card1">
114131
<div class="image-div">
115132
<img src="Screenshot (251).png" alt="Azfar Alam" />
116133
</div>
117134
<div class="info-div">
118-
<!-- <span class="badge founder">Founder</span> -->
119135
<h2>Azfar Alam</h2>
120136
<p>DevOps Engineer</p>
121137
</div>
138+
<span class="badge founder">Founder</span>
122139
</div>
123140
<div id="social-links">
124141
<a href="https://github.com/sponsors/mdazfar2"><i class="fas fa-heart"></i> Sponsor</a>
125142
<a href="https://github.com/mdazfar2"><i class="fab fa-github"></i> GitHub</a>
126143
<a href="https://www.linkedin.com/in/md-azfar-alam/"><i class="fab fa-linkedin"></i>linkedin</a>
127144
</div>
128-
<span class="badge founder">Founder</span>
129-
130-
</div>
145+
</div>
131146
<div class="team-member">
132-
<div class="card">
147+
<div class="card2">
133148
<div class="image-div">
134149
<img src="Screenshot (250).png" alt="Anurag Pandey" />
135150
</div>
136151
<div class="info-div">
137-
<!-- <span class="badge founder">Maintainer</span> -->
138152
<h2>Anurag Pandey</h2>
139153
<p>Software Engineer</p>
140154
</div>
155+
<span class="badge founder">Maintainer</span>
141156
</div>
157+
142158
<div id="social-links">
143159
<a href="https://github.com/sponsors/pandeyji711"><i class="fas fa-heart"></i> Sponsor</a>
144160
<a href="https://github.com/pandeyji711"><i class="fab fa-github"></i> GitHub</a>
145161
<a href="https://www.linkedin.com/in/anuragpandey0711/"><i class="fab fa-linkedin"></i>linkedin</a>
146162
</div>
147-
<span class="badge founder">Maintainer</span>
148163
</div>
149164
</div>
150165
</main>
@@ -489,8 +504,9 @@ <h2>Anurag Pandey</h2>
489504
</div>
490505
</div>
491506
</div>
507+
492508
</div>
493-
</div>
509+
<button id="load-more" style="display: none;">Load More</button>
494510
<script src="contributor.js"></script>
495511
<script src="dark_mode.js"></script>
496512
</body>

Official_Website/contributor-style.css

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -251,7 +251,6 @@ width: 40px;
251251
background-color: whitesmoke;
252252
border-radius: 20px;
253253
/* border: solid; */
254-
background-color: #fff2f2;
255254
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
256255
padding: 20px;
257256
/* background-color: gray; */
@@ -264,14 +263,14 @@ width: 40px;
264263
.team-member:hover{
265264
transform: scale(1.07);
266265
}
266+
267267
.team-member2 {
268268
display: flex;
269269
justify-content: space-between;
270270
align-items: center;
271271
background-color: whitesmoke;
272272
border-radius: 20px;
273273
/* border: solid; */
274-
background-color: #fff2ff;
275274
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
276275
padding: 20px;
277276
/* background-color: gray; */
@@ -286,7 +285,7 @@ width: 40px;
286285
transform: scale(1.07);
287286
}
288287
.card1 {
289-
background-color: #fff0f0;
288+
background-color: #ffeded;
290289
padding: 2rem;
291290
border-radius: 2rem;
292291
border-color: #3498db;
@@ -345,9 +344,9 @@ width: 40px;
345344

346345
.badge {
347346
position: relative;
348-
bottom: 120px;
349-
left:800 px;
350-
display: inline-block;
347+
bottom: 260px;
348+
left: 175px;
349+
display: inline-block;
351350
padding: 2px 10px;
352351
border-radius: 20px;
353352
font-size: 1em;

Official_Website/contributor.js

Lines changed: 74 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,11 @@
1-
// const hamBurger = document.querySelector(".hamburger");
2-
// const nMenu = document.querySelector(".nav-menu");
3-
4-
// document.addEventListener("DOMContentLoaded", function () {
5-
// setTimeout(function () {
6-
// document.querySelector("body").classList.add("loaded");
7-
// }, 500);
8-
// });
9-
// const loading = document.getElementById("loading1");
10-
// loading.innerHTML = `<h1 class="loading">Loading</h1>`;
11-
// Hamburger menu
12-
// hamBurger.addEventListener("click", mobileMenu);
13-
// function mobileMenu() {
14-
// hamBurger.classList.toggle("active");
15-
// nMenu.classList.toggle("active");
16-
// }
17-
181
const cont = document.getElementById("team-grid1");
2+
const loadMoreButton = document.getElementById("load-more");
193
const owner = "mdazfar2";
204
const repoName = "HelpOps-Hub";
5+
const itemsPerPage = 10; // Number of items per page
6+
let currentPage = 1; // Initialize the page number
7+
let allContributors = []; // To store all contributors data
8+
let pageNumber = 1; // Initialize the page number
219
// const loading = document.getElementById("skeleton-wrapper");
2210
// cont.appendChild(loading);
2311
async function fetchContributors(pageNumber) {
@@ -110,107 +98,86 @@ async function fetchContributors(pageNumber) {
11098
const contributorsData = await response.json();
11199
const cont = document.getElementById("team-grid1");
112100
cont.removeChild(cont.firstChild);
113-
101+
console.log(cont.removeChild(cont.firstChild));
114102
return contributorsData;
115103
}
116104

117105
// Function to fetch all contributors
118-
async function fetchAllContributors() {
119-
let allContributors = [];
120-
let pageNumber = 1;
121-
122-
try {
123-
while (true) {
124-
const contributorsData = await fetchContributors(pageNumber);
125-
if (contributorsData.length === 0) {
126-
break;
127-
}
128-
allContributors = allContributors.concat(contributorsData);
129-
pageNumber++;
106+
function renderContributors(contributors) {
107+
var cheak = 0;
108+
contributors.forEach((contributor) => {
109+
if (contributor.login === owner) {
110+
return;
130111
}
131-
var cheak = 0;
132-
allContributors.forEach((contributor) => {
133-
if (contributor.login === owner) {
134-
return;
135-
}
136112

137-
const contributorCard = document.createElement("div");
138-
contributorCard.classList.add("team-member7");
139-
const avatarImg = document.createElement("img");
140-
avatarImg.src = contributor.avatar_url;
141-
avatarImg.alt = `${contributor.login}'s Picture`;
142-
let name = contributor.name || contributor.login;
143-
if (name.length > 12) {
144-
name = name.slice(0, 10) + "...";
145-
}
113+
const contributorCard = document.createElement("div");
114+
contributorCard.classList.add("team-member7");
115+
const avatarImg = document.createElement("img");
116+
avatarImg.src = contributor.avatar_url;
117+
avatarImg.alt = `${contributor.login}'s Picture`;
118+
let name = contributor.name || contributor.login;
119+
if (name.length > 12) {
120+
name = name.slice(0, 10) + "...";
121+
}
146122

147-
const loginLink = document.createElement("a");
148-
const loginLink1 = document.createElement("a");
149-
loginLink1.href = `https://github.com/sponsors/${name}`;
150-
loginLink.href = contributor.html_url;
151-
loginLink.target = "_blank";
152-
const contri = contributor.contributions;
153-
contributorCard.innerHTML = ` <div class="card7">
154-
<div class="badge7" >Developer</div>
155-
<div class="image-div7">
156-
<img src=${avatarImg.src} alt=${avatarImg.alt} />
157-
</div>
158-
<div class="info-div7">
159-
<h2>${name}</h2>
160-
<p>Open Source Contributor</p>
161-
</div>
123+
const loginLink = document.createElement("a");
124+
loginLink.href = contributor.html_url;
125+
loginLink.target = "_blank";
126+
const contri = contributor.contributions;
127+
contributorCard.innerHTML = `
128+
<div class="card7">
129+
<div class="badge7">Developer</div>
130+
<div class="image-div7">
131+
<img src=${avatarImg.src} alt=${avatarImg.alt} />
132+
</div>
133+
<div class="info-div7">
134+
<h2>${name}</h2>
135+
<p>Open Source Contributor</p>
136+
</div>
137+
</div>
138+
<div class="data7">
139+
<div class="contributions7">
140+
<div class="contributions-count7">${contri}</div>
141+
<div class="contributions-label7">Contributions</div>
142+
</div>
143+
<div class="social-links7">
144+
<a href=${loginLink}>
145+
<i class="fab fa-github"></i>
146+
</a>
147+
<div class="github-label7">GitHub</div>
162148
</div>
163-
<div class="data7">
164-
<div class="contributions7">
165-
<div class="contributions-count7">${contri}</div>
166-
<div class="contributions-label7">Contributions</div>
167-
168-
</div>
169-
<div class="social-links7">
170-
<a href=${loginLink}>
171-
<i class="fab fa-github"></i>
172-
</a>
173-
<div class="github-label7">GitHub</div>
174-
</div>
175-
</div>`;
176-
// loginLink.appendChild(avatarImg);
177-
// contributorCard.appendChild(loginLink);
178-
if (cheak > 0 && name != "azfar-2") cont.appendChild(contributorCard);
179-
cheak++;
180-
});
149+
</div>`;
150+
151+
if (cheak > 0 && name != "azfar-2") cont.appendChild(contributorCard);
152+
cheak++;
153+
});
154+
}
155+
// Fetch all contributors with pagination
156+
157+
// Initial fetch
158+
159+
async function fetchAllContributors() {
160+
try {
161+
const contributorsData = await fetchContributors();
162+
allContributors = contributorsData;
163+
renderContributors(allContributors.slice(0, itemsPerPage));
164+
if (allContributors.length > itemsPerPage) {
165+
loadMoreButton.style.display = "block"; // Show the Load More button if more data exists
166+
}
181167
} catch (error) {
182168
console.error(error);
183169
}
184170
}
185171

186-
fetchAllContributors();
187-
188-
// let calcScrollValue = () => {
189-
// let scrollProg = document.getElementById("progress");
190-
// let pos = document.documentElement.scrollTop;
191-
// let calcHeight =
192-
// document.documentElement.scrollHeight -
193-
// document.documentElement.clientHeight;
194-
// let scrollValue = Math.round((pos * 100) / calcHeight);
195-
// if (pos > 100) {
196-
// scrollProg.style.display = "grid";
197-
// } else {
198-
// scrollProg.style.display = "none";
199-
// }
200-
// scrollProg.addEventListener("click", () => {
201-
// document.documentElement.scrollTop = 0;
202-
// });
203-
// scrollProg.style.background = `conic-gradient(#0063ba ${scrollValue}%, #d499de ${scrollValue}%)`;
204-
// };
205-
206-
// window.addEventListener("scroll", function () {
207-
// var scrollToTopButton = document.getElementById("progress");
208-
// if (window.pageYOffset > 200) {
209-
// scrollToTopButton.style.display = "block";
210-
// } else {
211-
// scrollToTopButton.style.display = "none";
212-
// }
213-
// });
172+
loadMoreButton.addEventListener("click", () => {
173+
const start = currentPage * itemsPerPage;
174+
const end = start + itemsPerPage;
175+
renderContributors(allContributors.slice(start, end));
176+
currentPage++;
177+
if (end >= allContributors.length) {
178+
loadMoreButton.style.display = "none"; // Hide the Load More button if no more data
179+
}
180+
});
214181

215-
// window.onscroll = calcScrollValue;
216-
// window.onload = calcScrollValue;
182+
// Initial fetch
183+
fetchAllContributors();

Official_Website/faq.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -210,7 +210,8 @@ <h5 class="mb-0">
210210
<button class="about-button1">
211211
<a href="./about.html"> About Us </a>
212212
</button>
213-
213+
<div id="scrollToTopBtn" class="scrollToTopBtn_FAQ" onclick="scrollToTop() "><img src="scrollToTop.png"></div>
214+
<script src="app.js"></script>
214215
<!-- jQuery and Bootstrap Bundle (includes Popper) -->
215216
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
216217
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>

Official_Website/feedback.png

-136 KB
Loading

Official_Website/scrollToTop.png

19.5 KB
Loading

0 commit comments

Comments
 (0)