Small improvements in the header part of the website https://openrouteservice.org

[phtdacosta]

Is there an existing issue for this?

• I have searched the existing issues

Problem description

I really like the quality of the project but as a front-end designer my OCD got tingling when I saw the header of the website

Just three small things though:

• The cursor changes to "input mode" hovering over (sections with subsections) "Tools" and "Examples" but not over "API Playground"
• The header buttons are not vertically centralized enough, compared to the logo
• This very very thin white line under the header does not match the width and white-ness of the buttons in the website

Small things but would improve a lot the overall feeling of the website.
Does it make sense if I want to help? Am I able to help fix it somehow? How could I do it? Let me help if possible! I really appreciate you guys' efforts to make and maintain such great tool, to the community.

Proposed solution

If possible, I just want to analyze the current CSS/HTML sources of the landing page, and fix the issues accordingly.

Additional context

No response

Forum Topic Link

No response

[TheGreatRefrigerator]

Hi @phtdacosta,

thank you for your feedback. The openrouteservice.org website is not open source due to sensitive data.
As this is a wordpress solution using themes and plugins we have limited customization capabilities for parts of the website.

• The cursor changes to "input mode" hovering over (sections with subsections) "Tools" and "Examples" but not over "API Playground"

The menu entries Examples & Tools don't have actual pages or links to go to, which is why it doesn't have the pointer cursor. The API playground leads to the documentation page (hence the clickable pointer)
We probably could link the examples to the ors examples repo and create a page for all the tools similar to the showcase on the landing page.

• The header buttons are not vertically centralized enough, compared to the logo

probably fixable with custom css (if you already have a fix for this, feel free to just paste the relevant css for elements in a comment and i will add it)

• This very very thin white line under the header does not match the width and white-ness of the buttons in the website
  the navbar separator appears thinner due to trasparency, the color and size should be the same as the buttons 1px.
  
  I tried out the no transparent verion and think it's a bit too hard of a cut in the background image.
  But i think this more or less comes down to personal taste, so we'll probably leave it like this...