Changing hover background color of the file path on tabs

Hi folks, just wondering if anyone has come across a way to change the background color of the file path, shown when you hover on tabs? I have tried editing other themes and/or making my own css style for it but i can’t seem to get it.

Any help or info on this would be great thanks!

1 Like

I have gotten as far as tab background color- e.g. .tab:hover {background-color: #FFF;}

anyone able to help please?

Try this:
(Replacing pink with whatever colour you are after…)

.tooltip {
  .tooltip-inner {
    background-color: pink;
  }
}
.tooltip.bottom {
  .tooltip-arrow {
    border-bottom-color: pink;
   }
}

that doesn’t appear to be doing the trick, thanks for giving it a try though! Ill keep looking into it.

Weird… it works for me on version 1.10.2
You put that in your styles.less yea?

1 Like

ah I had some updates that were needed, though not totally sure why that wouldn’t have worked anyway.

Thanks so much for your help! cut my time spent on it in half :slight_smile:

Thank you all - It was hard to find what to style because you can’t right click / inspect the popup tool tip (the html doesn’t have a div coming in…)

Just a note - there was a popup-tooltip arrow not updated in the settings page - here is the complete code:

.tooltip .tooltip-inner{
  background-color: #f98c4c;
}.tooltip.top .tooltip-arrow {
  border-top-color: #f98c4c;
}.tooltip.top-left .tooltip-arrow {
  border-top-color: #f98c4c;
}.tooltip.top-right .tooltip-arrow {
  border-top-color: #f98c4c;
}.tooltip.right .tooltip-arrow {
  border-right-color: #f98c4c;
}.tooltip.left .tooltip-arrow {
  border-left-color: #f98c4c;
}.tooltip.bottom .tooltip-arrow {
  border-bottom-color: #f98c4c;
}.tooltip.bottom-left .tooltip-arrow {
  border-bottom-color: #f98c4c;
}.tooltip.bottom-right .tooltip-arrow {
  border-bottom-color: #f98c4c;
}

That‘s what breakpoints are for: