\r\n\r\n\u003Cimg src=\"https://github.com/kodadot/nft-gallery/assets/44554284/2bcc08f4-59d8-457a-80ab-526d68f3015a\" width=\"400\" />\r\n\r\n\u003Cimg src=\"https://github.com/kodadot/nft-gallery/assets/44554284/bf3a2cf1-09d9-4c87-ad12-5929c9cbf419\" width=\"400\" />\r\n\r\n",[2004,2007,2009],{"name":2005,"color":2006},"UX first","7057ff",{"name":2008,"color":1986},"p3",{"name":1988,"color":1989},10617,"Update image placeholders","2024-07-18T09:58:14Z","https://github.com/kodadot/nft-gallery/issues/10617",0.6675639,{"description":2016,"labels":2017,"number":2024,"owner":1994,"repository":1995,"state":1996,"title":2025,"updated_at":2026,"url":2027,"score":2028},"Hello, I was looking at the https://beta.kodadot.xyz/?redesign=true and found a few things that need to be changed. I will mention everything I see as I open it. Some of these you may already know about, but I will try to highlight them all here.\r\n\r\n## Hero section\r\n- There should not be that much margin between \"Discover, Collect And Sell\" and \"Kusama NFTs\" It's maybe something like 10 or fewer px.\r\n- side graphics collapses into middle content. \r\n\r\n- Links under the search bar when clicked should direct the user to explore the page with the chosen network\r\n\r\nDoes the network in brackets have to be here? It's not looking great how it's not aligned vertically (or has the same width) as a search bar. \r\n\r\n## search bar/results\r\ncurrent status: \r\n\r\nthe design: \r\n\r\non page https://beta.kodadot.xyz/?page=1&redesign=true&search= there are no trading results when focusing on the search bar or pressing \"K\" \r\n- Hover effect missing on all cards\r\n- White mode hover effect: accent light 2\r\n- dark mode hover effect: `#363234`\r\ndemo: \r\n\r\nhttps://user-images.githubusercontent.com/90852205/196341528-db33d7f7-9cc5-4180-81ad-7ec1e7b8b3be.mp4\r\n\r\n\r\n## Missing info on collections\r\n\r\n- floor and units\r\n\r\n## Selection\r\n\r\nhow it should look like: \r\n\r\n- there is no hover effect on the text. It's not the nav section. When active - bold text\r\n\r\n\"see all\"\r\n- it should have only the hover effect - bold, not changing any color. \r\n\r\n\r\n\r\n\r\n\r\n## Spotlight\r\n- All of the cards in the carousel, including single nft cards in Newest lists, Latest sales, etc. should overflow over the edges of the content. They should scale up/down to show only 4 in the case of the spotlight and single nfts. Once it overflows, it should change its opacity to 30% and mode to luminosity. That means we see the content, but it's clear we can scroll. See the picture below.\r\nnow: \r\n\r\nin the design file: \r\n\r\n- heading should be white and also respect the font sizing of h2 - in this case, it's 39px, but that's a minor problem. \r\n- also the images in the spotlight card should have a stroke of 1px. Like this: \r\n\r\n- Then there's a slight problem with the drop shadow effect, but I think that will be solved with problem n. 1.\r\n\r\n\r\n## Top collections\r\n- On the bigger screens, there are 3 columns next to each other of top/trending collection cards. \r\n\r\n- In the design, there are only 2. \r\n- content inside card: \r\n\r\nnow it's missing network, USD volume, and % change. \r\n\r\n- missing filters for the time period and network. \r\n- \"see more link\" should be on hover similarly to the nav bar/footer links. \r\n\r\n## NFT carousel section\r\n- Same issue as with the spotlight carousel.\r\n> All of the cards in the carousel, including single nft cards in Newest lists, Latest sales, etc. should overflow over the edges of the content. They should scale up/down to show only 4 in the case of the spotlight and single nfts. Once it overflows, it should change its opacity to 30% and mode to luminosity. That means we see the content, but it's clear we can scroll. See the picture below.\r\n\r\n\r\n## Footer\r\n- We already discussed this one, but icons for socials in dark mode should have different hover effect. Icons should change to dark when hovering. See the picture below. \r\n\r\n- Links have hover state - bold\r\n\r\n## Cards\r\n\r\nthe card breaks when there is no collection/nft name. Also, In this case, it would be great to make max name length and then only add 3 dots behind if it is over.\r\nAnd I think that's it. If I see any more, I'll comment on the issue. If you have any questions, ping me anytime! \r\n\r\n## Ref\r\n- #3844 \r\n",[2018,2020,2023],{"name":2019,"color":1986},"p2",{"name":2021,"color":2022},"chief","67EA1F",{"name":1991,"color":1992},4090,"Redesign: Landing page feedback","2022-11-05T12:48:59Z","https://github.com/kodadot/nft-gallery/issues/4090",0.67471963,{"description":2030,"labels":2031,"number":2037,"owner":1994,"repository":1995,"state":1996,"title":2038,"updated_at":2039,"url":2040,"score":2041},"\u003Cimg width=\"1436\" alt=\"Screenshot 2022-08-26 at 15 56 04\" src=\"https://user-images.githubusercontent.com/5887929/186920082-9c03b4dd-ae75-4abf-8318-aae482ccf6e8.png\">\r\n\r\nWe've been working quite a while on a new design, and we will start rolling with a new one as mentioned in https://github.com/kodadot/nft-gallery/discussions/3710\r\nThis issue is in the draft, and I will gradually add descriptions of particular sections. \r\n\r\n@exezbcz will drop some more wisdom I've forgot and help you guide through\r\n- mobile description coming\u003Csup>soon\u003C/sup>\r\n\r\n\u003Cimg src=\"https://media1.giphy.com/media/l0HlFFTVOQz0bKYJG/giphy.gif\"/>\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)",[2032,2033,2035,2036],{"name":2019,"color":1986},{"name":2034,"color":1989},"A-landing",{"name":2021,"color":2022},{"name":1991,"color":1992},3844,"Redesign Landing page","2022-10-19T15:38:37Z","https://github.com/kodadot/nft-gallery/issues/3844",0.69151175,{"description":2043,"labels":2044,"number":2054,"owner":1994,"repository":1995,"state":1996,"title":2055,"updated_at":2056,"url":2057,"score":2058},"Although not a major update, it will improve the user interface perspective in upcoming explore and collection detail releases.\r\n\u003Cimg width=\"278\" alt=\"image\" src=\"https://user-images.githubusercontent.com/90852205/207564753-4628a901-0ba9-466d-9acb-924a4bc801b2.png\">\r\n\r\n- new figma file: explore v0.9, new components - https://www.figma.com/file/OwAEyE0QDPn3tHXZbyot1o/Explore-v0.9?node-id=0%3A1&t=Mp5WHz4Ig8kbcIsy-1\r\n- dynamic scalling, i think currently we have pretty good working version on the landing page. \r\n- screenshot is only the minimum size card. Its meant for #4444 - keeping the gutter fixed and based on the minimum card size changing the amount of the cards. \r\n\r\n- the card will scale up same as the current one. Keeping the font sizes (16px and 12px) \r\n- fixed padding, also the same. \r\n\r\n### hover effects\r\n- on nft name - changing from k-black to k-hovergrey, in darkmode from k-white to k-shade, there should then popup nft card #4340 \r\n- on \"collection\"- changing from grey to black, in dark mode to k-white (from the same color)\r\n\r\nbasically we are only changing the text inside and its color. \r\n\r\n",[2045,2048,2049,2050,2051],{"name":2046,"color":2047},"$","0E8A16",{"name":2008,"color":1986},{"name":1988,"color":1989},{"name":1991,"color":1992},{"name":2052,"color":2053},"visual change","6CDDCE",4496,"New NFT card ","2022-12-22T11:29:03Z","https://github.com/kodadot/nft-gallery/issues/4496",0.6953895,{"description":2060,"labels":2061,"number":2071,"owner":1994,"repository":1995,"state":1996,"title":2072,"updated_at":2073,"url":2074,"score":2075},"I guess this is the perfect opportunity to style a new update toast in the same neo-brutalism style. \r\nNow I've realized we don't have it in design and @exezbcz can sketch something! :) \r\n\r\n\r\n",[2062,2063,2066,2067,2070],{"name":2046,"color":2047},{"name":2064,"color":2065},"redesign-seeds","053A03",{"name":2008,"color":1986},{"name":2068,"color":2069},"S-blocked-✋","F9D0C4",{"name":1991,"color":1992},4015,"Update new version toast style","2024-04-17T05:02:48Z","https://github.com/kodadot/nft-gallery/issues/4015",0.70121187,{"description":2077,"labels":2078,"number":2082,"owner":1994,"repository":1995,"state":1996,"title":2083,"updated_at":2084,"url":2085,"score":2086},"I thought this was already fixed 🥹\r\n\r\n\r\nhttps://beta.kodadot.xyz/rmrk/explore?tab=GALLERY&page=1\r\n\r\n\u003Cimg width=\"389\" alt=\"image\" src=\"https://user-images.githubusercontent.com/5887929/186642368-d371d217-a9f8-4e5a-aa27-375d4507e8ce.png\">\r\n",[2079,2080,2081],{"name":2046,"color":2047},{"name":2019,"color":1986},{"name":1988,"color":1989},3836,"Black text on black overlay on hover at gallery explorer","2022-08-26T07:25:44Z","https://github.com/kodadot/nft-gallery/issues/3836",0.70165807,{"description":2088,"labels":2089,"number":2095,"owner":1994,"repository":1995,"state":1996,"title":2096,"updated_at":2097,"url":2098,"score":2099},"Once \r\n- #2781 is merged \r\nPreserve the ability to go to a particular page or randomize page number, maybe making it sticky while scrolling down?\r\n\r\n\r\n\r\n_Originally posted by @yangwao in https://github.com/kodadot/nft-gallery/issues/2781#issuecomment-1097869853_",[2090,2091,2092,2094],{"name":2046,"color":2047},{"name":2019,"color":1986},{"name":2093,"color":1989},"A-collection",{"name":1988,"color":1989},2843,"Preserve random button and pagination","2022-04-14T15:52:47Z","https://github.com/kodadot/nft-gallery/issues/2843",0.70242596,{"description":2101,"labels":2102,"number":2108,"owner":1994,"repository":1995,"state":1996,"title":2109,"updated_at":2110,"url":2111,"score":2112},"### What happened?\r\n[Design](https://www.figma.com/file/gHSzqGPeQ9qK4L0qIDcTjY/gallery-item-handoff?t=gvuA1jNzdBFeEbPh-0): \r\n# Buttons and states in right section\r\n\r\n- profile photo should have stroke and drop shadow\r\n\r\n\r\ndivider color to #999999 (k-grey) please, this one looks too light\r\n\r\n\r\n\r\n\r\n- use either $ or USD, not both\r\n\r\naction buttons:\r\n\r\n- both have hover effect to white, not k-accentlight\r\n\r\n\r\nactive state of options and share buttons: \r\n\r\nthis is the state when you click on the button: \r\n\r\n\r\nhover stay the same, but when the dropdown occurs, the button still has active state.\r\n\r\n\r\n### Please reproduce in steps\r\n\r\n.\r\n\r\n### Expected Behavior\r\n\r\n.\r\n\r\n### What browsers are you seeing the problem on?\r\n\r\n_No response_\r\n\r\n### At which address did you encounter bug?\r\n\r\n_No response_\r\n\r\n### Are you logged in?\r\n\r\nNone\r\n\r\n### Which wallet you are using?\r\n\r\n_No response_\r\n\r\n### At which chain did you encounter bug?\r\n\r\n_No response_\r\n\r\n### Screenshots\r\n\r\n.\r\n\r\n### Relevant log output\r\n\r\n_No response_\r\n\r\n### Payment link for reward\r\n\r\nhttps://kodadot.xyz/transfer/?target=%3CMy_Kusama_Address_check_https://github.com/kodadot/nft-gallery/blob/main/CONTRIBUTING.md#creating-your-ksm-address%3E\r\n\r\n### Code of Conduct\r\n\r\n- [X] I agree to follow this project's Code of Conduct",[2103,2104,2105,2107],{"name":2046,"color":2047},{"name":2019,"color":1986},{"name":2106,"color":1989},"A-item",{"name":1991,"color":1992},4581,"Gallery Redesign: Buttons and states in right section ","2023-01-04T16:01:12Z","https://github.com/kodadot/nft-gallery/issues/4581",0.7066596,{"description":2114,"labels":2115,"number":2119,"owner":1994,"repository":1995,"state":1996,"title":2120,"updated_at":2121,"url":2122,"score":2123},"Time to redesign our most precious component, which people often see. \r\nEspecially if waiting for a transaction, indexer is down, some glitch happened on our backend or loading of the profile, collection,gallery, items, or explorer takes a while\r\n### Old\r\n\r\n\r\n### New\r\n\r\n- figma file: landing page handoff, second page: https://www.figma.com/file/3iOjW12ERFRDSVnpLuhQmf/landing-page-handoff?node-id=0%3A1\r\n- dark mode is also there\r\n- text has max length, so the box stays always the same when the text changes - please make that so the maximum did you know phrase fits there. \r\n- svg animation: \r\n\r\n",[2116,2117,2118],{"name":2046,"color":2047},{"name":2008,"color":1986},{"name":1991,"color":1992},4262,"Redesign Loading screen ","2022-11-08T07:40:55Z","https://github.com/kodadot/nft-gallery/issues/4262",0.70983,["Reactive",2125],{},["Set"],["ShallowReactive",2128],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"YqmGOSFfxGXStjbDOh2WD-j3eps4U0siI2GeyBfZlhg":-1},"/kodadot/nft-gallery/4204"]