Skip to content

Instantly share code, notes, and snippets.

@phpmaps
Created June 16, 2023 13:48
Show Gist options
  • Save phpmaps/6eaa486ab23c5feb666e865e59fae12b to your computer and use it in GitHub Desktop.
Save phpmaps/6eaa486ab23c5feb666e865e59fae12b to your computer and use it in GitHub Desktop.
spinner
.spinner-container {
display: flex;
width: 100%;
justify-content: center;
align-items: center;
}
@keyframes spinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.loading-spinner {
width: 200px;
height: 200px;
border: 10px solid #f3f3f3;
border-top: 10px solid #005ea2;
border-radius: 50%;
animation: spinner 1.5s linear infinite;
}
@phpmaps
Copy link
Author

phpmaps commented Jun 16, 2023

The HTML ...

<div className="spinner-container">
    <div className="loading-spinner"></div>
</div>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment