\r\n\r\n## Figma export \r\n- [Readme](https://www.figma.com/file/3iOjW12ERFRDSVnpLuhQmf/landing-page-handoff?node-id=1305%3A5612) \r\n- [Design](https://www.figma.com/file/3iOjW12ERFRDSVnpLuhQmf/landing-page-handoff?node-id=798%3A3662)\r\n- [Components + Prototypes](https://www.figma.com/file/3iOjW12ERFRDSVnpLuhQmf/landing-page-handoff?node-id=1305%3A5613)\r\n\r\n\r\n\r\n## Navbar \r\nNavbar will be functioning most likely nowadays, with some refreshment.\r\n\r\n### From left to right\r\n- There will be a logo which takes you back home `/`.\r\n- Search in the navbar, which will appear once you scroll the site.\r\n- Explore, which will take you to global explorer -- I guess we don't have this one, so most likely skip it for now \r\n- Stats - Rankings like series \r\n- Connect -- this will stay the current one. Hopefully, it's already made as a component (?)\r\n\r\n## Search\r\nWe will have a multi-chain search including RMRK, Basilisk and other upcoming implementations.\r\nMultichain search will support [^supportedchain]\r\nThe search bar could be selected when pressing 'K' \r\nOn input focus, it will show trending collections\r\nthose trending collections could be fetched by default by most volume or most of buys per 7 days with the option to overwrite/add extra collections to list\r\nUnder search, we can show currently working chains , along with upcoming integrations [^chains]\r\nEach chain name would be linked to a particular explorer feed based on that chain. I.e. RMRK -> `/rmrk/explore`\r\n\r\nThe same search bar would go to the navbar once the user scrolls down\r\nThe majority of search is being done in \r\n- #3763 \r\n- #3360\r\n\r\n## Spotlight \r\n\r\nThis section would be a remake of our existing carousel component. The component will be still and without auto-play. \r\nOn this component, we will be showing collections from all chains. So having array with chain and address collection would be mandatory here. \r\nAs you see, we will be showing picture of collection with collection name. The link will take user to the collection view.\r\nThe spotlight will be horizontally scrollable, with at least 15 collection. \r\nThis feed will be a curated list by community picks. \r\n\r\nSome work is being done here\r\n- #3772 \r\n- #876\r\n\r\n## Top collections\r\nThe collection would receive a new look and feel. \r\nMost data are already done in the series insights component, so expanding here should be a breeze. \r\nThe new functionality will be there, showing 24 hours, 7 days and 30 days time frame of data.\r\nDefault selected time frame should be 7 days.\r\nOn the upper right, \"All\" would change collection data based on supported chains: [^supportedchain]. \r\n\r\n### Data\r\n- name of collection\r\n- floor of the collection \r\n- total volume of collection in native token per selected period\r\n- total volume of collection in USD per selected period\r\n- difference within the selected period\r\n\r\nLink will take the user to the collection view.\r\n\r\nSome part of preparation is upcoming in this issue.\r\n\r\n- #3869 \r\n\r\n## New Listings\r\nThis section would work same as current listings. \r\nThe major difference is that we will pool data from various indexers into one component. \r\nWe will be showing user on which chain listing happened, like [^supportedchain] .\r\n\r\n### Data\r\n- NFT name\r\n- Collection name\r\n- Listing price \r\n- Supported chains: [^supportedchain]\r\n\r\n## Latest Sales \r\nThis section would work same as current sales. \r\nThe major difference is that we will pool data from various indexers into one component. \r\nWe will be showing user on which chain sale happened, like supported chains: [^supportedchain] .\r\n\r\n### Data\r\n- NFT name\r\n- Collection name\r\n- Sale price (the last buy happened)\r\n- Supported chains: [^supportedchain]\r\n\r\n## Featured Articles\r\nWe will have a list of articles, for now, three without scroll. \r\n\r\n### Data\r\n- hero picture for the article \r\n- Article title\r\n- Short description\r\n- Link to an article\r\n\r\nMore articles can go to either to Medium or Substack publications, whichever we will decide for \r\n\r\n## Footer \r\nHere we will collect email address into our Substack. \r\nLink Substack of our Kodadot publication, can drop code for button\r\nOther links are to\r\n- FAQ -> https://kodadot.xyz/rmrk/faq -> probably we should move FAQ to root, like https://kodadot.xyz/faq \r\n- Grants -> link to current grants form \r\n- Documentation -> https://docs.kodadot.xyz/\r\n- Contribute -> https://kodadot.xyz/contribute\r\n#### Socials \r\n- Twitter -> https://twitter.com/kodadot\r\n- Instagram -> https://instagram/kodadot.xyz\r\n- Discord -> https://discord.gg/u6ymnbz4PR \r\n- Youtube \r\n- Telegram \r\n\r\n## Legend\r\n\r\n- https://github.com/kodadot/nft-gallery/issues/2792\r\n\r\n[^chains]: Currently supported chains are RMRKv1 and Basilisk Rococo. Upcoming integrated chains will be MoonRiver, MoonBeam and Astar(RMRK) \r\n\r\n[^supportedchain]: RMRK 1.0, Basilisk\r\n\r\n### Currently working chains\r\n- RMRKv1 \r\n- Basilisk Rococo\r\n### Upcoming working chains\r\n- MoonRiver\r\n- MoonBeam\r\n- Astar (RMRK)",[2038,2039,2041,2044],{"name":2019,"color":1989},{"name":2040,"color":1992},"A-landing",{"name":2042,"color":2043},"chief","67EA1F",{"name":2045,"color":2046},"redesign","227120",3844,"Redesign Landing page","2022-10-19T15:38:37Z","https://github.com/kodadot/nft-gallery/issues/3844",0.7284917,{"description":2053,"labels":2054,"number":2055,"owner":1994,"repository":1995,"state":1996,"title":2056,"updated_at":2057,"url":2058,"score":2059},"STATS: Offers numbers are a little bit off I think. \r\n\r\n\r\n_Originally posted by @JustLuuuu in https://github.com/kodadot/nft-gallery/issues/3640#issuecomment-1202199622_",[],3643,"Issue with the offers numbers","2022-08-02T22:24:05Z","https://github.com/kodadot/nft-gallery/issues/3643",0.7311502,{"description":2061,"labels":2062,"number":2075,"owner":1994,"repository":1995,"state":1996,"title":2076,"updated_at":2077,"url":2078,"score":2079},"Continuation of: \r\n- https://github.com/kodadot/nft-gallery/issues/11020\r\n\r\n# What \r\n\r\n\r\nlets put a small container that will have offers and swaps inside together with a time stamp\r\n- since we don't have the functionality to show which of the swaps and offers the user have seen, we will show the newest\r\n- there is a timestamp next to the offer/swap - lets show the collapsed times (1min, 2h, 3d, 4w, 5m) \r\n\r\nfigma available here: https://www.figma.com/design/JXNtryaNYhY0XJNArzvPQx/Handoff?node-id=11726-413&t=vK2M5C6EKLf01mGb-11\r\n\r\n## Close up \r\n\r\n- if empty, don't show it\r\n- skeleton loader over the component please\r\n- max visible is 2 items \r\n- underneath is count of all incoming offers + swaps \r\n- view all button - it can only redirect to one tab (can we put a logic that if there is 0 swaps and 10 offers, it will redirect to the offers and vice versa?) \r\n\t- if none of the numbers are 0, redirect to the tab with newest event\r\n- the events are more \"words\" than images (takes up less space)\r\n- offer is in the format of: X currency for Y-item\r\n- swap is in the format of: X-item for Y-item\r\n- refresh button at the top, please add simple animation and **small popup saying \"refresh\" on hover**\r\n\r\n\r\n**last thing is, lets change the wording of \"swap\" to \"create swap\" in the sidebar please**\r\n\r\nlet me know if you have any questions\r\n\r\n\r\n\r\n\r\n\r\n",[2063,2066,2067,2069,2071,2073],{"name":2064,"color":2065},"UX first","7057ff",{"name":2019,"color":1989},{"name":2068,"color":1992},"A-profile",{"name":2070,"color":1992},"A-sidebar",{"name":2072,"color":1992},"A-atomic-swap",{"name":2074,"color":1992},"A-offer",11334,"Incoming swaps and offers in profile sidebar ","2025-02-05T22:15:22Z","https://github.com/kodadot/nft-gallery/issues/11334",0.7335054,{"description":2081,"labels":2082,"number":2087,"owner":1994,"repository":1995,"state":1996,"title":2088,"updated_at":2089,"url":2090,"score":2091},"Adding comment here to follow from \r\n- #3477 \r\n\r\nIt would be nice to have some sort of option (maybe toggle) to show only active offers, since those are the ones which will be (I assume) most interesting to the user most of the time\r\n\r\n_Originally posted by @petersopko in https://github.com/kodadot/nft-gallery/issues/3463#issuecomment-1190410157_",[2083,2085,2086],{"name":2084,"color":1986},"$",{"name":2019,"color":1989},{"name":1991,"color":1992},3563,"Add sorting in user's offer table ","2022-07-26T12:10:49Z","https://github.com/kodadot/nft-gallery/issues/3563",0.7362449,{"description":2093,"labels":2094,"number":2101,"owner":1994,"repository":1995,"state":1996,"title":2102,"updated_at":2103,"url":2104,"score":2105},"currently, there's no way to see all of the offers users made, would be nice to have this in some sort of table. \r\n- add allow for easier withdrawal of offer\r\n- test if it's showing offers on burned nfts where offers did not expire",[2095,2098,2099,2100],{"name":2096,"color":2097},"enhancement","a2eeef",{"name":1985,"color":1986},{"name":2019,"color":1989},{"name":1991,"color":1992},3203,"add page to show currently standing offers for user","2022-07-23T07:57:01Z","https://github.com/kodadot/nft-gallery/issues/3203",0.74000496,{"description":2107,"labels":2108,"number":2115,"owner":1994,"repository":1995,"state":1996,"title":2116,"updated_at":2117,"url":2118,"score":2119},"When stats has trailing `/`, it break item links for example. \r\n> from Offer Stats at BSX, I have /stats/ in the link to the item. \r\n> I'm curious, is this being fixed someone or reported already so I don't report it twice? Or in some ongoing PR?\r\n\r\n\r\n\r\n\r\nTry click here \r\n- https://beta.kodadot.xyz/bsx/stats/\r\n- and choose the item \r\n\r\nhttps://discord.com/channels/840514076538830888/899643761968173108/999275535022694421\r\n\r\nApparently same thing in \r\n- #3453",[2109,2112,2113,2114],{"name":2110,"color":2111},"bug","d73a4a",{"name":2084,"color":1986},{"name":2006,"color":2007},{"name":1991,"color":1992},3493,"Broken links in Stats to item","2022-07-20T14:32:58Z","https://github.com/kodadot/nft-gallery/issues/3493",0.7492315,{"description":2121,"labels":2122,"number":2128,"owner":1994,"repository":1995,"state":1996,"title":2129,"updated_at":2130,"url":2131,"score":2132},"GM\r\n\r\n# Offers\r\n\r\n- this is a handoff of design\r\n- reuses previous designs of modal, extends ui and flow \r\n- it consists of: a modal to make offers, offers tab in gallery item to view offers, toasts that tell you whether you created offer, profile tab with incoming offers and outgoing offers\r\n\r\n## Figma: \r\nhttps://www.figma.com/design/JXNtryaNYhY0XJNArzvPQx/Handoff?node-id=11027-1025&t=mlWJ0Dirpl0N39Xk-11\r\n\r\nlets go\r\n\r\n\r\n# Offer modal \r\n- you will arrive there by clicking a button in every gallery item\r\n\r\n\r\nog, but still relevant \r\n\r\ninformation displayed:\r\n- best offer\r\n- collection floor\r\n- your offer \r\n- offer expiration\r\n\r\n### Currency switch\r\nwhen clicking this button next to the offer input, it changes the currency from DOT to USD, please make sure the balance changes as well: \r\n\u003Cimg width=\"137\" alt=\"image\" src=\"https://github.com/user-attachments/assets/b09826fc-042e-4f48-8a46-8d65e136f092\">\r\n\r\n\r\n### Disabled button states\r\nthere are some states with a tooltip: \r\n\u003Cimg width=\"681\" alt=\"image\" src=\"https://github.com/user-attachments/assets/7f447b6b-9307-4eac-983d-953e96506a34\">\r\n- please make sure they work\r\n\r\n# Signing\r\n\r\nin the figma, there is a diagram of the flow\r\n\r\n### Once you click Create offer\r\n- waiting for signing, once you sign, the whole flow moves to toasts \r\n\u003Cimg width=\"1101\" alt=\"image\" src=\"https://github.com/user-attachments/assets/b1094046-b0bd-45c5-9452-95e988b7441c\">\r\n- if you cancel signing, this is displayed\r\n\u003Cimg width=\"966\" alt=\"image\" src=\"https://github.com/user-attachments/assets/0cd96a77-8e17-412d-93b2-e456f181e31b\">\r\nplease reuse existing toasts designs and flow from signing drops etc.\r\n\r\n# Offers tab in gallery item\r\nslight refresh for the gallery item offer tab\r\n\r\n\r\n\r\n- it will be the second tab \r\n- there is amount, expiration, from and a button for accept if you are the owner of the nft \r\n\r\n## Mobile layout\r\n- added in there\r\n\u003Cimg width=\"444\" alt=\"image\" src=\"https://github.com/user-attachments/assets/634323d2-c3eb-41e0-bcec-fff68fa5c08a\">\r\n\r\n\r\n# Manage offers - profile\r\n- for this, new tab on profile is added\r\n- this tab will be later used for swaps as well \r\n\u003Cimg width=\"459\" alt=\"image\" src=\"https://github.com/user-attachments/assets/0451d50b-b929-4b54-9f94-2e92173ecf2f\">\r\n\r\nwith a filter of incoming and outgoing offers\r\n\u003Cimg width=\"413\" alt=\"image\" src=\"https://github.com/user-attachments/assets/3934dff8-913f-4b41-94cb-640b4556af00\">\r\n\r\n- each button displays the amount \r\n- then its just data \r\n\r\n\u003Cimg width=\"968\" alt=\"image\" src=\"https://github.com/user-attachments/assets/c9ec4e1a-8b92-4a9c-97ed-a6df78d2e091\">\r\n\r\n\r\n## Cancelling offer\r\n\u003Cimg width=\"914\" alt=\"image\" src=\"https://github.com/user-attachments/assets/01fef2fc-638a-41c3-833d-423bceab7667\">\r\n\r\nCancel offer is the same button as for unfollow, without hover effect, just the cursor pointer \r\n\r\n\r\n# Dark mode\r\n- follows the color rules\r\n\r\n\r\n# Other\r\nlet me know if anything is needed, thank you! \r\n",[2123,2124,2125,2127],{"name":2019,"color":1989},{"name":2042,"color":2043},{"name":2126,"color":1992},"A-modal",{"name":2074,"color":1992},10807,"Offer design and flow handoff ","2024-10-03T14:13:08Z","https://github.com/kodadot/nft-gallery/issues/10807",0.7494901,["Reactive",2134],{},["Set"],["ShallowReactive",2137],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"5Vkv6bRu5_UB6lqYVwWS5VNdnSqxJgBYt3xABnFT9RY":-1},"/kodadot/nft-gallery/3967"]