Create a Tab Navigation component

[Joaquin-M2]

Goal

To create a Tab Navigation component as described on the issue #63 .

Closes #63 .

Todos:

Component Creation

• [x] Create a navigation component made of tabs;
• [x] The Tab Navigation component should take the full width of the container;
• [x] The component should admit 2 or 4 tabs;
• [x] Each tab should be capable of admitting a numbered pill.

Component Demonstration

• [x] The demo should include the same component rendered twice, showing the result of the Tab Navigation component with 4 and 2 tabs;
• [x] Each rendered component should have a minimum of one tab rendered with a numbered pill.

Implementation Decisions

Component Creation

1. The Tab Navigation component has been made using the Material-UI components as base;
2. The styles of some Material-UI components were modified through the application of class names that were attached to customized CSS styles. For this purpose it was used the "makeStyles" Material-UI function;
3. The "Tab" and "Badge" Material-UI components were customized through the use of the "withStyles" Material-UI function;
4. Two TypeScript interfaces were created in order to configure the Tab Navigation component props;
5. The Tab Navigation component has been configured to admit an undetermined number of tabs. On this way, the component can render 2 or 4 tabs, but also any other quantity of tabs. This feature has been considered in order to improve the reusability of the component;
6. A series of explanatory comments were added in the Tab Navigation component code;
7. For code formatting, it was used the Prettier extension under its default configuration.

Component Demonstration

1. For testing purposes, the two rendered Tab Navigation components have been filled with the names indicated in the Figma design;
2. For testing purposes, the rendered components show the numbered pills with up to 4 digits (999+).

[Joaquin-M2]

Ready to merge!