-
Notifications
You must be signed in to change notification settings - Fork 92
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into feature/ai-enhancement
Signed-off-by: Sezal Lagwal <[email protected]>
- Loading branch information
Showing
34 changed files
with
750 additions
and
640 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,73 @@ | ||
/* component/FAQ.css */ | ||
|
||
.faq-container { | ||
margin-top: 100px; | ||
margin-bottom: 40px; | ||
padding: 20px; | ||
border-radius: 25px; | ||
border: 2px solid #ccc; | ||
background-color: #f9f9f9; | ||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); | ||
} | ||
|
||
h1 { | ||
text-align: center; | ||
margin-bottom: 20px; | ||
font-family: 'Arial', sans-serif; | ||
color: #333; | ||
font-size: 24px; /* Decreased size */ | ||
} | ||
|
||
.faq-item { | ||
position: relative; | ||
margin-bottom: 15px; | ||
padding: 10px; | ||
border: 2px solid #ddd; | ||
border-radius: 20px; | ||
background-color: #fff; | ||
transition: background-color 0.3s, box-shadow 0.3s; | ||
} | ||
|
||
.faq-item:hover { | ||
background-color: #157aac; | ||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); | ||
} | ||
|
||
.faq-question { | ||
font-size: 18px; | ||
color: #333; | ||
cursor: pointer; | ||
margin: 0; | ||
transition: color 0.3s; | ||
} | ||
|
||
.faq-question:hover { | ||
color: #e9e0e0; /* Change color on hover */ | ||
} | ||
|
||
.faq-answer { | ||
font-size: 16px; | ||
color: #ffffff; | ||
margin-top: 10px; | ||
cursor: pointer; | ||
padding: 5px 0; | ||
transition: max-height 0.3s ease, opacity 0.3s ease; | ||
display: flex; /* Use flexbox */ | ||
align-items: center; /* Center vertically */ | ||
justify-content: center; /* Center horizontally */ | ||
height: 40px; /* Set a height to create a consistent layout */ | ||
left: 20px; /* Maintain your left positioning */ | ||
} | ||
|
||
|
||
.num { | ||
position: absolute; | ||
top: 10px; /* Adjusted positioning */ | ||
left: -25px; /* Position for the number bubble */ | ||
border-radius: 50%; | ||
background-color: #0fa2eb; | ||
color: white; | ||
padding: 5px 10px; | ||
font-weight: bold; | ||
} | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
// component/FAQ.jsx | ||
import React, { useState } from 'react'; | ||
import './FAQ.css'; // Import the CSS file for styling | ||
|
||
const FAQ = () => { | ||
const [activeIndex, setActiveIndex] = useState(null); | ||
|
||
const toggleAnswer = (index) => { | ||
setActiveIndex(activeIndex === index ? null : index); | ||
}; | ||
|
||
return ( | ||
<div className="faq-container"> | ||
<h1>Frequently Asked Questions</h1> | ||
{faqData.map((item, index) => ( | ||
<div key={index} className="faq-item"> | ||
<h2 onClick={() => toggleAnswer(index)} className="faq-question"> | ||
{item.question} | ||
</h2> | ||
{activeIndex === index && <p className="faq-answer">{item.answer}</p>} | ||
</div> | ||
))} | ||
</div> | ||
); | ||
}; | ||
|
||
const faqData = [ | ||
{ | ||
question: "What is BitBox?", | ||
answer: "BitBox is a user-friendly platform that simplifies version control and collaboration for developers.", | ||
}, | ||
{ | ||
question: "How does BitBox enhance collaboration?", | ||
answer: "BitBox offers intuitive tools that enable both solo programmers and large teams to manage projects efficiently.", | ||
}, | ||
{ | ||
question: "How do I get started with BitBox?", | ||
answer: "You can sign up for an account on BitBox and start managing your projects right away.", | ||
}, | ||
{ | ||
question: "Is BitBox compatible with modern development workflows?", | ||
answer: "Yes, BitBox seamlessly integrates with modern development workflows, providing fast and reliable performance.", | ||
}, | ||
{ | ||
question: "How can I contact support if I need help?", | ||
answer: "You can reach out to support through the 'Contact Us' page or by emailing [email protected].", | ||
}, | ||
]; | ||
|
||
|
||
export default FAQ; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
// component/FAQ.jsx | ||
import React from 'react'; | ||
|
||
const FAQ = () => { | ||
return ( | ||
<div className="faq-container"> | ||
<h1>Frequently Asked Questions</h1> | ||
<div className="faq-item"> | ||
<h2>Question 1: What is this project about?</h2> | ||
<p>Answer: This project is designed to help users...</p> | ||
</div> | ||
<div className="faq-item"> | ||
<h2>Question 2: How do I get started?</h2> | ||
<p>Answer: To get started, you can...</p> | ||
</div> | ||
{/* Add more FAQ items as needed */} | ||
</div> | ||
); | ||
}; | ||
|
||
export default FAQ; |
Oops, something went wrong.