How to adjust color on hamburger profile links?

Noticing some very strange behavior on colors for menu items.

Changing these classes, does half the work.

Changing color on this CSS class, only changes the first 5 links.

Changing color for notification text, also changes some colors on user profile links.


image

Screenshots are all from meta.

Hello, I think it’s because the Do not disturb and Log Out are buttons, not links. That is why only the buttons color change because it won’t override the links color. I think If you want to change all menu item color you have to target both links and buttons.


I think here you target the wrong class there is a more specific one for tabs. For example here you can target the tab id. #quick-access-notifications.

Something like this…

#quick-access-notifications {
  &.quick-access-panel li a {
    color: red;
  }
}
3 Likes

This makes sense to me indeed.

You are awesome again. This is the working code:

#quick-access-notifications,
.quick-access-panel li a {
    color: red;
  }

How do I find classes like this? I don’t see them that quick when inspecting elements.

2 Likes

You mean #quick-access-notifications?

Every tab has a specific id.

#quick-access-notifications
#quick-access-bookmarks
#quick-access-messages
#quick-access-profile

Here you can find these ids in inspect element.

#quick-access-notifications

#quick-access-bookmarks

3 Likes

Cool, I didn’t know this! Learning every day.

3 Likes