Skip to content

Commit 74d5b87

Browse files
sanjay-kvsanjay-kv
authored
Merge pull request #1381 from IkkiOcean/faq-page
[FEAT] :Add FAQ Page to Enhance User Experience
2 parents 0e806a2 + 5158234 commit 74d5b87

File tree

1 file changed

+229
-8
lines changed

1 file changed

+229
-8
lines changed

‎Website/faq.html

Lines changed: 229 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,233 @@
1-
<!DOCTYPE html>
2-
<html lang="en">
1+
<html>
32
<head>
4-
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>FAQ | ML Repos</title>
7-
<link rel="icon" href="/assets/recode-hive.png" type="image/png">
3+
<script src="https://cdn.tailwindcss.com"></script>
4+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
5+
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
6+
<link rel="stylesheet" href="css/styles.css" />
7+
<link rel="icon" href="/assets/recode-hive.png" type="image/png"> <!-- Added favicon -->
8+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
9+
<link rel="stylesheet" href="js/script.js">
10+
<style>
11+
12+
body {
13+
font-family: 'Roboto', sans-serif;
14+
}
15+
.faq-content {
16+
display: none;
17+
}
18+
.faq-content.active {
19+
display: block;
20+
}
21+
</style>
22+
23+
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
24+
<style>
25+
#progress-container {
26+
position: fixed ;
27+
top: 0px;
28+
left: 0;
29+
width: 100%;
30+
height: 15px;
31+
z-index: 99990;
32+
/* background: #f3f3f3; */
33+
}
34+
35+
#progress-bar {
36+
height: 53%;
37+
width: 0;
38+
background: linear-gradient(90deg, rgb(0, 72, 255) 0%, rgb(58, 114, 227) 50%, rgb(22, 121, 250) 100%);
39+
box-shadow: 0 0 4px rgba(0, 166, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
40+
transition: width 0.09s ease-in-out;
41+
border-radius: 10px;
42+
}
43+
44+
</style>
45+
<script>
46+
function toggleFaqContent(id) {
47+
const content = document.getElementById(id);
48+
content.classList.toggle('active');
49+
}
50+
</script>
851
</head>
9-
<body>
10-
<h1>This is the FAQ page</h1>
52+
<body class="dark-mode">
53+
<div id="progress-container">
54+
<div id="progress-bar"></div>
55+
</div>
56+
57+
<script>
58+
59+
window.addEventListener('scroll', function() {
60+
const winScroll = document.body.scrollTop || document.documentElement.scrollTop;
61+
const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
62+
const scrolled = (winScroll / height) * 100;
63+
document.getElementById('progress-bar').style.width = scrolled + '%';
64+
});
65+
</script>
66+
<div class="loading-container" id="loading-animation">
67+
<div class="loader"></div>
68+
</div>
69+
<header>
70+
<nav class="navbar">
71+
<a class="logo-container" href="/">
72+
<img src="assets/recode-hive.png" alt="Recode Hive Icon" class="logo-icon">
73+
<span class="logo-text">Recode Hive</span>
74+
</a>
75+
<ul class="nav-links">
76+
<li><a href="/">Home</a></li>
77+
<li><a href="/about">About</a></li>
78+
79+
<li><a href="https://recodehive.github.io/awesome-github-profiles/pages/blog.html">Learn</a></li>
80+
<li><a href="organization">Organization</a></li>
81+
<li><a href="/faq">FAQ</a></li>
82+
<li><a href="contact">Contact</a></li>
83+
<!-- Dropdown on navbar -->
84+
<li class="dropdown">
85+
<button id="dropdownButton" class="dropbtn">Know More</button>
86+
<div id="dropdownMenu" class="dropdown-content">
87+
<a href="/how-we-work">How we work?</a>
88+
<a href="/projects">Projects</a>
89+
<a href="/team">Team</a>
90+
<a href="conduct">Code of Conduct</a>
91+
</div>
92+
</li>
93+
<div class="nav-icons">
94+
<li>
95+
<a href="https://github.com/recodehive/machine-learning-repos" target="_blank">
96+
<img src="assets/images.png" alt="GitHub"> <!-- GitHub Icon -->
97+
</a>
98+
</li>
99+
<li>
100+
<button id="toggle-dark-mode" title="Use Ctrl+Q to toggle themes easily">
101+
<i class="fas fa-moon"></i>
102+
</button>
103+
</li>
104+
</div>
105+
</ul>
106+
<div class="line" id="line">
107+
<div class="bar1"></div>
108+
<div class="bar2"></div>
109+
<div class="bar3"></div>
110+
</div>
111+
</nav>
112+
</header>
113+
<main class="flex justify-center items-center">
114+
<div class="w-full max-w-2xl p-4">
115+
<h1 class="text-4xl font-bold text-blue-700 mb-8">
116+
Frequently Asked Questions<span class="text-black">(FAQs)</span>
117+
</h1>
118+
<div class="space-y-4">
119+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq1')">
120+
<div class="flex items-center">
121+
<i class="fas fa-question-circle mr-2"></i>
122+
<span>What is machine learning?</span>
123+
</div>
124+
<i class="fas fa-chevron-down"></i>
125+
</div>
126+
<div id="faq1" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
127+
<h3 class="text-black">Machine learning is a subset of artificial intelligence that enables computers to learn from data and improve their performance over time without explicit programming.</h3>
128+
</div>
129+
130+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq2')">
131+
<div class="flex items-center">
132+
<i class="fas fa-question-circle mr-2"></i>
133+
<span>How does your machine learning model work?</span>
134+
</div>
135+
<i class="fas fa-chevron-down"></i>
136+
</div>
137+
<div id="faq2" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
138+
<h3 class="text-black">Our model uses algorithms to analyze and learn patterns from data, which allows it to make predictions or decisions based on new, unseen data.</h3>
139+
</div>
140+
141+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq3')">
142+
<div class="flex items-center">
143+
<i class="fas fa-question-circle mr-2"></i>
144+
<span>What kind of data do you use?</span>
145+
</div>
146+
<i class="fas fa-chevron-down"></i>
147+
</div>
148+
<div id="faq3" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
149+
<h3 class="text-black">We use diverse datasets, including structured and unstructured data, to train our models, ensuring they can generalize well across different scenarios.</h3>
150+
</div>
151+
152+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq4')">
153+
<div class="flex items-center">
154+
<i class="fas fa-question-circle mr-2"></i>
155+
<span>How accurate is your model?</span>
156+
</div>
157+
<i class="fas fa-chevron-down"></i>
158+
</div>
159+
<div id="faq4" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
160+
<h3 class="text-black">The accuracy of our model varies by application and is evaluated using metrics like precision, recall, and F1 score. Detailed performance statistics are provided on our results page.</h3>
161+
</div>
162+
163+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq5')">
164+
<div class="flex items-center">
165+
<i class="fas fa-question-circle mr-2"></i>
166+
<span>Can I use your model for my own project?</span>
167+
</div>
168+
<i class="fas fa-chevron-down"></i>
169+
</div>
170+
<div id="faq5" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
171+
<h3 class="text-black">Yes, our model is available for use through API access or by downloading the code, depending on the licensing agreement.</h3>
172+
</div>
173+
174+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq6')">
175+
<div class="flex items-center">
176+
<i class="fas fa-question-circle mr-2"></i>
177+
<span>What programming languages and tools do you use?</span>
178+
</div>
179+
<i class="fas fa-chevron-down"></i>
180+
</div>
181+
<div id="faq6" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
182+
<h3 class="text-black">We primarily use Python with libraries like TensorFlow, Keras, and scikit-learn for model development, along with tools like Jupyter Notebooks for experimentation.</h3>
183+
</div>
184+
185+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq7')">
186+
<div class="flex items-center">
187+
<i class="fas fa-question-circle mr-2"></i>
188+
<span>How do you handle data privacy?</span>
189+
</div>
190+
<i class="fas fa-chevron-down"></i>
191+
</div>
192+
<div id="faq7" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
193+
<h3 class="text-black">We prioritize data privacy and comply with relevant regulations. All data is anonymized, and sensitive information is securely managed.</h3>
194+
</div>
195+
196+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq8')">
197+
<div class="flex items-center">
198+
<i class="fas fa-question-circle mr-2"></i>
199+
<span>What types of problems can your model solve?</span>
200+
</div>
201+
<i class="fas fa-chevron-down"></i>
202+
</div>
203+
<div id="faq8" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
204+
<h3 class="text-black">Our models are designed to tackle various problems, including classification, regression, clustering, and anomaly detection across multiple domains.</h3>
205+
</div>
206+
207+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq9')">
208+
<div class="flex items-center">
209+
<i class="fas fa-question-circle mr-2"></i>
210+
<span>Is there a community or support available?</span>
211+
</div>
212+
<i class="fas fa-chevron-down"></i>
213+
</div>
214+
<div id="faq9" class="faq-content p-4 bg-white rounded-lg shadow-md p-4">
215+
<h3 class="text-black">Yes, we offer community support through forums and documentation. Users can also reach out for direct assistance via our contact page.</h3>
216+
</div>
217+
218+
<div class="bg-blue-500 text-white rounded-lg shadow-md p-4 flex justify-between items-center cursor-pointer" onclick="toggleFaqContent('faq10')">
219+
<div class="flex items-center">
220+
<i class="fas fa-question-circle mr-2"></i>
221+
<span>How can I contribute to the project?</span>
222+
</div>
223+
<i class="fas fa-chevron-down"></i>
224+
</div>
225+
<div id="faq10" class="bg-white rounded-lg shadow-md p-4">
226+
<h3 class="text-black">We welcome contributions! You can participate by submitting code improvements, reporting issues, or suggesting features through our GitHub repository.</h3>
227+
</div>
228+
</div>
229+
</div>
230+
</main>
231+
11232
</body>
12233
</html>

0 commit comments

Comments
 (0)