newrelic / instant-observability-website

Dashboards, alerts, and integrations all in one place. Our quickstarts bundle everything you need to start monitoring like a pro right out of the box.
https://newrelic.com/instant-observability/
Apache License 2.0
5 stars 20 forks source link

NR-12569 : header section in mobile and web view #212

Closed dikshab0202 closed 2 years ago

dikshab0202 commented 2 years ago

JIRA : https://issues.newrelic.com/browse/NR-11585 subtask: https://issues.newrelic.com/browse/NR-12569 Description:

  1. Header is sticky in web view and non-sticky in mobile view
  2. z-index=0 applied for header bottom border line in mobile view
  3. new relic logo size lesser in mobile view than web view
  4. adjusted font-size and height
  5. hover color is now same.

After change

image Screenshot 2022-05-25 at 7 29 41 AM

Before change

image image
gatsby-cloud[bot] commented 2 years ago

Gatsby Cloud Build Report

instant-observability-website

:tada: Your build was successful! See the Deploy preview here.

Build Details

View the build logs here.

:clock1: Build time: 1m

Performance

Lighthouse report

Metric Score
Performance :large_orange_diamond: 27
Accessibility :green_heart: 100
Best Practices :green_heart: 92
SEO :large_orange_diamond: 85

:link: View full report

dikshab0202 commented 2 years ago

Please sync this branch with the main branch. I have seen that the main branch got updated with a fix which I do not see in this branch. Thank you.

@pkosanam , okay , it is done.

pkosanam commented 2 years ago

Observed these things to be fixed:

  1. On header, "login" and "Get started" should have styles on hover
  2. Focus styles on the header are not similar to newrelic.com
dikshab0202 commented 2 years ago

Observed these things to be fixed:

  1. On header, "login" and "Get started" should have styles on hover
  2. Focus styles on the header are not similar to newrelic.com

Hi @pkosanam , worked on above points, please review and let me know if any suggestions.

pkosanam commented 2 years ago

Observed things which has to be fixed

  1. color of the menu options are not same as newrelic.com

  2. Login and Get started are moving when hovered

  3. Styles when focused(on links and also on the buttons on mobile view) are not matching as per newrelic.com

    image
  4. button on the carousel is hidden behind the card

    image
pkosanam commented 2 years ago

On 1127px, mobile menu is not displayed

image
dikshab0202 commented 2 years ago

On 1127px, mobile menu is not displayed image

Hi @pkosanam , it is fixed now.

nr-opensource-bot commented 2 years ago

:tada: This PR is included in version 1.2.2 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket: