open-consul/ui/packages/consul-ui/app/components/consul/loader/README.mdx

# Consul::Loader

Simple template-only component to show the circular animated Consul loader animation.

```hbs preview-template
<div style="position: relative;height: 300px;width: 300px;margin: 0 auto;">
  <Consul::Loader />
</div>
```


### See

- [Component Source Code](./index.js)
- [Template Source Code](./index.hbs)

---
ui: Improves UI engineering docs (#9875) Also fixes some typos in with-overlay 2021-03-17 15:58:17 +00:00			`# Consul::Loader`
ui: ConsulLoader component (#7719) Moves the `consul-loader` partial to a template-only component 2020-04-29 08:10:50 +00:00
ui: Loader amends/improvements (#10181) * ui: Loader amends/improvements 1. Create a JS compatible template only 'glimmer' component so we can use it with or without glimmer. 2. Add a set of `rose` colors. 3. Animate the brand loader to keep it centered when the side navigation appears. 4. Tweak the color of Consul::Loader to use a 'rose' color. 5. Move everything loader related to the `app/components/` folder and add docs. 2021-05-07 11:23:29 +00:00			`Simple template-only component to show the circular animated Consul loader animation.`

ui: Improves UI engineering docs (#9875) Also fixes some typos in with-overlay 2021-03-17 15:58:17 +00:00			```hbs preview-template
			`<div style="position: relative;height: 300px;width: 300px;margin: 0 auto;">`
			`<Consul::Loader />`
			`</div>`
			```
ui: ConsulLoader component (#7719) Moves the `consul-loader` partial to a template-only component 2020-04-29 08:10:50 +00:00

			`### See`

			`- [Component Source Code](./index.js)`
			`- [Template Source Code](./index.hbs)`

			`---`