jarno
/
firefox-gnome-theme
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Tabsbar: Fix close button auto hide

This commit is contained in:
Rafael Mardojai CM 2021-06-17 13:47:23 -05:00
parent bb942a92d0
commit 25ec8678d8
1 changed files with 41 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
theme/parts/tabsbar.css
View File

@ -167,20 +167,15 @@ tab[selected]:-moz-window-inactive {
margin-right: 2px;
}
/* If tab close button is not present, don't force favicon to the center */
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-icon-stack {
margin-left: 0 !important;
}
/* Tab buttons */
.tab-icon-overlay,
.tab-close-button {
-moz-appearance: none !important;
border: 0px solid transparent;
box-sizing: content-box; /* Avoid deformation on flexbox */
border-radius: 99px !important;
padding: 4px !important;
background-size: 24px;
transition: all 0.2s ease-out !important;
}
:root:not(:-moz-window-inactive) .tab-icon-overlay:hover,
:root:not(:-moz-window-inactive) .tab-close-button:hover {
@ -203,6 +198,7 @@ tab[selected]:-moz-window-inactive {
height: 16px !important;
opacity: 1 !important;
width: 16px !important;
z-index: 100 !important;
}
:root:-moz-window-inactive .tab-close-button:not(#hack) {
opacity: .18 !important;
@ -220,13 +216,48 @@ tab[selected]:-moz-window-inactive {
box-shadow: none !important;
}
/* Autohide (Still Horrible) */
/* Autohide */
.tabbrowser-tab:not([selected="true"]) .tab-close-button {
visibility: hidden;
visibility: hidden !important;
opacity: 0 !important;
}
.tabbrowser-tab:hover .tab-close-button {
visibility: visible;
visibility: visible !important;
opacity: 1 !important;
}
/* Fix close button position */
.tabbrowser-tab:not([pinned]) .tab-label-container {
margin-right: -16px;
max-width: 80% !important;
}
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned]) .tab-close-button {
display: block !important;
}
/* Close button overlay */
.tabbrowser-tab:not([pinned]) .tab-content::after {
bottom: 1px;
content: "";
height: 100%;
opacity: 0;
position: absolute;
right: 0;
width: 55px;
z-index: 99;
transition: all 0.2s ease-out;
}
.tabbrowser-tab:not([pinned]):is([selected="true"], :hover) .tab-content::after {
opacity: 1;
}
.tabbrowser-tab:not([pinned])[selected="true"] .tab-content::after {
background: linear-gradient(to left, var(--gnome-tabbar-tab-active-background) 50%, transparent);
}
:root:not(:-moz-window-inactive) .tabbrowser-tab:not([pinned])[selected="true"]:hover .tab-content::after {
background: linear-gradient(to left, var(--gnome-tabbar-tab-active-hover-background) 50%, transparent);
}
.tabbrowser-tab:not([pinned]):hover .tab-content::after {
background: linear-gradient(to left, var(--gnome-tabbar-tab-hover-background) 50%, transparent);
}
/* Tab close button etc. positioning */