Header 

Definition

Headers will feature the most important information about each collection.

Below is a list are the Indicators, dropdowns and data points and their functions that we will target on this page:

Functionality

1. Title of Collection:  

- Name of Collection  

- Icon bar of where the Collection is available

- This component is a new component made up of Icon Hyperlinks.

- Feature all available marketplaces (for svg logos go to icon Library)    

- X2Y2    - Opensea    - Lookrare    - Gem    - Genie

- Logo of Collection

- ERC token standard of collection and Contract address with link to block explorer plus Copy button

Considerations:

- Link button and copy button must be Special Button component, Round Extra Tiny variation with link icon inside (take icon from icon library or add new version of icon to Story Book. The new version artwork is smaller, so should be updated everywhere in the code base)

- Meatball Menu (absolute position bottom right on Collection Logo) which when pressed: brings up a new component NFT collection Lightbox modal with further details about collection

Information about each collection in Light box component for each Collection

2. Light box Modal for Collection:

- Name of collection

- Logo of Collection (this should be the same data  point atom that is described later on in the doc here)

- Banner of collection

- Collection Description

- Contract address and link to etherscan

- Token type (erc721 or 1155)* (Low priority

- Repeat of marketplaces with a new component - Icon hyperlinks (as described before)

Considerations:

Close Icon has a new design

- it is Special Button Round Tiny Component with Floating cross icon in it. Get icon from icon library (Navigation Icons).

Data Points

3. Collection Statistical Data Points:

- Total number of holders [in number]

- Total Listed [in percentage]

- Total supply [in number]

- Total Volume [in ETH]

- 24h Volume change (with arrow indicator) [in percentage]

- Current Floor Price [in ETH]

- 24h Floor price change (with arrow indicator)[in percentage]

- List Holders [in numbers]

- Number of Holders that are in user’s Lists (all lists)

- List Minters [in numbers]

- Number of Minters that are in user’s Lists (all lists)

See more go to - https://www.behance.net/gallery/186593571/Product-Design-CICD-Case-NFT-Collection-Analytics