Height issue of pinned tabs

[c02y]

This is my snippet in Advanced section of TST settings

.tab {
  height: 20px;
}

.tab.pinned {
  height: 20px;
}

But pinned tabs and unpinned tabs are different

And

.tab {
  height: 20px;
}

.tab.pinned {
  height: 10px;
}

So how to set height of the pinned tabs?

[irvinm]

This might help: #2725

[piroor]

I've tried:

tab-item {
  height: 16px;
  --tab-size: 16px;
}

and I got:

Please note that you need to close-and-reopen the sidebar to apply new height of tabs, because TST calculates various sizes when the sidebar panel is loaded and the calculation result are not updated dynamically.

[c02y]

.tab {
  height: 20px;
}

.tab.pinned {
  height: 20px;
}

Actually works as expected I only have to reopen the sidebar as you said (note that .tab and .tab.pinned blocks are both needed, only .tab.pinned doesn't work for pinned tab)

And

tab-item {
  height: 16px;
  --tab-size: 16px;
}

works for both pinned tabs and unpinned tabs.

Thanks.

FYI: Sorry, Github won't let me accept the right comment in the middle as the solution, so I made the first reply the answer.

[irvinm]

@c02y you shouldn't need your first block of CSS at all. The "tab-item" CSS covers both normal tabs and pinned tabs.

@piroor thank you for the missing piece. I should have been able to find the "--tab-size: 16px;" solution. 🙌

[c02y]

@c02y you shouldn't need your first block of CSS at all. The "tab-item" CSS covers both normal tabs and pinned tabs.

@piroor thank you for the missing piece. I should have been able to find the "--tab-size: 16px;" solution. raised_hands

Yes, if I use tab-item {}, I don't need .tab {}, but since tab-item {} works for both pinned tabs and unpinned tabs, if I need to set different values for pinned and unpinned tabs, then use .tab {} and .tab.pinned {} together.

[irvinm]

@c02y ... gotcha! Glad you got it to work.