framework7/components/skeleton.css

Full featured mobile HTML framework for building iOS & Android apps

:root{--f7-skeleton-color:#ccc}.theme-dark{--f7-skeleton-color:#515151}.skeleton-text{font-family:framework7-skeleton!important}.skeleton-text,.skeleton-text *{color:var(--f7-skeleton-color)!important;font-weight:400!important;font-style:normal!important;letter-spacing:-.015em!important}.skeleton-block{height:1em;background:var(--f7-skeleton-color)!important;width:100%}.skeleton-effect-fade{animation:skeleton-effect-fade 1s infinite}.skeleton-effect-blink{-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 25%,#000 75%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,#000 25%,#000 75%,transparent 100%);-webkit-mask-size:200% 100%;mask-size:200% 100%;-webkit-mask-repeat:repeat;mask-repeat:repeat;-webkit-mask-position:50% top;mask-position:50% top;animation:skeleton-effect-blink 1s infinite}.skeleton-effect-pulse{animation:skeleton-effect-pulse 1s infinite}@keyframes skeleton-effect-fade{0%{opacity:1}50%{opacity:.2}100%{opacity:1}}@keyframes skeleton-effect-blink{0%{-webkit-mask-position:50% top;mask-position:50% top}100%{-webkit-mask-position:-150% top;mask-position:-150% top}}@keyframes skeleton-effect-pulse{0%{transform:scale(1)}40%{transform:scale(1)}50%{transform:scale(.975)}100%{transform:scale(1)}}