@FoxieFox
It's 1440p.
I tried removing all CSS mods except yours and restarted but it still glitched.
I checked animations as well, it is enabled.
the blue hover area hasn't glitched:
ezgif-37d44518cf9f04.gif
here's all my other mods. I tried disabling them and the problem still occurs.
Note that if i disable the [left oriented tab auto hiding and show on hover] CSS mod (the first block of code below), i.e. the tabs are always there, the glitch doesn't happen on the left upper area like my initial gif, it only happens on the right side where the title bar and tabs bar don't intersect.
but if i put my tabs on bottom for example, all the empty parts in the title bar still glitch.
:root{
--tabbar-size: 0px;
}
/* tabbar transparent */
.inner > .tabbar-wrapper:not(:hover) .tabbar-wrapper div {
opacity: 0;
}
/* tabbar workspace */
.inner > .tabbar-wrapper:not(:hover) .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu{
width: calc(var(--tabbar-size) + var(--densityGap))!important;
transition: unset;
}
.inner > .tabbar-wrapper:not(:hover) .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu .button-title,
.inner > .tabbar-wrapper:not(:hover) .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu .button-toolbar-menu-indicator{
display: none;
}
.inner .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu .button-icon{
position: absolute;
left: var(--densityGap);
}
.inner .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu .button-title{
position: absolute;
left: calc(32px + var(--densityGap)) !important;
}
.inner .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu .button-toolbar-menu-indicator{
position: absolute;
right: var(--densityGap);
}
/* tabbar container */
.inner > .tabbar-wrapper:not(:hover) #tabs-tabbar-container,
.inner > .tabbar-wrapper:not(:hover) #tabs-tabbar-container .resize{
width: calc(var(--tabbar-size) + var(--densityGap)) !important;
transition: unset;
}
.inner > .tabbar-wrapper{
position: relative;
width: calc(var(--tabbar-size) + var(--densityGap));
}
.inner > .tabbar-wrapper > .tabbar-wrapper{
position: absolute;
overflow: hidden;
z-index: 1;
}
.inner > .tabbar-wrapper > .tabbar-wrapper:hover{
position: absolute;
background:var(--colorImageLeftBg, var(--colorBgLight)) ;
}
.inner #tabs-tabbar-container,
.inner .button-toolbar.workspace-popup.tabbar-workspace-button.button-menu {
transition: width 0.1s;
}
/* hide tabbar scrollbar */
#browser #tabs-container.right ::-webkit-scrollbar,
#browser #tabs-container.left ::-webkit-scrollbar{
display: none;
}
/* tab close button position */
.overflow.tab-strip .tab .tab-header{
max-width: calc(var(--Width) + 12px)
}
.tab-position .tab.audio-on {background-repeat:no-repeat; width: 50%; background-size:50%; background-image: linear-gradient(to right, rgba(255,0,0,1), rgba(255,0,0,0)); !important;}
span.tab-audio { color: red; transform: scale(1.75); }
display: flex !important