0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-09 18:02:39 +00:00

searching animation

This commit is contained in:
Víctor Losada Hernández
2024-02-15 15:53:26 +01:00
parent 62db393969
commit 9c53541cbd
2 changed files with 13 additions and 5 deletions

View File

@@ -247,7 +247,7 @@ const ArchivePage = createClass({
if(searching) { if(searching) {
return ( return (
<div className='foundBrews searching'> <div className='foundBrews searching'>
<span><h3>Searching</h3><h3 className='searchAnim'>...</h3></span> <h3 className='searchAnim'>Searching</h3>
</div> </div>
); );
}; };

View File

@@ -122,7 +122,15 @@ body {
place-items: center; place-items: center;
color: white; color: white;
h3.searchAnim { h3 { position: relative;}
h3.searchAnim::after {
content: "";
width: max-content;
height: 1em;
position: absolute;
right: 0;
top: 50%;
translate: 100% -50%;
animation: trailingDots 2s ease infinite; animation: trailingDots 2s ease infinite;
} }
} }
@@ -229,13 +237,13 @@ body {
@keyframes trailingDots { @keyframes trailingDots {
0%,32% { 0%,32% {
clip-path:inset(0 66% 0 0); content:'.';
} }
33%, 65% { 33%, 65% {
clip-path:inset(0 33% 0 0); content:'..';
} }
66%,100% { 66%,100% {
clip-path:inset(0 0% 0 0); content:'...';
} }
} }