Add Learn More button to Nonprofit in Project #86
Conversation
su-esther
requested review from
SirajChokshi,
AndrewLester,
arpanlaha and
meghna2409
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| @@ -46,8 +47,13 @@ | |||
| > | |||
| <h2>Our Partner</h2> | |||
| <p>{data.project.nonprofitDescription}</p> | |||
| <Button | |||
| href={data.project.nonprofitUrl} | |||
| type="secondary-custom" | |||
There was a problem hiding this comment.
We probably want to use a primary button here since there won't always be good contrast between the background the project's color. Should make this easier to read.
There was a problem hiding this comment.
With this primary button you can use the primary-custom type and change the background color + text color to make it look like the scheme in DoubleBanner. Is that what you had in mind @SirajChokshi? The project-specific coloring for this looks pretty good imo.
My only concern with using the primary button here is that we'll eventually want a "visit site"/"view project" button that should be more visible, but that could have unique styling anyway.
There was a problem hiding this comment.
Yup, I meant primary-custom. I like the project-themed colors too :)
I think the secondary button in this type of lockup should be just text. At least to me, the border on the secondary button is too heavily weighted to make the label readable.
There was a problem hiding this comment.
Great work adding this, and nice job incorporating the project-specific colors. I didn't really consider that before, but it makes total sense.
Just the comments in the thread above I think, + do you mind adding back the newline between the sections on line 50, just to improve the readability of the page file?
|
This button is primary, but I was thinking we'd have the project color as the background and white as the text color (cc @AndrewLester) |
|
Yep, I agree. For example, the "double banner"'s color scheme, to be used on the button:
(Example color scheme of the button, just from the 7000 languages banner) The |
Status: 🚀 Ready
Description
Adds a "Learn More" button that leads to the nonprofit's website in each H4I project's page
Fixes #85
Todos
Screenshots