Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DOP 4340/1: Homepage Redesign #1016

Merged
merged 48 commits into from
Feb 27, 2024
Merged

DOP 4340/1: Homepage Redesign #1016

merged 48 commits into from
Feb 27, 2024

Conversation

mayaraman19
Copy link
Collaborator

@mayaraman19 mayaraman19 commented Feb 20, 2024

Stories/Links:

DOP-4340 + DOP-4341 + DOP-4342 + other small tweaks

New homepage! Now including @anabellabuckvar's tweaks to the introduction header. Built off of this branch of docs-landing.

Staging Links:

Updated staging link

Figma

Notes:

  • After verifying with design + Sarah Lin, "Docs Home" title was removed from the Sidenav, and nothing other than that should change from the production Sidenav

README updates

    • This PR introduces changes that should be reflected in the README, and I have made those updates.
    • This PR does not introduce changes that should be reflected in the README

@mayaraman19 mayaraman19 marked this pull request as ready for review February 21, 2024 22:19
@mayaraman19 mayaraman19 changed the title Dop 4340 1 homepage DOP 4340/1: Homepage Redesign Feb 21, 2024
Copy link
Collaborator

@seungpark seungpark left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

minor comments below but overall looks great!

one minor thing i noticed is that the hero and text are not aligned very well. we set the height of the hero at different viewports and the align-self: end properties on the heading and paragraph make the margins vary when changing viewport.

for example:

image

image

we can take this in another issue, but perhaps we can make the hero image as a background-image property and have strict margins, not alignments, on the heading and paragraph elements.

src/components/Card/CardGroup.js Show resolved Hide resolved
src/components/Card/CardGroup.js Outdated Show resolved Hide resolved
src/components/Card/index.js Outdated Show resolved Hide resolved
@mayaraman19
Copy link
Collaborator Author

I think I have addressed the comments - as for the header, this got approved by design, we didn't want to touch too many things in case the homepage gets changed again but I'm happy to create a separate ticket because I do think having set margins would be nice.

Copy link
Collaborator

@seungpark seungpark left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

largely LGTM! left a comment regarding:
1 - the column option to be respected
and 2 - the second set of card groups to have bigger icons

src/components/Card/index.js Outdated Show resolved Hide resolved
flex-direction: row;
padding-left: ${theme.size.medium};
img {
width: ${theme.size.xlarge};
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this overrides the width for the first set of cards, but on a minor note, the second icons seem smaller than design as well (design shows roughly 42-46px width):

image

Copy link
Collaborator

@seungpark seungpark left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this LGTM!

should merge the content change also !

@mayaraman19 mayaraman19 merged commit a2f24fc into main Feb 27, 2024
4 checks passed
@mayaraman19 mayaraman19 deleted the DOP-4340-1-homepage branch February 27, 2024 23:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants