chore(ui): adding convention for figma to front end component naming

[BillyFigueroa]

Description

This is an ADR to create a naming convention for the naming of components for the front end based on Figma designs

Related Issue

• 395

Screenshots

Examples

In this image you can see 3 different things outlined

• The Name of the component at large which is called Stats Widget
• The selected component
• The name of the selected compoent or type i.e. "With right icon"

In this case, this would have been a component that has variants, but rather than built extra abstractions and complication, the components were built out as individual components inside of a folder called StatsWidget

In this image we can see...

• The name of the folder StatsWidget
• The name of the compoennt WithRightIcon
• The component
• The attributes for the component which line up with the attributes that the component has i.e.
  • Stats text
  • Helper text

All attributes were not included, but the ones we did include were named based on this components attributes in Figma

[UncleGedd]

Also need to change PR title, I would call this a chore

[UncleGedd]

Putting the images in ui/static makes it look like we are going to serve them. Instead, let's make an images folder in the adr directory