-
Notifications
You must be signed in to change notification settings - Fork 641
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
Styled Header for new display package page #8639
Conversation
} | ||
|
||
.prefix-reserve-title { | ||
background-color: #F3F2F1; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: will it be better if we also use some shared color variable here?
.prefix-reserve-label { | ||
font-size: 14px; | ||
font-weight: 400; | ||
color: #2F6FA7; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: will it be better if we also use some shared color variable here?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice work! 👍
Solution
This PR is all about styling the header of the new display package page. I changed the sizing, spacing, and colors of the header elements to match the redesign mock ups. I also added a "prefix reserved" label that links to the ID prefix reservation docs. The goal of this PR was do all the necessary changes in the header except for the installation instructions, so I have left them untouched and will do those changes in a later PR. Here is what the final product looks like
Testing
I tested all the links to make sure that they worked with the feature flag on and off, checked the console to make sure that there were no errors in the .js file, and resized the page to make sure the styling stayed the same.
This addresses issue #8601