make curved_tabs.css proton compatible

This commit is contained in:
MrOtherGuy 2021-04-09 00:33:37 +03:00
parent 1fd6af0071
commit 802c4a4c53

View file

@ -4,8 +4,12 @@ See the above repository for updates as well as full license text. */
/* Makes tabs more curvy. Also disables tab separators since there's no easy way to make the look good */
#tabbrowser-tabs{
--uc-tab-curve-size: 17px; /* 10px looks about like chromium - 17px looks close to Australis tabs */
--uc-tab-curve-size:17px; /* 10px looks about like chromium - 17px looks close to Australis tabs */
--uc-tabs-scrollbutton-border: 0px;
--proton-tab-block-margin:0px;
--tab-min-height: 34px;
}
#TabsToolbar{ --toolbarbutton-inner-padding: 6px !important; }
.tabbrowser-tab:hover{ --uc-tab-fill: rgba(0,0,0,.1) }
.tabbrowser-tab[selected]{ --uc-tab-curve-padding: 1px }
@ -48,7 +52,7 @@ See the above repository for updates as well as full license text. */
.tabbrowser-tab:hover > stack > .tab-background,
.tab-background[selected]{
border-radius: var(--uc-tab-curve-size) var(--uc-tab-curve-size) 0 0;
border-radius: var(--uc-tab-curve-size) var(--uc-tab-curve-size) 0 0 !important;
overflow: -moz-hidden-unscrollable
}
@ -57,8 +61,13 @@ See the above repository for updates as well as full license text. */
margin-inline-start: var(--uc-tab-curve-size) !important;
}
#scrollbutton-up,
#scrollbutton-down{ border-block-width: var(--uc-tabs-scrollbutton-border,0px) !important; }
.tab-background[selected]{ border: 1px solid var(--tabs-border-color) !important; border-bottom: none !important }
/* Annoying fix to prevent hovering of last tab to trigger tab overflow, better solution wanted */
.tabbrowser-tab[last-visible-tab]{ margin-inline-end: var(--uc-tab-curve-size) !important; }
/* OPTIONAL - uncomment the following to flip the curves vertically - maybe useful for tabs on bottom ? */
/*
.tab-background{ -moz-box-direction: reverse }
@ -66,5 +75,4 @@ See the above repository for updates as well as full license text. */
.tab-background[selected]{ border-radius: 0 0 var(--uc-tab-curve-size) var(--uc-tab-curve-size) }
.tabbrowser-tab > stack::before{ transform: scaleY(-1) !important; }
.tabbrowser-tab > stack::after{ transform: scaleY(-1) scaleX(-1) !important; }
*/
*/