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

In meta trac the header nav menu link color is not white. #218

Closed
Smit2808 opened this issue Jul 14, 2022 · 6 comments
Closed

In meta trac the header nav menu link color is not white. #218

Smit2808 opened this issue Jul 14, 2022 · 6 comments

Comments

@Smit2808
Copy link
Contributor

Smit2808 commented Jul 14, 2022

In meta trac, the main header nav menu links color is not white like other pages.

Steps to reproduce:

  1. Open the https://meta.trac.wordpress.org/
  2. Now you can clearly see the header nav menu has no white color links.

On other pages like: https://make.wordpress.org/meta/. Here you can see the links are clearly visible because it is in white color.

Video link of issue: https://www.loom.com/share/26a313346f3f490f92dd0d8d5d48bbe5

@Smit2808
Copy link
Contributor Author

Hi team, I have checked the cause of this issue. In https://meta.trac.wordpress.org/ site when I inspected the anchor element of navbar link I can see the CSS as shown in below code.

.wp-block-group.global-header .global-header__navigation .wp-block-navigation__container .global-header__overflow-menu>button, .wp-block-group.global-header .global-header__navigation .wp-block-navigation__container .wp-block-navigation-item a {
    padding: calc(var(--wp--style--block-gap)/2) var(--wp--style--block-gap);
}

Here there is no color: inherit; CSS. That's why this issue is happening. The CSS of anchor element should be like below code.

.wp-block-group.global-header .global-header__navigation .wp-block-navigation__container .global-header__overflow-menu>button, .wp-block-group.global-header .global-header__navigation .wp-block-navigation__container .wp-block-navigation-item a {
    color: inherit;
    padding: calc(var(--wp--style--block-gap)/2) var(--wp--style--block-gap);
}

Now I inspected the menu.pcss file (path: mu-plugins/blocks/global-header-footer/postcss/header/menu.pcss). Here also I can see the color inherit code and in build file also it is present so I think we need to push the build file again to solve this issue. Because in site color inherit css is not present and in build file and menu.pcss has color inherit css. So by pushing the build file code again this issue will be resolved.

@iandunn
Copy link
Member

iandunn commented Jul 15, 2022

That sounds related to #213 / #216. It might be that we need to update the header files:

That should only be if the markup changes, but that does include cachebusters. cc @adamwoodnz

@adamwoodnz
Copy link
Contributor

Sorry @iandunn are you saying we need to bump the version here to bust the cache?

https://github.com/WordPress/wordpress.org/blame/trunk/trac.wordpress.org/templates/wporg-head.html#L51

Is the version just a datetime string?

@iandunn
Copy link
Member

iandunn commented Jul 18, 2022

I think running the update-headers.php script above, and committing/deploying the results will might fix it.

The Trac templates are static/hardcoded since they can't integrate directly with WP. That script will regenerate the templates using the latest data, so that they're synced with the rest of w.org. The updated Trac templates should then have the same cachebusters that are used everywhere else.

@adamwoodnz
Copy link
Contributor

adamwoodnz commented Jul 22, 2022

This has been deployed https://meta.trac.wordpress.org/changeset/11990

Let me know if this is fixed for you @Smit2808 and please close if so.

@Smit2808
Copy link
Contributor Author

hi @adamwoodnz and @iandunn,

Thank you. Now it's resolved, So closing this ticket.

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

No branches or pull requests

3 participants