You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
49 lines
1.7 KiB
49 lines
1.7 KiB
---
|
|
sidebar_position: 17
|
|
title: Your next steps
|
|
---
|
|
|
|
It is now your turn, we are going to give you a description as well as a Mockup, a bit like in a request for development in a company.
|
|
|
|
It's up to you to make the necessary developments!
|
|
|
|
## The description
|
|
|
|
A new inventory page must be created.
|
|
|
|
This is made up of two parts:
|
|
- On the left a grid representing the elements already present in my inventory
|
|
- On the right a grid/list of available elements
|
|
|
|
Here are the page specs:
|
|
* It must be accessible from the "inventory" URL of the website.
|
|
* It should also display images and alt text for each item.
|
|
* It should record all user actions.
|
|
* The text of the page must be in English/French at least.
|
|
|
|
### Inventory Grid
|
|
|
|
Here are the specifications of the inventory grid:
|
|
* This grid should contain items that are already in my inventory, as well as free slots.
|
|
* Adding to the grid is available by dragging/dropping the list on the right.
|
|
* When saving the position of the dropped element must be taken into account.
|
|
* It must not be possible to replace an element by another unless this one (the target element) becomes the element to be dropped in another position.
|
|
* Moving an item out of inventory will be &equivalent to deletion.
|
|
|
|
For the bravest (**optional**):
|
|
* Respect the `stackSize` data, management of the number of elements for a case.
|
|
* Manage right click for drag/drop (cuts number of items in half).
|
|
* Manage inventory size in config file.
|
|
|
|
### Item List
|
|
|
|
Here are the item list specifications:
|
|
* The list must have pagination.
|
|
* The name and image of the elements must be present.
|
|
* A search field will filter the elements.
|
|
* It must be possible to sort items by their names.
|
|
|
|
## Mockup
|
|
|
|
|