-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
70 lines (60 loc) · 3.52 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/styles.css">
<script src="./js/script.js" defer></script>
<link rel="icon" type="image/png" sizes="32x32" href="./assets/images/favicon-32x32.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<title>Frontend Mentor | FAQ accordion</title>
</head>
<body>
<div role="main" class="content-wrapper">
<h1><img src="assets/images/icon-star.svg" alt="star icon"> FAQs</h1>
<div role="region" aria-label="FAQ accordion">
<button class="first-accordion-item" aria-expanded="false">
<span class="question first-question">
What is Frontend Mentor, and how will it help me?<img src="assets/images/icon-plus.svg" alt="plus icon" class="first-plus hide"><img src="assets/images/icon-minus.svg" alt="minus icon" class="first-minus">
</span>
<span class="answer first-answer">
Frontend Mentor offers realistic coding challenges to help developers improve their
frontend coding skills with projects in HTML, CSS, and JavaScript. It's suitable for
all levels and ideal for portfolio building.
</span>
</button>
<button class="second-accordion-item" aria-expanded="false">
<span class="question second-question">
Is Frontend Mentor free?<img src="assets/images/icon-plus.svg" alt="plus icon" class="second-plus"><img src="assets/images/icon-minus.svg" alt="minus icon" class="second-minus hide">
</span>
<span class="answer second-answer hide">
Yes, Frontend Mentor offers both free and premium coding challenges, with the free option providing access to a range of projects suitable for all skill levels.
</span>
</button>
<button class="third-accordion-item" aria-expanded="false">
<span class="question third-question">
Can I use Frontend Mentor projects in my portfolio?<img src="assets/images/icon-plus.svg" alt="plus icon" class="third-plus"><img src="assets/images/icon-minus.svg" alt="minus icon" class="third-minus hide">
</span>
<span class ="answer third-answer hide">
Yes, you can use projects completed on Frontend Mentor in your portfolio. It's an excellent
way to showcase your skills to potential employers!
</span>
</button>
<button class="fourth-accordion-item" aria-expanded="false">
<span class="question fourth-question">
How can I get help if I'm stuck on a Frontend Mentor challenge?<img src="assets/images/icon-plus.svg" alt="plus icon" class="fourth-plus"><img src="assets/images/icon-minus.svg" alt="minus icon" class="fourth-minus hide">
</span>
<span class ="answer fourth-answer hide">
The best place to get help is inside Frontend Mentor's Discord community. There's a help channel where you can ask questions and seek support from other community members.
</span>
</button>
</div>
</div>
<div role="contentinfo" class="attribution">
Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>.
Coded by <a href="https://github.com/alison-ah/faq-accordion-main" target="_blank">Alison Holland</a>.
</div>
</body>
</html>