Directory

← Back

progress-spinner

a material design inspired spinner that also supports progress indication

Author

Rating

Popularity

<100

[ This description is mirrored from README.md at github.com/Juravenator/progress-spinner on 2019-05-10 ]

progress-spinner

a material design inspired spinner for Polymer 2 that also supports progress indication

Demo and API Docs

Usage

<!-- an indeterminate spinner -->
<progress-spinner active></progress-spinner>

<!-- a pink indeterminate spinner -->
<style>
  progress-spinner[pink] {
    --spinner-color: pink;
  }
</style>
<progress-spinner active pink progress=0></progress-spinner>

<!-- a spinner displaying 70% progress -->
<progress-spinner active progress=.7></progress-spinner>

Styling

The following custom properties are available for styling:

Custom property Description Default
--spinner-color Color or the spinner --primary-color, #2196F3

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • polymer#2.0.0-rc.3
  • iron-component-page#2.0-preview
  • iron-demo-helpers#2.0-preview
Released
2017-03-20
Maturity
IMPORTED
License
MIT License

Compatibility

Framework
Polymer 2.0+
Browser
Browser Independent

progress-spinner - Vaadin Add-on Directory

a material design inspired spinner that also supports progress indication progress-spinner - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/Juravenator/progress-spinner](https://github.com//Juravenator/progress-spinner/blob/0.1.2/README.md) on 2019-05-10 ]** # progress-spinner a material design inspired spinner for Polymer 2 that also supports progress indication _[Demo and API Docs](https://juravenator.github.io/progress-spinner/components/progress-spinner/)_ ## Usage ```html ``` ## Styling The following custom properties are available for styling: Custom property | Description | Default ----------------|-------------|---------- `--spinner-color` | Color or the spinner | `--primary-color`, `#2196F3`
Online