Layer5: [NG] FAQ Page

[chandrashritii]

Current Behavior

The questions are not differentiated based on active or inactive state at the moment.

Desired Situation

Denote active questions with a color transition (green to grey or vice versa).
[@leecalcote] FAQ Questions need to be updated with appropriate answers.

---

Contributor Resources
The layer5 repo contains two websites. The current generation and the next-generation of the layer5.io site.

If the layer5-ng label is absent on this issue, then this issue pertains to the current generation of the layer5.io website, which uses Jekyll and GitHub Pages. Site content is found under the master branch.

• See layer5 contributing instructions

If the layer5-ng label is present on this issue, then this issue pertains to the next-generation of the layer5.io website, which uses Gatsby, Strapi, and GitHub Pages. Site content is found under the layer5-ng branch.

• See layer5-ng contributing instructions

[chinmaym07]

Hey @leecalcote Can I work on this issue .?

[leecalcote]

Yes, that would be great, @chinmaym07 👍

[chinmaym07]

Hey @leecalcote did active here is referred to as when a user clicks on the chosen question , then the background of that question's header block should be changed from green to grey.? Just to verify ...as I cannot see the info about faq in the next gen doc.

Is this should be the required behaviour.?

[leecalcote]

@chinmaym07 thank you for checking the next gen design specification. That's a good thing to do. And you're right, this isn't defined in there. There is, however, a link to the Figma project where Layer5NG designs are held. This behavior isn't defined in those mockups, either, but you will certainly find those mockups helpful.

What you've here is precisely what's been asked for. This is great. Reflecting on the ask, now that I see the behavior in-action, will you make a tweak to the gray that is used and instead use the Dark Jungle Green color?

[chinmaym07]

Sure .. Thanks a lot for the feedback @leecalcote. 😀

[chinmaym07]

@leecalcote Can I open a PR for the same .?

[leecalcote]

Looks great. Yes, please.

[leecalcote]

If you’re up for it, a follow-on need here is the ability to filter on specific categories of FAQs, so that this component may be reused on multiple pages, but only show questions and answers from a specific category on a given page. The approach To doing so would be to add a category property to the FAQ component (the filter doesn’t need to be user-facing).

[chinmaym07]

Yes sure ..will work on that ... Please list out some of the categories..

[leecalcote]

Excellent. Actually, the categories will be dynamic based on information in the FAQ data. Currently, there are two, but this is just a text string match that the component property will do to filter and only show questions of a specific category.

Alternatively, GraphQL can be used to query for questions matching a specific category - again, a string match. Example usage:

<Faq category="Meshery" />

[leecalcote]

here we are - https://github.com/layer5io/layer5/issues/1401

[Jashpatel1]

Closing with #1409