<div class="inv-content-placeholder"></div>
<div class="inv-content-placeholder"></div>
/* No context defined for this component. */
  • Content:
    .inv-content-placeholder {
      background: var(--color-default--white);
      background: linear-gradient(to right, var(--color-default--white) 10%, var(--color-system--light) 20%, var(--color-default--white) 35%);
      background-size: 800px;
      position: relative;
      min-height: 10px;
      animation-duration: 2.5s;
      animation-fill-mode: forwards;
      animation-iteration-count: infinite;
      animation-timing-function: linear;
      animation-name: contentPlaceholderShimmer;
    }
    
    @keyframes contentPlaceholderShimmer {
      0% { background-position: 120% 0; }
      100% { background-position: -120% 0; }
    }
    
  • URL: /components/raw/content-placeholder/content-placeholder.css
  • Filesystem Path: src/components/content-placeholder/content-placeholder.css
  • Size: 582 Bytes
  • Handle: @content-placeholder
  • Preview:
  • Filesystem Path: src/components/content-placeholder/content-placeholder.hbs

Content Placeholder

Utilizado quando componentes estão fazendo carregamento

Tendo a classe base .inv-content-placeholder, podendo ser adicionado através de uma div

Default Label

Label padrão, comum para ações regulares dos usuários.

<div class="inv-content-placeholder"></div>