create loading_indicator_bouncing_line.css

This commit is contained in:
MrOtherGuy 2021-06-25 10:43:42 +03:00
parent caa0fe4371
commit 84f25d82da
3 changed files with 27 additions and 1 deletions

View file

@ -0,0 +1,24 @@
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/loading_indicator_bouncing_line.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
@keyframes statusline-anim{from{background-position-x: left}to{background-position-x: right}}
#statuspanel[type="status"]::after{
position: fixed;
display: block;
height: 2px;
width: 100vw;
top: 0;
left:0;
content: "";
pointer-events: none;
background-size: 20%;
background-repeat: no-repeat;
background-image: linear-gradient(to left,transparent,rgb(170,0,70),transparent);
animation: statusline-anim 400ms alternate infinite ease-in-out;
}
@media (min-width: 1000px){ #statuspanel[type="status"]::after{ animation-duration: 460ms } }
@media (min-width: 1400px){ #statuspanel[type="status"]::after{ animation-duration: 520ms } }
@media (min-width: 1700px){ #statuspanel[type="status"]::after{ background-size: 15%; animation-duration: 550ms } }
@media (min-width: 2200px){ #statuspanel[type="status"]::after{ animation-duration: 600ms } }
.browserContainer{ transform: translate(0) }

View file

@ -133,5 +133,6 @@
"vertical_menubar.css":["menubar","hack"], "vertical_menubar.css":["menubar","hack"],
"vertical_popup_menubar.css":["menubar","menu","toolbars","popup"], "vertical_popup_menubar.css":["menubar","menu","toolbars","popup"],
"window_control_fallback_for_custom_windows_theme.css":["window-control","buttons","colors","patch"], "window_control_fallback_for_custom_windows_theme.css":["window-control","buttons","colors","patch"],
"window_control_placeholder_support.css":["window-control","patch"] "window_control_placeholder_support.css":["window-control","patch"],
"loading_indicator_bouncing_line.css":["status","navigation","effect"]
} }

View file

@ -133,3 +133,4 @@ vertical_menubar.css,menubar,hack
vertical_popup_menubar.css,menubar,menu,toolbars,popup vertical_popup_menubar.css,menubar,menu,toolbars,popup
window_control_fallback_for_custom_windows_theme.css,window-control,buttons,colors,patch window_control_fallback_for_custom_windows_theme.css,window-control,buttons,colors,patch
window_control_placeholder_support.css,window-control,patch window_control_placeholder_support.css,window-control,patch
loading_indicator_bouncing_line.css,status,navigation,effect

1 auto_devtools_theme_for_rdm.css,devtools,colors
133 vertical_popup_menubar.css,menubar,menu,toolbars,popup
134 window_control_fallback_for_custom_windows_theme.css,window-control,buttons,colors,patch
135 window_control_placeholder_support.css,window-control,patch
136 loading_indicator_bouncing_line.css,status,navigation,effect