Jumpstart

[edenvidal]

• [x] bring back the description box
• [x] add "image" field for each item in the jumpstart.csv
• [x] @stanislavasal to create images for each menu item.
• [x] redirect "community" to github discussions in a new tab https://github.com/orgs/rnbwdev/discussions
• [x] redirect support to "mailto:hello@rnbw.company"

[atulbhatt-system32]

@edenvidal few queries regarding this task.

-Bringing back the description, means adding a section on the right of the jumpstart menu that shows the description (start a new project) which comes from the jumpstart.csv

• What will come in the image field of jumpstart.csv? Url or image or path from the image stored locally or just the name of the image.

• Where are we going to show the image?

[edenvidal]

@atulbhatt-system32

• right
• url of the image
• we're going to show the above the label. ("start a new project", then the image)

[stanislavasal]

@edenvidal @atulbhatt-system32 Hello! Excuse me, I have so many questions today... Could you please elaborate a bit more on which images we'll be adding and what description needs to be provided? I've read the messages above, but I'm still not entirely clear 😓

[atulbhatt-system32]

@stanislavasal there are various actions in Jumpstart menu. Like New, open. On the left side we have various actions that we can do and on right side we show description of the action that we hover on.

Above the description we will show some image that represents the action.

I guess that is what needs to be done. Those images are required to be designed.

Am I right @edenvidal ?

[edenvidal]

yes! @stanislavasal , this task include both code and design. i think it would be better to actually start with code, with a placeholder image, and then we can design the icons for each. wdyt?

[stanislavasal]

@edenvidal So, as far as I understand, first I need to write the code that will allow switching to different images when hovering over different buttons, using placeholder images. And then design the cards and replace them.

[edenvidal]

@stanislavasal

1. design the illustration for each item (160/160px) - this is the first task. we're starting with design. for each item, we're making a meaningful illustration. before we go on the next step, there an illustration for each item.
2. prepare the svg files by flattening a copy (not the master, a copy) of them and export them as a flat svg layer.
3. we use a command menu react component called "cmdk" it has a feature for displaying the preview/card alongside the menu item. find our with @atulbhatt-system32 how to work with it 🙌

[atulbhatt-system32]

@stanislavasal

The image below shows the example.

• Go to https://cmdk.paco.me/
• Select Framer example to see how to create something similar
• Implement the same in rnbw with accordance to our design

[edenvidal]

@stanislavasal can you make a pr for that? if not ready, no worries. we'll confirm and continue working on it(@atulbhatt-system32 )

[edenvidal]

@atulbhatt-system32 can you confirm the pr (and we'll then close it)