search

akshat46 / FlyingFox

An opinionated set of configurations for firefox.
MIT License
1.59k stars 80 forks source link

Dashed indent guides incosistent with tab level #93

Open pesader opened 3 years ago

pesader commented 3 years ago

Describe the bug The dashed indent guides are the same for differently indented tabs, i.e. tabs on different "levels".

To Reproduce Steps to reproduce the behavior:

  1. Select one of Flying Fox's custom css configurations for Tree Style Tabs. I checked this behavior happens on both custom.css and custom-hover.css.
  2. Open a link in a new tab, so that you have one level of indentation.
  3. On that new tab, open another link in another new tab. You should now have two levels of indentation.
  4. Notice how both show a dashed line at the same level, which is a bit confusing.

Screenshots image

Firefox Version 91.0

Additional Information I tried tweaking the css a little bit, but I'm not much of an expert 😅. I have a hunch that using the data-level variable to set the margin-left field of tab-item might solve this.

In any case, here's the best pseudo-css I could come up with:

tab-item:not([data-level="0"]):not(.pinned) {
    ...
    margin-left: calc(data-level * 7px);
    ...
}

And, of course, thanks for developing FlyingFox! It made my productivity skyrocket on my many online classes 🚀