Skip to content

Commit c15678f

Browse files
authored
Merge branch 'main' into bottom-top-button
2 parents 8cd8394 + 4f3fc7e commit c15678f

6 files changed

Lines changed: 272 additions & 75 deletions

File tree

Official_Website/about.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,7 @@ <h1 class="abeezee-regular">Benefits of HelpOps-Hub
128128
</div>
129129
</div>
130130
<div id="scrollToTopBtn" class="scrollToTopBtn" onclick="scrollToTop()">
131-
<img src="scrollToTop.png" alt="Scroll to top">
131+
<img src="scrollToTop.png" class="im" alt="Scroll to top">
132132
</div>
133133
<script src="app.js"></script>
134134

Official_Website/banner copy.css

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
2-
31
.join-team {
42
display: flex;
53
align-items: center;
@@ -10,10 +8,18 @@
108
}
119

1210
.trophy {
13-
font-size: 24px;
11+
display: flex;
12+
align-items: center;
13+
justify-content: center;
1414
margin-right: 15px;
1515
}
1616

17+
.trophy svg {
18+
width: 24px;
19+
height: 24px;
20+
fill: #ffc107; /* Gold color */
21+
}
22+
1723
.text-content {
1824
flex-grow: 1;
1925
}
@@ -41,4 +47,4 @@
4147

4248
.join-button:hover {
4349
background-color: #6749e8;
44-
}
50+
}

Official_Website/banner.css

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,11 @@
44
display: flex;
55
align-items: center;
66
background-color: white;
7-
padding: 20px 30px;
7+
padding: 24px 16px;
88
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
99
border-radius: 8px;
10+
margin-left:70px;
11+
margin-right:60px ;
1012
}
1113

1214
.trophy {
@@ -28,6 +30,11 @@
2830
margin: 0;
2931
color: #666;
3032
}
33+
.trophy svg {
34+
width: 24px;
35+
height: 24px;
36+
fill: #ffc107; /* Gold color */
37+
}
3138

3239
.join-button {
3340
background-color: #7a5eff;
@@ -42,3 +49,4 @@
4249
.join-button:hover {
4350
background-color: #6749e8;
4451
}
52+

Official_Website/index.html

Lines changed: 128 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,9 @@
1010
<link rel="shortcut icon" href="Favicon.png" type="image/x-icon" />
1111
<link rel="stylesheet" href="dark_mode.css" />
1212
<link rel="stylesheet" href="navstyle.css" />
13+
<script type="text/javascript"
14+
src="https://cdn.jsdelivr.net/npm/@emailjs/browser@4/dist/email.min.js">
15+
</script>
1316
</head>
1417
<body>
1518
<header class="header">
@@ -21,35 +24,52 @@ <h1>HelpOps-Hub</h1>
2124
<p>Ensuring You Never Get Stuck In DevOps Again!</p>
2225
</div>
2326
</header>
24-
<nav class="nav" id="navbar">
27+
<nav class="nav " id="navbar">
28+
29+
30+
2531
<ul class="nav__list" id="navlinkitems">
26-
<li class="nav__item">
27-
<a href="contributor-index.html" class="fa-solid fa-people-group"></a>
28-
</li>
29-
<li class="nav__item">
30-
<a href="https://github.com/mdazfar2/HelpOps-Hub" target="_blank" class="fab fa-github"></a>
31-
</li>
32-
<li class="nav__item">
33-
<a href="https://www.linkedin.com/company/helpops-hub/" target="_blank" class="fab fa-linkedin"></a>
34-
</li>
35-
<li class="nav__item">
36-
<a href="https://discord.com/invite/UWTrRhqywt" target="_blank" class="fab fa-discord"></a>
37-
</li>
38-
<li class="nav__item">
39-
<a href="javascript:void(0);" class="fas fa-adjust" onclick="toggleTheme()"></a>
40-
</li>
41-
<li>
42-
<button class="about-button">
43-
<a href="./faq.html"> FAQ's </a>
44-
</button>
45-
</li>
46-
<li>
47-
<button class="sponsor-button" onclick="window.location.href='https://github.com/sponsors/mdazfar2'">
48-
<span class="heart">&#10084;</span> Sponsor
49-
</button>
50-
</li>
32+
<li class="nav__item">
33+
<a href="https://linkedin.com" target="_blank" class="fab fa-linkedin"></a>
34+
</li>
35+
<li class="nav__item">
36+
<a href="https://discord.com" target="_blank" class="fab fa-discord"></a>
37+
</li>
38+
39+
<li class="nav__item">
40+
<a href="javascript:void(0);" class="fas fa-adjust" onclick="toggleTheme()"></a>
41+
</li>
42+
<li>
43+
<a href="contributor-index.html">
44+
<button class="team-button">
45+
<svg viewBox="0 0 20 20" width="25" height="25" fill="none" class="text-primary dark:text-white"><path d="M9.95757 12.1164C12.8169 12.1164 15.2584 12.5697 15.2584 14.3837C15.2584 16.1969 12.8326 16.6667 9.95757 16.6667C7.09825 16.6667 4.65678 16.2134 4.65678 14.4002C4.65678 12.5862 7.08258 12.1164 9.95757 12.1164ZM14.5293 11.0241C15.6224 11.0038 16.7976 11.1539 17.2319 11.2605C18.1519 11.4414 18.7571 11.8106 19.0078 12.3472C19.2197 12.7878 19.2197 13.2989 19.0078 13.7387C18.6242 14.571 17.3878 14.8382 16.9073 14.9072C16.8081 14.9222 16.7282 14.8359 16.7387 14.7361C16.9842 12.4298 15.0314 11.3363 14.5263 11.0849C14.5046 11.0736 14.5002 11.0564 14.5024 11.0459C14.5039 11.0384 14.5129 11.0264 14.5293 11.0241ZM5.47137 11.0244C5.48779 11.0267 5.496 11.0387 5.49749 11.0454C5.49973 11.0567 5.49525 11.0732 5.47436 11.0852C4.96846 11.3366 3.01573 12.4301 3.26122 14.7357C3.27167 14.8362 3.19257 14.9218 3.09333 14.9075C2.6128 14.8385 1.3764 14.5713 0.992868 13.739C0.780209 13.2984 0.780209 12.7881 0.992868 12.3475C1.24358 11.8109 1.84798 11.4417 2.768 11.2601C3.20302 11.1542 4.37749 11.0041 5.47137 11.0244ZM9.95757 3.33337C11.9043 3.33337 13.4653 4.90193 13.4653 6.86075C13.4653 8.81882 11.9043 10.3889 9.95757 10.3889C8.01081 10.3889 6.44982 8.81882 6.44982 6.86075C6.44982 4.90193 8.01081 3.33337 9.95757 3.33337ZM14.7195 3.92162C16.5999 3.92162 18.0766 5.70107 17.5736 7.68315C17.2341 9.01755 16.0052 9.9039 14.636 9.86788C14.4987 9.86412 14.3636 9.85137 14.233 9.82885C14.1383 9.81234 14.0905 9.70502 14.1442 9.62546C14.6666 8.85244 14.9643 7.92257 14.9643 6.92439C14.9643 5.88269 14.639 4.91154 14.0741 4.11525C14.0562 4.09048 14.0428 4.05221 14.0607 4.02369C14.0756 4.00042 14.1032 3.98842 14.1293 3.98241C14.3196 3.94339 14.5151 3.92162 14.7195 3.92162ZM5.27998 3.92155C5.48443 3.92155 5.67993 3.94331 5.87095 3.98234C5.89632 3.98834 5.92467 4.0011 5.93959 4.02361C5.95676 4.05213 5.94407 4.09041 5.92616 4.11518C5.36131 4.91146 5.03598 5.88262 5.03598 6.92432C5.03598 7.92249 5.33371 8.85237 5.85602 9.62539C5.90975 9.70494 5.86199 9.81226 5.76723 9.82878C5.6359 9.85204 5.50159 9.86405 5.3643 9.8678C3.99508 9.90383 2.76614 9.01748 2.42663 7.68308C1.92297 5.70099 3.39964 3.92155 5.27998 3.92155Z" fill="currentColor"></path></svg> Our Team
46+
</button>
47+
</a>
48+
</li>
49+
<li>
50+
<button class="about-button">
51+
52+
<a href="./about.html">
53+
About Us
54+
</a>
55+
</button>
56+
57+
</li>
58+
<li><button class="about-button">
59+
60+
<a href="./faq.html">
61+
FAQ's
62+
</a>
63+
</button></li>
64+
<li>
65+
<button class="sponsor-button" onclick="window.location.href='https://github.com/sponsors/mdazfar2'">
66+
<span class="heart">&#10084;</span> Sponsor
67+
</button>
68+
</li>
69+
5170
</ul>
52-
</nav>
71+
72+
</nav>
5373

5474
<div class="search-container">
5575
<div id="search-box">
@@ -77,19 +97,19 @@ <h1>HelpOps-Hub</h1>
7797
</div>
7898
<div id="feedback-section">
7999
<h2>Feedback</h2>
80-
<form class="feedback-form" id="feedback-form">
100+
<form class="feedback-form" id="feedback-form">
81101
<label for="name">Name</label>
82102
<input type="text" id="name" name="name" required />
83103

84104
<label for="email">Email</label>
85-
<input type="email" id="email" name="email" required />
105+
<input type="email" id="email" name="user_email" required />
86106

87107
<label for="comments">Comments</label>
88-
<textarea id="comments" name="comments" required></textarea>
108+
<textarea id="comments" name="message" required></textarea>
89109

90110
<label for="rating">Rating</label>
91111
<div class="rating">
92-
<input type="radio" id="star1" name="rating" value="1" /><label for="star1" title="1 star">&#9733;</label>
112+
<label for="star1" title="1 star">&#9733;</label> <input type="radio" id="star1" name="rating" value="1" />
93113
<input type="radio" id="star2" name="rating" value="2" /><label for="star2" title="2 stars">&#9733;</label>
94114
<input type="radio" id="star3" name="rating" value="3" /><label for="star3" title="3 stars">&#9733;</label>
95115
<input type="radio" id="star4" name="rating" value="4" /><label for="star4" title="4 stars">&#9733;</label>
@@ -110,11 +130,46 @@ <h2>Feedback</h2>
110130

111131
<script src="app.js"></script>
112132
<script src="darkmode.js"></script>
133+
<script type="text/javascript">
134+
(function(){
135+
emailjs.init({
136+
publicKey: "rId2aw03Pj2ZNq2U5",
137+
});
138+
})();
139+
</script>
140+
<script>
141+
document.getElementById("feedback-form").reset();
142+
143+
</script>
113144
<script>
114145
// Feedback JS
115146
document.getElementById("feedback-form").addEventListener("submit", function(event) {
116147
event.preventDefault();
117-
148+
var rating = document.querySelector('input[name="rating"]:checked').value
149+
if (!rating) {
150+
var errorMessage = document.getElementById("error-message");
151+
errorMessage.innerText = "Please select a Rating!";
152+
errorMessage.style.display = "block";
153+
setTimeout(function() {
154+
errorMessage.style.display = "none";
155+
}, 3000);
156+
return;
157+
}
158+
let temp=document.getElementById('comments').value
159+
document.getElementById('comments').value= `Comments : ${document.getElementById("comments").value} Rating : ${document.querySelector('input[name="rating"]:checked').value}`;
160+
161+
emailjs.sendForm('service_hrz8hfg', 'template_na7xjc4',"#feedback-form").then(
162+
(response) => {
163+
console.log('SUCCESS!', response.status, response.text);
164+
},
165+
(error) => {
166+
console.log('FAILED...', error);
167+
},
168+
);
169+
document.getElementById('comments').value= temp
170+
171+
172+
118173
if (!document.querySelector('input[name="rating"]:checked')) {
119174
var errorMessage = document.getElementById("error-message");
120175
errorMessage.innerText = "Please select a rating!";
@@ -130,34 +185,47 @@ <h2>Feedback</h2>
130185
comments: document.getElementById("comments").value,
131186
rating: document.querySelector('input[name="rating"]:checked').value
132187
};
133-
console.log(formData);
134-
fetch('https://helpops-hub.vercel.app/feedback', {
135-
method: 'POST',
136-
headers: {
137-
'Content-Type': 'application/json'
138-
},
139-
body: JSON.stringify(formData)
140-
})
141-
.then(response => response.json())
142-
.then(data => {
143-
console.log('Success:', data);
144-
document.getElementById("message").innerText = "Thank you for your feedback!";
145-
document.getElementById("message").style.display = "block";
146-
setTimeout(function() {
147-
document.getElementById("message").style.display = "none";
148-
document.getElementById("feedback-form").reset();
149-
}, 3000);
150-
})
151-
.catch((error) => {
152-
console.error('Error:', error);
153-
var errorMessage = document.getElementById("error-message");
154-
errorMessage.innerText = "There was an error submitting your feedback.";
155-
errorMessage.style.display = "block";
156-
setTimeout(function() {
157-
errorMessage.style.display = "none";
158-
}, 3000);
159-
});
160-
});
188+
// fetch('https://helpops-hub.vercel.app/feedback', {
189+
// method: 'POST',
190+
// headers: {
191+
// 'Content-Type': 'application/json'
192+
// },
193+
// body: JSON.stringify(formData)
194+
// })
195+
// .then(response => response.json())
196+
// .then(data => {
197+
// console.log('Success:', data);
198+
// document.getElementById("message").innerText = "Thank you for your feedback!";
199+
// document.getElementById("message").style.display = "block";
200+
// setTimeout(function() {
201+
// document.getElementById("message").style.display = "none";
202+
// document.getElementById("feedback-form").reset();
203+
// }, 3000);
204+
// })
205+
// .catch((error) => {
206+
// console.error('Error:', error);
207+
// var errorMessage = document.getElementById("error-message");
208+
// errorMessage.innerText = "There was an error submitting your feedback.";
209+
// errorMessage.style.display = "block";
210+
// setTimeout(function() {
211+
// errorMessage.style.display = "none";
212+
// }, 3000);
213+
// });
214+
var messageElement = document.getElementById("message");
215+
messageElement.innerText = "Thank you for your feedback!";
216+
messageElement.style.display = "block";
217+
218+
setTimeout(function() {
219+
messageElement.style.display = "none";
220+
document.getElementById("feedback-form").reset();
221+
}, 3000);
222+
223+
224+
225+
226+
227+
228+
});
161229
</script>
162230
</body>
163231
</html>

