simplify tab-close-button styling

This commit is contained in:
MrOtherGuy 2021-05-09 07:47:17 +03:00
parent 6556b1d525
commit a9870bd053
2 changed files with 9 additions and 9 deletions

View file

@ -8,9 +8,9 @@ See the above repository for updates as well as full license text. */
display: -moz-box !important; display: -moz-box !important;
position: relative; position: relative;
margin-inline: -1px -19px !important; margin-inline: -1px -19px !important;
padding: 0px !important;
z-index: -1; z-index: -1;
visibility: hidden; visibility: hidden;
width: unset !important;
} }
.tabbrowser-tab[pinned] .tab-close-button{ display: none !important; } .tabbrowser-tab[pinned] .tab-close-button{ display: none !important; }
.tabbrowser-tab:hover .tab-close-button{ .tabbrowser-tab:hover .tab-close-button{
@ -20,9 +20,8 @@ See the above repository for updates as well as full license text. */
@media (-moz-proton){ @media (-moz-proton){
.tab-close-button{ .tab-close-button{
margin-inline: -4px calc(-16px - var(--inline-tab-padding) / 2) !important; margin-inline: -4px -20px !important;
padding: 7px !important; padding-inline-start: 7px !important;
width: calc(16px + var(--inline-tab-padding)) !important;
} }
} }
@ -49,4 +48,4 @@ See the above repository for updates as well as full license text. */
.tab-icon-stack:hover ~ .tab-close-button, .tab-icon-stack:hover ~ .tab-close-button,
.tab-close-button:hover, .tab-close-button:hover,
.tabbrowser-tab:not([image]):hover .tab-close-button{ visibility: visible; z-index: 1; } .tabbrowser-tab:not([image]):hover .tab-close-button{ visibility: visible; z-index: 1; }
.tabbrowser-tab:not([image]):hover .tab-close-button{ margin-inline-end: 0 !important; } .tabbrowser-tab:not([image]):hover .tab-close-button{ margin-inline-end: 0 !important; }

View file

@ -18,16 +18,17 @@ menupopup > menu{ padding-block: 0.3em !important; }
#urlbar-container{ padding-block: 2px !important; } #urlbar-container{ padding-block: 2px !important; }
#urlbar-background{ margin-block: 1px } #urlbar-background{ margin-block: 1px }
/* This is kinda weird, but it makes the horizontal line between tabs and nav-bar render "inside" nav-bar thus tabs are more visibily separated even if there is less space there */ /* This is kinda weird, but it makes the horizontal line between tabs and nav-bar render "inside" nav-bar thus tabs are more visibily separated even if there is less space there */
#nav-bar{ #nav-bar{
box-shadow: inset 0 var(--tabs-shadow-size) 0 var(--tabs-border-color) !important; box-shadow: inset 0 var(--tabs-shadow-size) 0 var(--tabs-border-color) !important;
} }
.tab-close-button{ .tab-close-button{
margin-inline-start: 2px !important; margin-inline-start: 0px !important;
width: 16px !important; width: 20px !important;
height: 16px !important; height: 20px !important;
padding: 1px !important; padding: 5px !important;
} }
#tabbrowser-tabs{ --uc-tabs-scrollbutton-border: 2px } #tabbrowser-tabs{ --uc-tabs-scrollbutton-border: 2px }