Spinner
A spinning animation that indicates loading.
This is a pass through component from React-Bootstrap.
See React-Bootstrap for documentation.
Basic Usage
Show editable code example
Any Paragon component or export may be added to the code example.
Color Variants
Show editable code example
Any Paragon component or export may be added to the code example.
Theme Variables (SCSS)#
$spinner-width: 2rem !default;$spinner-height: $spinner-width !default;$spinner-border-width: .25em !default;$spinner-width-sm: 1rem !default;$spinner-height-sm: $spinner-width-sm !default;$spinner-border-width-sm: .2em !default;
Props API#
Spinner Props API
- className
string
Specifies the class name for the component.
- screenReaderText
node
Specifies the screen reader content for a11y.
Usage Insights#
Spinner
Project Name | Paragon Version | Instance Count | |
---|---|---|---|
edx-ora2 | 20.9.2 | 1 | |
frontend-app-account | 20.46.3 | 4 | |
frontend-app-admin-portal | 20.46.3 | 17 | |
frontend-app-authn | 20.46.2 | 2 | |
frontend-app-communications | 20.46.2 | 1 | |
frontend-app-course-authoring | 20.46.2 | 4 | |
frontend-app-discussions | 20.44.0 | 11 | |
frontend-app-learner-dashboard | 20.46.2 | 2 | |
frontend-app-learner-portal-enterprise | 20.45.4 | 1 | |
frontend-app-learning | 20.46.0 | 3 | |
frontend-app-library-authoring | 21.5.6 | 1 | |
frontend-app-ora-grading | 20.46.3 | 3 | |
frontend-app-publisher | 20.46.2 | 2 | |
frontend-app-support-tools | 20.46.0 | 1 | |
frontend-component-header-edx | 21.5.6 | 1 | |
frontend-lib-content-components | 21.5.6 | 12 | |
frontend-lib-special-exams | 20.44.0 | 2 | |
prospectus | 20.46.2 | 4 |