center tab icon

This commit is contained in:
Gerome Matilla 2020-05-23 09:31:53 +08:00
parent f9ebc43e59
commit 734e2758ab

View File

@ -315,14 +315,34 @@ The tabs container
color: var(--bf-tab-color); color: var(--bf-tab-color);
} }
.tab-label-container:not([textoverflow]) { /* Center all content */
/* Center tab text */ .tab-content {
width: 50% !important;
max-width: 50% !important;
min-width: 50% !important;
display: flex; display: flex;
overflow: hidden;
justify-content: center; justify-content: center;
align-items: center;
margin-top: -1px;
min-width: 100% !important;
padding: 0 10px !important;
}
/* Prevent tab icons size breaking */
.tab-icon-image, .tab-icon-sound,
.tab-throbber, .tab-throbber-fallback,
.tab-close-button {
min-width: 16px;
}
/* Adjust tab label width */
.tab-label-container {
min-width: 03 !important;
}
/* If tab close button is not present, don't force favicon to the center */
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber,
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber-fallback,
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([busy]) .tab-icon-image,
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([image]) .tab-label-container {
margin-left: 0 !important;
} }
.tab-close-button { .tab-close-button {
@ -378,6 +398,12 @@ tab.tabbrowser-tab {
overflow: hidden; overflow: hidden;
} }
/* Remove hover effects on tab bar buttons */
#TabsToolbar {
--toolbarbutton-active-background: transparent !important;
--toolbarbutton-hover-background: transparent !important;
}
tab.tabbrowser-tab:hover { tab.tabbrowser-tab:hover {
background: var(--bf-hover-bg) !important; background: var(--bf-hover-bg) !important;
box-shadow: 0 1px 4px rgba(0,0,0,.05); box-shadow: 0 1px 4px rgba(0,0,0,.05);