pmOS-tweaks/fenix-fox
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

make loading line work better with proton theming

Browse source
This commit is contained in:
MrOtherGuy 2021-06-27 10:18:02 +03:00
parent 32c9b4dd54
commit 803c27a783
1 changed files with 8 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
chrome/tab_line_loading_indicator.css
View file

@ -3,25 +3,24 @@ See the above repository for updates as well as full license text. */
/* Hide the normal loading indicator (just show tab-icon instead) and make the top tab-line bounce left-to-right */ /* Hide the normal loading indicator (just show tab-icon instead) and make the top tab-line bounce left-to-right */
@keyframes tabline-anim{from{background-position-x: left}to{background-position-x: right}} @keyframes tab-loading-line-anim{from{background-position-x: left}to{background-position-x: right}}
.tabbrowser-tab[busy] > stack > .tab-background::before, .tabbrowser-tab[busy] > .tab-stack > .tab-background::before,
.tab-background[selected]::before{ .tab-background[selected]::before{
content: ""; content: "";
display: -moz-box; display: -moz-box;
height: 2px; height: 2px;
opacity: 0; background-color:transparent;
background-image: linear-gradient(rgba(255,255,255,.2),rgba(255,255,255,.2));
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100%; background-size: 100%;
transition: background-size 80ms linear; transition: background-size 80ms linear;
} }
.tabbrowser-tab[busy] > stack > .tab-background::before{ .tabbrowser-tab[busy] > .tab-stack > .tab-background::before{
background-size: 10%; background-size: 10%;
background-image: linear-gradient(var(--tab-line-color),var(--tab-line-color)); background-image: linear-gradient(currentColor,currentColor);
opacity: 0.7; opacity: 0.7;
animation: tabline-anim 400ms alternate infinite ease-in-out; animation: tab-loading-line-anim 400ms alternate infinite ease-in-out;
} }
.tabbrowser-tab .tab-throbber{ display: none } .tab-throbber{ display: none }
.tabbrowser-tab .tab-icon-image{ display: -moz-box !important; } .tab-icon-image[src]{ display: -moz-box }