Pokemon Locations Component (PL #13)

AarCon commented 4 months ago

This component is using the Location code that is written partially in #69. There is also code referenced on the dev branch here. Ultimately, we are going to use the following design for this component to implement the locations into the pokedex pages.

This first design state is going to be for a majority of pokemon that have less than TBD locations that they can be found. For anything more than that TBD number of locations, the following design state will be used.

A few things to keep in mind when tackling this:

In the case of more than TBD locations, the component will first show a "Read More..." button.
If the "Read More..." button is clicked, then it will expand into the second design. Otherwise, it will only show the TBD amount of locations.
When in the expanded mode, there needs to be a "Show Less..." button to revert to the initial state of showing TBD locations.
When in the expanded mode, the locations component will be stretched to be ~80% of the parent element width.
It would be nice to have an animation to transition from the "Less" state to the "More" state. This means that we should have classNames that are added onto the component conditionally.
In mobile mode, the "Read More..." button will still be there, the only difference is that the Location table will be below the "Gender Ratios" section automatically due to the restricted width.
Ensure that this code is compatible with the mode eventually too. For now, just set 3.0 data as null.

AarCon commented 3 months ago

Initial design of the Locations Component

https://github.com/TeamLumi/luminescent-team/assets/125856819/8059fc2d-f404-4442-9aba-4b3871b43d09

AarCon commented 3 weeks ago

Oh yeah I think this has been implemented lol. Closed by #110

TeamLumi / luminescent-team

Pokemon Locations Component (PL #13) #93