https://github.com/concordnow/ember-content-loader

Easy, customizable content placeholders / skeletons screens
https://github.com/concordnow/ember-content-loader

ember ember-addon ember-cli ember-content-loader hacktoberfest loader skeleton-screens

Last synced: 8 months ago
JSON representation

Easy, customizable content placeholders / skeletons screens

• Host: GitHub
• URL: https://github.com/concordnow/ember-content-loader
• Owner: concordnow
• License: mit
• Created: 2019-07-27T13:59:10.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2023-09-11T02:37:49.000Z (over 2 years ago)
• Last Synced: 2025-06-19T18:55:45.282Z (9 months ago)
• Topics: ember, ember-addon, ember-cli, ember-content-loader, hacktoberfest, loader, skeleton-screens
• Language: JavaScript
• Homepage: https://concordnow.github.io/ember-content-loader/
• Size: 15.4 MB
• Stars: 43
• Watchers: 5
• Forks: 4
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE.md
  • Codeowners: CODEOWNERS

Awesome Lists containing this project

README

          
ember-content-loader

==============================================================================

[![Build Status](https://github.com/concordnow/ember-content-loader/actions/workflows/main.yml/badge.svg?branch=master)](https://github.com/concordnow/ember-content-loader/actions/workflows/main.yml)

[![Ember Observer Score](https://emberobserver.com/badges/ember-content-loader.svg)](https://emberobserver.com/addons/ember-content-loader)

[![This project is using Percy.io for visual regression testing.](https://percy.io/static/images/percy-badge.svg)](https://percy.io/concordnow/ember-content-loader)

SVG-Powered component to easily create skeleton screens / placeholder loadings (like Facebook's cards loading). Documentation can be found [here](https://concordnow.github.io/ember-content-loader/)

Compatibility

------------------------------------------------------------------------------

* Ember.js v3.20 or above

* Ember CLI v3.20 or above

* Node.js v12 or above

* ember-auto-import >= 2

Installation

------------------------------------------------------------------------------

```

ember install ember-content-loader

```

Usage

------------------------------------------------------------------------------

![Facebook skeleton](https://user-images.githubusercontent.com/4838076/34308760-ec55df82-e735-11e7-843b-2e311fa7b7d0.gif)

Simply add the `` component in your code with the shapes that you want.

```hbs

  {{!-- Only SVG shapes --}}

  

  

  

  

  

  

```

You can use the [online editor](http://danilowoz.com/create-content-loader/) to create complex shapes.

> **Note:** This editor is made for React, so you need to translate the produced code.

Options

------------------------------------------------------------------------------

You can find all `` available options [here](https://concordnow.github.io/ember-content-loader/#/docs/components/content-loader)

Thanks

------------------------------------------------------------------------------

* [react-content-loader](https://github.com/danilowoz/react-content-loader)

Contributing

------------------------------------------------------------------------------

See the [Contributing](CONTRIBUTING.md) guide for details.

License

------------------------------------------------------------------------------

This project is licensed under the [MIT License](LICENSE.md).