create loading_indicator_bouncing_line.css
This commit is contained in:
parent
caa0fe4371
commit
84f25d82da
3 changed files with 27 additions and 1 deletions
24
chrome/loading_indicator_bouncing_line.css
Normal file
24
chrome/loading_indicator_bouncing_line.css
Normal 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) }
|
|
@ -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"]
|
||||||
}
|
}
|
||||||
|
|
1
tags.csv
1
tags.csv
|
@ -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
|
||||||
|
|
|
Loading…
Reference in a new issue