refactor(resources): refine page design to Figma spec #15164
Conversation
✅ Deploy Preview for ethereumorg ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
github-actions
bot
added
content 🖋️
|
Can we include some event tracking on this page? button on homepage leading to this resources page: Event Catgory: Event Action: Event name: dashboard page Event Catgory: Event Action: Event name: Event Catgory: Event Action: Event name: |
@konopkja Added! |
|
@TylerAPfledderer is this ready for review? Was going to try and sneak in these Matomo events for this release if possible :D |
|
@corwintines I'll go ahead and open it. I had one design inquiry I mentioned in the Discord chat, but it's not pressing if the updates here are satisfactory. |
TylerAPfledderer
requested review from
wackerow,
corwintines,
pettinarip and
minimalsm
as code owners
|
Awesome, yeah I think whatever changes come from that discussion we can open another PR for if thats ok. This seems fine for me in its current state. |
src/pages/[locale]/resources.tsx
Outdated
| <VStack className="gap-4 py-16"> | ||
| <div className="text-center font-bold"> | ||
| <Translation id="page-resources:page-resources-find-more" /> | ||
| </div> | ||
| </div> | ||
| </Section> | ||
| <ButtonLink | ||
| href="https://ethereumdashboards.com" | ||
| size="lg" | ||
| onClick={() => { | ||
| trackCustomEvent({ | ||
| eventCategory: EVENT_CATEGORY, | ||
| eventAction: "links", | ||
| eventName: "ethereumdashboards.com", | ||
| }) | ||
| }} | ||
| > | ||
| ethereumdashboards.com | ||
| </ButtonLink> | ||
| </VStack> |
There was a problem hiding this comment.
This get's a little complicated with translations, since not languages structures sentences the same as english. That was why the link was nested in the json string, so then translators can the move the link where it fits best within the sentence.
@lukassim Any thoughts if we could get away with this type of trailing button label in regards to translations?
There was a problem hiding this comment.
Yeah good point ideally no links are in a fixed position in regards to the text since sentence structures can be different, this would likely cause issues in some languages
There was a problem hiding this comment.
If ya don't mind 😅 what about keeping the text as a statement that's separate from the link?
"Find more great resources!"
<Button />
So, not limit the flexibility of the design, while still being clear of the action. When we have other links that take action on the page that look like buttons, if we kept it as a link here, it might look like there is a broken style.
There is nothing else near this collection in the whitespace, so the clarity should still be maintained.
Description
Updates the newly creates resources (aka "Dashboard") page to refine the design to better reflect the final proposal from Figma.
Important Information
I left the "What's on this page" nav design as is for the larger screens, as it is easier to manage it's sticky placement when scrolling. It does hide the unusual z-indexing of the arch meter chart in one of the sections.
cc @pettinarip @wackerow for better visibility