Bitcoin Stamps
Website - header #23
Replies: 7 comments 3 replies
-
Tablet - 1024px - default 
Tablet - 1024px - hover/active page state (ART STAMPS-COLLECTIONS) 
Tablet - 769px - hover/active page state The tablet navBar menu can display the text menu links instead of the hamburger dropdown menu.
Display size overview - from figma If you will add more menus in the future, you'll need to use the hamburger menu instead of text menus. |
Beta Was this translation helpful? Give feedback.
-
|
Mobile header spacing has been slightly decreased. I suggest having a breakpoint at 560px, where the header spacing increases. I'll write up details about the breakpoints in another topic. |
Beta Was this translation helpful? Give feedback.
-
|
The breakpoint is set to 568px Topic on breakpoints |
Beta Was this translation helpful? Give feedback.
-
|
The figma mockup versions for desktop, tablet and mobile are ready. The version layers are marked 🟢 and ready for dev.
Desktop
Tablet
Mobile - 768px
Mobile - 568px // 360px
|
Beta Was this translation helpful? Give feedback.
-
|
Added TRENDY submenu link to the NavBar Menu Links to a page that displays trending Tokens filtered by Minting and Top Mints/1000 Blocks (or how you determine it).
|
Beta Was this translation helpful? Give feedback.
-
|
Changed it to Trending |
Beta Was this translation helpful? Give feedback.
-
|
New figma header versions available
Marked ready for dev |
Beta Was this translation helpful? Give feedback.
-
|
Still need to do the figma design for the mobilemenu overlay when wallet is connected |
Beta Was this translation helpful? Give feedback.
-
|
Issues are moved to |
Beta Was this translation helpful? Give feedback.
-
Updated figma designs
Overview MobileSm
MobileMd
Tablet
The designs are in this section: Marked 🟠 and ready for dev |
Beta Was this translation helpful? Give feedback.
-
Header
Desktop - 1440px - default
Desktop - 1440px - hover/active page state (ART STAMPS-COLLECTIONS)
Mobile - 360px - default
Mobile - 360px - menu open - hover/active page state (DEPLOY)
There are figma mockups for mobile view 768px as well.
Desktop spacing for header - 72px top (to button) // 48px left/right.
Mobile spacing for header - 36px top (to logo) // 24px left/right.
The logo gradient has been slightly changed.
Hover and active page - color: #AA00FF
Mobile menu open state - overlay opacity: 0.8 // blur page underneath 8 (-ish).
The header menu layout will allow for a couple more menus in the future (glyphs/scr101/...).
Beta Was this translation helpful? Give feedback.
All reactions