diff --git a/src/web/src/assets/dark.scss b/src/web/src/assets/dark.scss
index 43685ce8a..7dbd7dd1e 100644
--- a/src/web/src/assets/dark.scss
+++ b/src/web/src/assets/dark.scss
@@ -254,6 +254,17 @@
.breadcrumb {
background-color: var(--dark-secondary) !important;
}
+
+ .faq-item h3 {
+ color: var(--dark-text-primary) !important;
+ }
+
+ .faq-item p {
+ color: var(--dark-text-primary) !important;
+ }
+ .faq-item:hover {
+ border-color: var(--dark-blue-primary) !important;
+ }
}
/*
diff --git a/src/web/src/components/Header.vue b/src/web/src/components/Header.vue
index 72ef79e28..7a05a4589 100644
--- a/src/web/src/components/Header.vue
+++ b/src/web/src/components/Header.vue
@@ -58,6 +58,10 @@
Professors
+
+
+ FAQs
+
diff --git a/src/web/src/pages/FAQ_Breakdown b/src/web/src/pages/FAQ_Breakdown
new file mode 100644
index 000000000..07d21b561
--- /dev/null
+++ b/src/web/src/pages/FAQ_Breakdown
@@ -0,0 +1,13 @@
+Categorize questions: Group the questions into categories based on their
+topic or area of concern. For example, you could have categories such as
+"Getting Started," "Course Search," "Registration," "Schedule Planning,"
+"User Account," and "Technical Issues."
+
+Prioritize questions: Determine which questions are the most frequently
+asked or most important for users. Place those questions at the top
+of each category to ensure users can easily find the answers they need.
+
+Format and structure: Organize the FAQ page with headings, subheadings,
+and bullet points to make it easy to navigate and scan. Use formatting
+elements such as bold or italic text to highlight important points or
+keywords.
\ No newline at end of file
diff --git a/src/web/src/pages/FAQ_Collection b/src/web/src/pages/FAQ_Collection
new file mode 100644
index 000000000..2c9a89b7c
--- /dev/null
+++ b/src/web/src/pages/FAQ_Collection
@@ -0,0 +1,39 @@
+Q. What is YACS and what is its mission?
+A. YACS (Yet Another Course Scheduler) is a web-based application designed to assist students in scheduling and planning their courses at academic institutions.
+It provides features such as course catalog browsing, schedule building, and course availability information. YACS aims to simplify the course selection
+process, allowing students to efficiently organize their academic schedules.
+
+___________________________________________________________________________________________________________
+Q: How can I use the Schedule feature in YACS?
+A: The Schedule feature in YACS helps you plan your course schedule ahead of time. Follow these steps to use this feature:
+
+ 1.Click the Schedule navbar on the top of the page
+ 2.Add courses to your schedule by searching for them in the course catalog or using other available options.
+ 3.Arrange the courses in your preferred time slots or based on your schedule requirements.
+ 4.YACS will display your scheduled courses, allowing you to visualize your timetable and make adjustments if needed.
+
+___________________________________________________________________________________________________________
+Q: What is the Explore feature in YACS?
+A: The Explore feature in YACS allows you to browse various majors offered at RPI and view the courses available for a given semester. Here's how to use it:
+
+ 1.Click the Explore navbar on the top of the page
+ 2.Choose the major you want to explore from the available options.
+ 3.YACS will display the courses associated with the selected major for the specified semester.
+ 4.You can further explore each course for detailed information such as descriptions, prerequisites, and offered sections.
+
+___________________________________________________________________________________________________________
+Q: How can I use the Pathways Navigation feature in YACS?
+A: The Pathway Navigation feature in YACS helps you navigate through the pathways provided by RPI and determine which courses you need to take to fulfill pathway requirements. To use this feature, follow these steps:
+
+ 1.Click the Pathways button on the top of the page
+ 2.Select the pathway you are interested in or that aligns with your academic goals.
+ 3.YACS will display the pathway requirements and the courses available to fulfill each requirement.
+ 4.Explore the recommended course options and plan your academic path accordingly.
+
+___________________________________________________________________________________________________________
+Q: How can I use the Finals feature in YACS?
+A: The Finals feature in YACS allows you to enter your courses and generate your final exam schedule. To use this feature, follow these steps:
+
+ 1.Click the Finals button on the top of the page
+ 2.Enter the courses you are enrolled in for the semester. Once you finishing adding your courses, hit Search.
+ 3.YACS will generate your final exam schedule, displaying the date, time, and location of each exam.
\ No newline at end of file
diff --git a/src/web/src/pages/FAQs.vue b/src/web/src/pages/FAQs.vue
new file mode 100644
index 000000000..a89797887
--- /dev/null
+++ b/src/web/src/pages/FAQs.vue
@@ -0,0 +1,156 @@
+
+
+
Frequently Asked Questions
+
+
+
+
+
{{ faq.answer }}
+
{{ faq.answer1 }}
+
{{ faq.answer2 }}
+
{{ faq.answer3 }}
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/web/src/plugins/fontawesome-vue.js b/src/web/src/plugins/fontawesome-vue.js
index b02033aee..21ad32086 100644
--- a/src/web/src/plugins/fontawesome-vue.js
+++ b/src/web/src/plugins/fontawesome-vue.js
@@ -13,9 +13,12 @@ import {
faSearch,
faAddressBook,
faFileAlt,
+ faQuestionCircle,
+ // faAddressBook,
} from "@fortawesome/free-solid-svg-icons";
library.add(
+ faQuestionCircle,
faPaperPlane,
faMoon,
faCalendar,
@@ -23,6 +26,7 @@ library.add(
faBars,
faSearch,
faAddressBook,
+ faFileAlt,
faFileAlt
);
diff --git a/src/web/src/routes.js b/src/web/src/routes.js
index dc92419cc..ea9e96fbc 100644
--- a/src/web/src/routes.js
+++ b/src/web/src/routes.js
@@ -13,6 +13,7 @@ const PathwayPage = () => import("./pages/Pathway");
const SubjectExplorerPage = () => import("./pages/SubjectExplorer");
const NotFoundPage = () => import("./pages/NotFound");
const FinalExamScheduler = () => import("./pages/FinalExamScheduler");
+const FAQPage = () => import("./pages/FAQs");
var router = new VueRouter({
routes: [
@@ -43,6 +44,11 @@ var router = new VueRouter({
component: PathwayPage,
name: "Pathway",
},
+ {
+ path: "/faq",
+ component: FAQPage,
+ name: "FAQs",
+ },
{
path: "/FinalExamScheduler",
component: FinalExamScheduler,