mirror of
https://github.com/Starlio-app/StarlioX
synced 2025-02-24 23:31:26 +03:00
Added blur and shimmer effect for image loading
This commit is contained in:
parent
79555722ef
commit
36c1a116dc
2 changed files with 48 additions and 8 deletions
|
@ -29,13 +29,33 @@ lottie-player {
|
|||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.modal-body,
|
||||
.modal-footer,
|
||||
.modal-header {
|
||||
.modal-content {
|
||||
background-color: #212529;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.shimmer {
|
||||
display: inline-block;
|
||||
color: grey;
|
||||
-webkit-mask: linear-gradient(-60deg, #000 30%, #0005, #000 70%) right/370% 100%;
|
||||
background-repeat: no-repeat;
|
||||
animation: shimmer 2.5s infinite;
|
||||
filter: blur(50px)
|
||||
}
|
||||
|
||||
@keyframes shimmer {
|
||||
100% {-webkit-mask-position: left}
|
||||
}
|
||||
|
||||
#show-more {
|
||||
background-color: #212529;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 16px;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.modal-body p {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
margin-top: 16px;
|
||||
|
|
Loading…
Add table
Reference in a new issue