Official_Website/navstyle.css

Lines changed: 41 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,40 @@
1616
flex-wrap: wrap;
1717
justify-content: center;
1818
}
19+
.team-button {
20+
display: flex;
21+
align-items: center;
22+
color:white;
23+
box-shadow: 5px 5px 20px #00ccff;
24+
border: none;
25+
gap: 7px;
26+
border-radius: 8px; /* Rounded corners */
27+
padding: 10px 20px; /* Padding around text */
28+
font-size: 20px; /* Text size */
29+
cursor: pointer;
30+
outline: none;
31+
top: 20px; /* Distance from the top */
32+
right: 20px; /* Distance from the right */
33+
transition: 0.5s;
34+
}
35+
.team-button svg{
36+
color: #00ccff;
37+
38+
}
39+
.team-button:hover {
40+
transform: scale(1.2);
41+
background-color: white;
42+
/* color: black;
43+
box-shadow: 5px 5px 20px #00ccff; */
44+
}
1945
.nav__list {
20-
/* list-style: none;
46+
/* list-style: none; */
2147
display: flex;
22-
justify-content: flex-end;
23-
margin-left: 55vh;
48+
justify-content: center;
49+
align-items: center;
50+
/* margin-left: 55vh;
2451
margin-top: -49px;
25-
padding: 0vh 4vw; */
52+
padding: 0vh 4vw; */
2653
padding: 3vh 5vw;;
2754
list-style: none;
2855
display: flex;
@@ -52,6 +79,15 @@
5279
.nav-toggle {
5380
display: none;
5481
}
82+
#ourteam{
83+
display: flex;
84+
justify-content: center;
85+
align-items: center;
86+
gap: 7px;
87+
}
88+
#ourteam p{
89+
font-size: 26px;
90+
}
5591

5692
.nav__link::before {
5793
content: "";
@@ -250,7 +286,7 @@
250286
.nav__item {
251287
color: #fff;
252288
}
253-
289+
254290
.nav__link::before {
255291
content: "";
256292
display: block;

0 commit comments

Comments
 (0)