An open API service indexing awesome lists of open source software.

https://github.com/webmobiledev/abine-test


https://github.com/webmobiledev/abine-test

Last synced: 7 months ago
JSON representation

Awesome Lists containing this project

README

          

# Abine Code Assessment

A brief assessment to show off your development and styling skills using ReactJS and Material UI.

## Task

Build the following component to the best of your ability. Use whatever styling preferance, coding preference, and component organizational structure you prefer.

![Component to Replicate](https://github.com/berge-business/code_assessment-react_card_component_mui/blob/master/assets/component.png?raw=true)

This is a live component on our Privacy Center Dashboard.

### Subtasks

- Hovering over the component should append 2 more buttons on top of the card (image below)
- Clicking the add button should dropdown a menu with the following items: Organization, Department, Group (image below)

### Additional Images

**Hover State**

![Hover State](https://github.com/berge-business/code_assessment-react_card_component_mui/blob/master/assets/hover_state.png?raw=true)

**Dropdown State**

![Dropdown](https://github.com/berge-business/code_assessment-react_card_component_mui/blob/master/assets/dropdown.png?raw=true)

# Getting Started

Please clone this repo and complete the task. Once finished, zip the src folder and send to hunter.berge@getabine.com.

Spend around 60 minutes completing this task - if you do not complete the task, or it takes longer than 60 minutes, that is ok. If that is the case, in your email, please include either how much extra time you needed or a brief description on the items not you did not complete.