[Screenshots] BFE under 'How it Works See It in Action' section

[saurabh100ni]

Current Behavior

Currently, every integration has only two old screenshots of the designer and visualizer in the 'How it Works See It in Action' section.

Desired Behavior

• Add new images and videos from the latest version of the software (MeshMap)
• Add screenshots for BFE integration.

Acceptance Tests

• Ensure your screenshot represents the use of a few specific integrations.
• The screenshot from the Designer mode should contain a valid design, refer to meshery catalog to use and view published designs.
• Add both Dark Mode and Light Mode screenshots.
• The screenshot should not be a snippet, take the full screenshot of your browser.
• Use Incognito mode on Chrome browser, to ensure your bookmark bar or any other items are not shown in the screenshot/video.

---

Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

• 📚 See contributing instructions.
• 🎨 Wireframes and designs for Layer5 site in Figma (open invite)
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack.

Join the Layer5 Community by submitting your community member form.

[harshcodesdev]

i would like to work on this, assign this to me.

[saurabh100ni]

Go on @HarshDeep61034 😎🚀

[harshcodesdev]

@saurabh100ni will these work ?

[saurabh100ni]

@HarshDeep61034 we have @sudhanshutech as reviewer, he will update us soon.

[sandramsc]

@saurabh100ni will these work ?

For the visualizer screenshot, icons are missing from the canvas. See the comment on this PR for more context.

Update: Following up with an update from Slack and Zoom call related to the expected visuals of the screenshots:

• Both the designer and visualizer screenshots LGMT (the visualizer renders visually as expected, based on selected filters i.e icons aren't "missing" in this case)
• The issue description states that incognito mode should be used to avoid bookmarks being captured in the screenshot (in this case please consider re-reading the issue description to understand the desired solution)
• Also suggest capturing only the window in question (i.e close unrelated tabs)

[saurabh100ni]

@sudhanshutech @Yashsharma1911 //

[github-actions[bot]]

Checking in... it has been awhile since we've heard from you on this issue. Are you still working on it? Please let us know and please don't hesitate to contact a MeshMate or any other community member for assistance.

---

        Be sure to join the community, if you haven't yet and please leave a :star: star on the project :smile:

[sandramsc]

@HarshDeep61034 any update on progress?

[sandramsc]

This issue has been open for some time with no recent activity, unassigning to open it up for new contributors to give it a go.

[kohantikanath]

Hi @sandramsc @saurabh100ni,

I would love to work on this issue. Can you please assign it to me?

[narasimha-1511]

Go on @kohantikanath