Skip to content

Commit 54c257a

Browse files
pandeyji711pandeyji711
committed
Updated homepage to newfolder
1 parent 02fe3b4 commit 54c257a

5 files changed

Lines changed: 238 additions & 17 deletions

File tree

‎Official_Website/app.js‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,8 @@ document.addEventListener("DOMContentLoaded", async function () {
9292

9393
const filteredData = data.filter((file) => {
9494
const isWebsite = file.name.toLowerCase() === "official_website";
95-
return !file.name.includes(".") && !isWebsite;
95+
const isupdate = file.name.toLowerCase() === "Update_website";
96+
return !file.name.includes(".") && !isWebsite && !isupdate;
9697
});
9798

9899
const foldersWithDates = await Promise.all(
@@ -167,25 +168,24 @@ document.addEventListener("DOMContentLoaded", async function () {
167168

168169
fetchRepository("https://api.github.com/repos/mdazfar2/HelpOps-Hub/contents");
169170

170-
const accordionButtons = document.querySelectorAll('.btn.abeezee-regular');
171+
const accordionButtons = document.querySelectorAll(".btn.abeezee-regular");
171172

172-
accordionButtons.forEach(button => {
173-
button.addEventListener('click', function () {
174-
const targetId = this.getAttribute('aria-controls');
175-
const targetCollapse = document.getElementById(targetId);
173+
accordionButtons.forEach((button) => {
174+
button.addEventListener("click", function () {
175+
const targetId = this.getAttribute("aria-controls");
176+
const targetCollapse = document.getElementById(targetId);
176177

177-
if (targetCollapse.classList.contains('show')) {
178-
targetCollapse.classList.remove('show');
179-
this.querySelector('i').classList.remove('fa-chevron-up');
180-
this.querySelector('i').classList.add('fa-chevron-down');
181-
} else {
182-
targetCollapse.classList.add('show');
183-
this.querySelector('i').classList.remove('fa-chevron-down');
184-
this.querySelector('i').classList.add('fa-chevron-up');
185-
}
186-
});
178+
if (targetCollapse.classList.contains("show")) {
179+
targetCollapse.classList.remove("show");
180+
this.querySelector("i").classList.remove("fa-chevron-up");
181+
this.querySelector("i").classList.add("fa-chevron-down");
182+
} else {
183+
targetCollapse.classList.add("show");
184+
this.querySelector("i").classList.remove("fa-chevron-down");
185+
this.querySelector("i").classList.add("fa-chevron-up");
186+
}
187+
});
187188
});
188-
189189
});
190190

191191
//Scroll to top js

‎Update_website/New_web/index.html‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>HelpOps-Hub</title>
7+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" />
8+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" integrity="sha512-Fo3rlrZj/k7ujTnH/PRVV+ejsK+y4J0F5QKdKqz2xk5+6RzSyZjNzkRcbEXfz6/Rk+6RD7Vh+x2DlJ2CgWNLcA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
9+
<link rel="stylesheet" href="styles.css">
10+
11+
</head>
12+
<body>
13+
<header>
14+
<nav>
15+
<div class="logo">
16+
<img src="logo.png" alt="Logo">
17+
</div>
18+
<ul class="nav-links">
19+
<li><a href="#">Home</a></li>
20+
<li><a href="#">About</a></li>
21+
<li><a href="#">Team</a></li>
22+
<li><a href="#">Contact</a></li>
23+
</ul>
24+
<div class="nav-actions">
25+
<button class="sponsor-btn">Sponsor <i id="heart" class="fas fa-heart"></i></button>
26+
</div>
27+
</nav>
28+
</header>
29+
<main>
30+
<div class="main-content">
31+
<button class="star-button">
32+
<i class="star-icon"><i class="fas fa-star"></i></i> <!-- This is a star character -->
33+
Star Us
34+
</button>
35+
<h1>HelpOps-Hub</h1>
36+
<p>Ensuring You Never Get Stuck In DevOps Again!</p>
37+
<button class="get-started-btn">Get started</button>
38+
</div>
39+
</main>
40+
<script src="scripts.js"></script>
41+
</body>
42+
</html>

‎Update_website/New_web/logo.png‎

226 KB
Loading

‎Update_website/New_web/script.js‎

Whitespace-only changes.

‎Update_website/New_web/styles.css‎

Lines changed: 179 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,179 @@
1+
body {
2+
margin: 0;
3+
font-family: 'Arial', sans-serif;
4+
background: linear-gradient(180deg, #FDD86C 8.1%, #FF7D1F 100%);
5+
6+
display: flex;
7+
flex-direction: column;
8+
align-items: center;
9+
justify-content: center;
10+
height: 100vh;
11+
}
12+
13+
header {
14+
width: 100%;
15+
position: absolute;
16+
top: 0;
17+
background-color: transparent;
18+
padding: 10px 0;
19+
}
20+
21+
nav {
22+
display: flex;
23+
justify-content: space-between;
24+
align-items: center;
25+
width: 90%;
26+
margin: 0 auto;
27+
}
28+
29+
.logo img {
30+
height: 100px;
31+
width: 100px;
32+
position: relative;
33+
}
34+
35+
.nav-links {
36+
list-style: none;
37+
display: flex;
38+
gap: 50px;
39+
margin: 25px;
40+
padding: 10px 20px;
41+
background-color: #FDD86C;
42+
border-radius: 25px;
43+
44+
box-shadow: 0 4px 6px #FF7D1F;
45+
}
46+
47+
.nav-links li a {
48+
text-decoration: none;
49+
color: #000;
50+
padding: 10px 15px;
51+
font-size: x-large;
52+
53+
}
54+
.nav-actions {
55+
display: flex;
56+
align-items: center;
57+
gap: 10px;
58+
}
59+
60+
.search-btn, .sponsor-btn {
61+
background: none;
62+
border: none;
63+
cursor: pointer;
64+
font-size: 18px;
65+
66+
}
67+
68+
.search-btn {
69+
background-color: transparent;
70+
border-radius: 5px;
71+
padding: 5px 10px;
72+
}
73+
74+
.sponsor-btn {
75+
background-color: whitesmoke;
76+
border: none;
77+
border-radius: 25px; /* Rounded corners */
78+
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Drop shadow effect */
79+
color: #000000; /* Black text color */
80+
font-size: 24px;
81+
cursor: pointer;
82+
display: flex;
83+
align-items: center;
84+
justify-content: center;
85+
gap: 7px; /* Space between icon and text */
86+
transition: transform 0.1s ease; /* Smooth click effect */
87+
width: 150px;
88+
padding: 7px 7px ;
89+
font-family:cursive;
90+
margin-right: 7px;
91+
92+
}
93+
.sponsor-btn:active{
94+
transform:translateY(1px) ;
95+
}
96+
#heart{
97+
color: red;
98+
}
99+
100+
.main-content {
101+
text-align: center;
102+
margin-top: 80px;
103+
display: flex;
104+
align-items: center;
105+
justify-content: center;
106+
flex-direction: column;
107+
}
108+
109+
.get-started-btn {
110+
background-color: #fff;
111+
border-radius: 25px;
112+
padding: 10px 20px;
113+
cursor: pointer;
114+
font-size: 16px;
115+
116+
117+
}
118+
119+
.star-button {
120+
background-color: whitesmoke;
121+
border: none;
122+
border-radius: 25px; /* Rounded corners */
123+
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Drop shadow effect */
124+
color: #000000; /* Black text color */
125+
font-size: 24px;
126+
cursor: pointer;
127+
display: flex;
128+
align-items: center;
129+
justify-content: center;
130+
gap: 7px; /* Space between icon and text */
131+
transition: transform 0.1s ease; /* Smooth click effect */
132+
width: 150px;
133+
padding: 7px 7px ;
134+
font-family:cursive;
135+
}
136+
137+
.star-button:active {
138+
transform: translateY(1px); /* Slight move down on click */
139+
}
140+
141+
.star-icon {
142+
color: #FFD700; /* Yellow star color */
143+
font-size: 20px; /* Slightly larger than text */
144+
}
145+
146+
.get-started-btn {
147+
/* background-color: #FFFFFF; White background */
148+
border: none;
149+
border-radius: 25px; /* Rounded corners */
150+
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Drop shadow effect */
151+
color: #000000; /* Black text color */
152+
font-size: 16px;
153+
cursor: pointer;
154+
display: flex;
155+
align-items: center;
156+
justify-content: center;
157+
gap: 7px; /* Space between icon and text */
158+
transition: transform 0.1s ease; /* Smooth click effect */
159+
width: 180px;
160+
background-color: whitesmoke;
161+
font-family:cursive;
162+
}
163+
.get-started-btn:active {
164+
transform: translateY(1px); /* Slight move down on click */
165+
}
166+
167+
h1 {
168+
font-size: 96px;
169+
color: #000;
170+
margin: 0;
171+
font-family: 'Arial Black', sans-serif;
172+
}
173+
174+
p {
175+
font-size: 24px;
176+
color: white;
177+
margin: 20px;
178+
font-family:cursive;
179+
}

0 commit comments

Comments
 (0)